BT

Facilitating the Spread of Knowledge and Innovation in Professional Software Development

Write for InfoQ

Topics

Choose your language

InfoQ Homepage News iOS Auto Layout with Masonry

iOS Auto Layout with Masonry

Leia em Português

This item in japanese

Bookmarks

Open Source project Masonry aims to make Auto Layout code more concise and readable.

Masonry, “a light-weight layout framework which wraps Auto Layout with a nicer syntax”, enables a XIB- and Storyboard-free experience. Its creator, Jonas Budelmann, argues that while Auto Layout is powerful it quickly becomes verbose and unreadable.

Masonry is a domain specific language (DSL) offering all the capabilities provided by Auto Layout with convenience methods for making and updating constraints, accessing attributes, setting priorities and debug support.

Sample code on GitHub is designed to show typical usage and Masonry’s succinct syntax:

UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10);

[view1 mas_makeConstraints:^(MASConstraintMaker *make) {
   make.edges.equalTo(superview).with.insets(padding);
}];

Central to Auto Layout is the constraint: a mathematical representation of a relationship between UI elements. Constraints comprise size, relative positions managed by priorities and thresholds. They are additive making it possible for constraints to conflict and insufficient constraints lead to ambiguity. Both scenarios can throw exceptions.

Programmatic creation of constraints without using Masonry is possible by creating an NSLayoutConstraint with references to views and specifying attributes and relationships. Apple also provides the Visual Format Language; another DSL for describing relationships in text.

Auto Layout is neither mandatory nor exclusive with “springs and struts” still a valid approach. “Springs and struts”, or autoresizing masks, determines how a view responds when its parent view changes bounds.

Apple provides compelling reasons to adopt Auto Layout:

  • “Springs and struts” requires code to support multiple orientations, different screen sizes and dynamic content.
  • Dynamic Type in iOS 7 allows users to specify a prefered text size in apps.
  • Supporting both iOS 6 and iOS 7 and their different element metrics.

Auto Layout is not without fundamental issues. Apple provides guidance on how to use Auto Layout with the commonly used UIScrollView. Matt Neuburg provides a convincing argument on why “Auto Layout does not play at all well with view transforms” suggesting greater use of layer transforms to compensate.

Any kind of Auto Layout code means you will not gain from the Interface Builder  enhancements made available in Xcode 5. Specifically the ability to visually resolve Auto Layout issues and the preview mode in the assistant editor that lets you view the runtime layout in different orientations, different iOS versions and different device sizes.

Rate this Article

Adoption
Style

Hello stranger!

You need to Register an InfoQ account or or login to post comments. But there's so much more behind being registered.

Get the most out of the InfoQ experience.

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Community comments

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

BT