Class

NSLayoutGuide

A rectangular area that can interact with Auto Layout.

Declaration

@interface NSLayoutGuide : NSObject

Overview

Use layout guides to replace the dummy views you may have created to represent inter-view spaces or encapsulation in your user interface. Traditionally, there were a number of Auto Layout techniques that required dummy views. A dummy view is an empty view that does not have any visual elements of its own and serves only to define a rectangular region in the view hierarchy. For example, if you wanted to use constraints to define the size or location of an empty space between views, you needed to use a dummy view to represent that space. If you wanted to center a group of objects, you needed a dummy view to contain those objects. Similarly, dummy views could be used to contain and encapsulate part of your user interface. Dummy views let you break up a large, complex user interface into self-contained, modular chunks. When used properly, they could greatly simplify your Auto Layout constraint logic.

There are a number of costs associated with adding dummy views to your view hierarchy. First, there is the cost of creating and maintaining the view itself. Second, the dummy view is a full member of the view hierarchy, which means that it adds overhead to every task the hierarchy performs. Worst of all, the invisible dummy view can intercept messages that are intended for other views, causing problems that are very difficult to find.

The NSLayoutGuide class is designed to perform all the tasks previously performed by dummy views, but to do it in a safer, more efficient manner. Layout guides are not views. They do not use as much memory, and they do not participate in the view hierarchy. Instead, they simply define a rectangular region in their owning view’s coordinate system that can interact with Auto Layout.

Creating Layout Guides

To create a layout guide, perform the following steps:

  1. Instantiate a new layout guide.

  2. Add the layout guide to a view by calling the view’s addLayoutGuide: method .

  3. Define the position and size of the layout guide using Auto Layout.

You can use these guides to define the space between elements in your layout. The following example shows how to use layout guides to define an equal spacing between a series of views.

NSLayoutGuide *space1 = [[NSLayoutGuide alloc]init];
[self.view addLayoutGuide:space1];
 
NSLayoutGuide *space2 = [[NSLayoutGuide alloc] init];
[self.view addLayoutGuide:space2];
 
[space1.widthAnchor constraintEqualToAnchor:space2.widthAnchor].active = YES;
[self.saveButton.trailingAnchor constraintEqualToAnchor:space1.leadingAnchor].active = YES;
[self.cancelButton.leadingAnchor constraintEqualToAnchor:space1.trailingAnchor].active = YES;
[self.cancelButton.trailingAnchor constraintEqualToAnchor:space2.leadingAnchor].active = YES;
[self.clearButton.leadingAnchor constraintEqualToAnchor:space2.trailingAnchor].active = YES;

A layout guide can also act as a “black box” that contains other views and controls, letting you encapsulate parts of your view and break up your layout into modular chunks.

NSLayoutGuide *container = [[NSLayoutGuide alloc] init];
[self.view addLayoutGuide:container];
 
// Layout the contents of the container
[self.button.lastBaselineAnchor constraintEqualToAnchor:self.textField.lastBaselineAnchor].active = YES;
[self.textField.leadingAnchor constraintEqualToAnchor:self.button.trailingAnchor constant:8.0].active = YES;
[self.textField.trailingAnchor constraintEqualToAnchor:container.trailingAnchor].active = YES;
[self.textField.topAnchor constraintEqualToAnchor:container.topAnchor].active = YES;
[self.textField.bottomAnchor constraintEqualToAnchor:container.bottomAnchor].active = YES;
 
// Set exterior constraints.
 
[container.leadingAnchor constraintEqualToAnchor:self.view.leadingAnchor constant:20.0].active = YES;
[container.trailingAnchor constraintEqualToAnchor:self.view.trailingAnchor constant:20.0].active = YES;
[container.topAnchor constraintEqualToAnchor:self.view.topAnchor constant:20.0].active = YES;

Topics

Working With Layout Guides

identifier

A string used to identify the layout guide.

frame

The layout guide’s frame in its owning view’s coordinate system.

owningView

The view that owns this layout guide.

Creating Constraints Using Layout Anchors

bottomAnchor

A layout anchor representing the bottom edge of the layout guide’s frame.

centerXAnchor

A layout anchor representing the horizontal center of the layout guide’s frame.

centerYAnchor

A layout anchor representing the vertical center of the layout guide’s frame.

heightAnchor

A layout anchor representing the height of the layout guide’s frame.

leadingAnchor

A layout anchor representing the leading edge of the layout guide’s frame.

leftAnchor

A layout anchor representing the left edge of the layout guide’s frame.

rightAnchor

A layout anchor representing the right edge of the layout guide’s frame.

topAnchor

A layout anchor representing the top edge of the layout guide’s frame.

trailingAnchor

A layout anchor representing the trailing edge of the layout guide’s frame.

widthAnchor

A layout anchor representing the width of the layout guide’s frame.

Instance Properties

Relationships

Inherits From

See Also

View Layout

NSLayoutConstraint

The relationship between two user interface objects that must be satisfied by the constraint-based layout system.

NSLayoutDimension

A factory class for creating size-based layout constraint objects using a fluent API.

NSLayoutAnchor

A factory class for creating layout constraint objects using a fluent API.

NSLayoutXAxisAnchor

A factory class for creating horizontal layout constraint objects using a fluent API.

NSLayoutYAxisAnchor

A factory class for creating vertical layout constraint objects using a fluent API.

NSDictionaryOfVariableBindings

Creates a dictionary wherein the keys are string representations of the corresponding values’ variable names.

NSUserInterfaceCompression

A protocol that describes how a UI control should redisplay when space is restricted.