Distributing views evenly in Interface Builder

Posted on

Having horizontal buttons that fill the whole width of a screen is a common thing in any layout.

I found many examples where people created categories for UIView, which is the way to go if you are not using interface builder and/or have a dynamic number of views.

In that case, I would recommend using a wrapper for auto layout rather than writing your own. My plugin of choice is FLKAutoLayout.
Spacing out views with FLKAutoLayout becomes as simple as

// space out views horizontally with 20 points in between
[UIView spaceOutViewsHorizontally:views predicate:@"20"]; // views is an array of views, obviously

Wow, that was easy, wasn’t it?

But wait: we only have static views! Do we even need a single line of code? Nope!

In the following video, I will explain my approach to distributing views evenly. Although I am using only two static views/buttons in this example, it will work with any number of views.

ARVE Error: Mode: lazyload is invalid or not supported. Note that you will need the Pro Addon for lazyload modes.

Thanks for watching!
As always, if you have any comments, ideas or other approches, feel free to comment below!