Basic VFL Constraints

Among the many ways to use Auto Layout in iOS development – Apple’s Visual Formatting Language is one of the more difficult concepts I’ve had to get my head around. I thought I would write down some simple swift examples to get you started if you’ve just joined the party.

What is it?

The Visual Formatting Language or VFL is a tool that lets us create auto layout constraints with strings that contain layout instructions or ‘Grammar’. For example, the following VFL string defines the horizontal constraints on a UIView, the view will be pinned to the left and right of it’s super view with 10px padding.



Firstly ensure that any objects you want to add constraints to have been added to your super view and they have setTranslatesAutoresizingMaskIntoConstraints set to false

var viewObject = UIView()

To use VFL with our objects we need a way of assigning each object a name that can be used in the VFL string, the way to do this is to make a simple dictionary as below.

var viewDict = ["view":viewObject]

The same goes for adding any padding, if we want computed values we set these up in a dictionary.

var metricDict = ["padding":10]

Now we can construct our VFL strings, you need one for each ‘direction’ or ‘column’ Horizontal and Vertical constraints.

var horizontal = "H:|-(padding)-[view]-(padding)-|"
var vertical = "V:|-(padding)-[view]-(padding)-|"

The last step is to create the NSLayoutConstraints and add them to your viewObject’s super view.

var hConstraints = NSLayoutConstraint.constraintsWithVisualFormat(horizontal, options: nil, metrics: metricDict, views: viewDict)
var vConstraints = NSLayoutConstraint.constraintsWithVisualFormat(vertical, options: nil, metrics: metricDict, views: viewDict)


The result of all this is a pretty basic view with 10px padding the whole way around the screen, however coding layouts in this way means that much more complex layouts can be achieved with far less code.

To read more about VFL layouts, syntax and a whole list of Grammar that can be used within VFL strings, checkout Apple’s documentation at the link below.

Got The Puns

Me and my mate Joe are building a database of puns. It’s a custom build that makes use of php, jquery (ajax) and MySQL.


We want to provide a fun search engine that gives users puns based on topics and keywords they use everyday. We also want to use search data to expand our database, follow popular topics and create content based on suggested terms and keywords.

Screen Shot 2015-01-15 at 10.50.37


The app is currently in test and we have entered about 500 puns in to the database. We are currently testing the best search queries to present the most relevant information to users and building the majority of the front facing pages.

If you like a good ol pun, watch this space.

Red Arrows

Here are a few of snaps of the red arrows at the Bournemouth Air Festival 2014

Swifty Swift

I’ve been mucking around with swift, Apple’s new programming language, If you ask me – it’s pretty sweet and makes development quicker and easier to understand.

Objective Comparisons.

Defining a variable in ObjC requires type and pointer, swift does not require strict type definition however still allows for it in a more readable fashion.
// ObjC
NSString *name = @"Luke";
// Swift
var name:String = "Luke";

Initialising my object class in ObjC vs Swift – Similar length in code but swift is a clearer solution, no manual memory allocation required and clear coordinate + size definitions.
// ObjC
object *object_instance = [[object alloc] initWithFrame:CGRectMake(0,0,100,100)];
// Swift
var object_instance = object(frame:CGRect(x: 0, y: 0, width: 100, height: 100));

Writing a function in ObjC requires strict scope and return type. Calling the function requires ‘self’. Swift simplifies ‘func’ definition and calling the function is cleaner with params in normal brackets ().
// ObjC
- (void)createObject { //my code } [self createObject];
// Swift
func createObject() { //my code } createObject();


The screenshot below is a simple app I wrote that adds a circle in a random position each time the user taps the screen, I made sure that the circles cannot go outside the bounds of the View Controller by adding a range within my randomisation code.

Screen Shot 2014-08-24 at 11.20.53