Layout Attributes Relative to the Layout Margin on iOS Versions Prior to 8.0

Layout attributes relative to the layout margin on iOS versions prior to 8.0

Disable "Prefer margin relative"

Sample Image

Attribute Unavailable warning on iOS versions prior to 8.0

Since I had already created the constraints, the answer was to click on the constraint, and then look in the Utilities bar (on the right). As shown in the picture below, click on an item and then make sure that "relative to margin" is unchecked.

Relative to margin screenshot

Attribute Unavailable: First baseline layout attribute on iOS versions prior to 8.0

Found the issue. This new constraint was added to iOS 8.0 and isn't supported with previous versions.

To get rid of this warning and allow iOS 7 builds to work you need to:

1. Click on the warning in the side bar (this should highlight the offending constraint)

2. Change that constraint to something other than "First Baseline". "Center Y" worked well for me. You'll have to play with the options and can see the changes live to see which alternative works for you.

iOS 7 now builds again and warning is gone.

Sample Image

Storyboard warning : First baseline layout attribute before iOS 8.0

I think the issue is you have many constraints that are using NSLayoutAttributeFirstBaseline and when you click on the warning Xcode is pointing to wrong constraint.

To identify the constraints search in Xcode with "firstBaseline". Change all constraints that are using NSLayoutAttributeFirstBaseline.

Sample Image

Note: You may need to adjust your views. In my case NSLayoutAttributeBaseline worked well.

NSLayoutAttributeFirstBaseline

The object’s baseline. For objects with more than one line of text, this is the baseline for the topmost line of text.
The object’s baseline. For objects with more than one line of text, this is the baseline for the topmost line of text.
Available in iOS 8.0 and later.

NSLayoutAttributeBaseline

The object’s baseline.
The object’s baseline.
Available in iOS 6.0 and later.

What is Constrain to margin in Storyboard in Xcode 6

I don't understand at all why people are complaining that "Margins would cause an outright crash on anything prior to iOS 8."

Setting your constraints relative to margin in a xib file or storyboard DOES NOT make your app crash on iOS7, and it DOES NOT make a UI difference on your iOS7 device neither, as long as you don't touch the UIView.layoutMargins and UIView.preservesSuperviewLayoutMargins properties in your code.

What is Margins in iOS8

Layout margins represent padding around the interior of a UIView that the layout system can use when laying out subviews - to ensure that a gap is left between the edge of a view and a subview. In this respect it is very much like the padding property associated with blocks in CSS.

Sample Image

By default, a UIView has layout margins of 8 points on each side, and this can not be changed in Interface Builder. However, by setting the UIView.layoutMargins property in the code, which is only available on iOS8, you are able to adjust these values.

You can get IB to display the margins with Editor > Canvas > Show Layout Rectangles:
Sample Image

Margins can be used to help layout your views and subviews. Every UIView come with margins by default, but they only affect view placement when you set up a constraint that is related to a margin.

How to use Margins

The only way to use margins in Interface Builder is to check the Relative to margin option while configuring your constraints. This is how you direct your constraint to Use margins instead of edges when laying out my view.

Sample Image

Let's take a look at four different ways of setting up a leading constraint between a view and its subview. For each constraint we review the first association described will be the subview's leading, and the second will be superview's leading. What you want to pay close attention to is the check and uncheck status of the Relative to margin option of each constraint end, because that defines whether the constraint is tied to the margin or the edge of the view.

  1. First item(uncheck), second item(check): In this case, we're declaring that subview's left edge should align to superview's left margin(as shown in this image).

Sample Image


  1. First item(uncheck), second item(uncheck): Both using edge, not margin. In this case, we're declaring that subview's left edge should align to superview's left edge.

Sample Image


  1. First item(check), second item(uncheck): In this case, we're declaring that subview's left margin should align to superview's left edge. This kind of layout actually makes the subview overlap the superview.

Sample Image


  1. First item(check), second item(check). This actually has a same effect as case 2, since both subview and superview has a same default margin. We're declaring that subview's left margin should align to superview's left margin.

Sample Image

What is good about Margins

This new feature (iOS8) only impacts UI development if you decide to use margins.

By using margins you can adjust the placement of multiple subviews that share a common relation to a shared superview by changing the value of a single property. This is a clear win over setting all associated constraints with fixed values, because if you need to update all the spacing, instead of changing each value one by one, you can simultaneously modify all relevant placement by updating the superview's margin with a single line of code like this one:

self.rootView.layoutMargins = UIEdgeInsetsMake(0, 50, 0, 0);

To illustrate this benefit, in the following case all subviews' left edges are aligned to their superview's left margin. Thus, changing superview's left margin will affect all subviews at the same time.

Sample Image

iOS - Constraints Margins warning - UIView inside UITableViewCell

Click on each constraint and make sure that none of them are have the "relative to margin" set on either "First Item" or "Second Item". Unselecting the relative to margin will then require you to reset the constant on the constraint. Attached are some screen shots for reference:

Constraint Property Inspector
Constraint Item Properties

Building a project in Xcode5.1 that was modified in Xcode 6 GM for testing older versions of iOS

Adding almost any type of layout constraint with Xcode 6 will render a storyboard (or .xib file) incompatible with Xcode 5.1. If you need to work with a storyboard in Xcode 5.1 that has been modified with Xcode 6.0 it will be necessary to remove all "margin" based constraints.

Perform these steps to make a storyboard modified by Xcode 6 load and compile again with Xcode 5:

Using Xcode 6:

  1. Set the "Opens in" to Xcode 5.1 in the Interface Builder Document Section of the storyboard File Inspector. When this is set, Xcode 6.0 will generate a warning if there are any incompatible margin constraints present.

    Layout attributes relative to the layout margin on iOS versions prior to 8.0

  2. One easy way to identify the margin constraints is to open the storyboard in a text editor (preferably one that auto refreshes when the file is changed on disk). Search for the word "Margin" and look for lines like this:

    <constraint firstItem="gZc-ET-UKM" firstAttribute="leading" secondItem="MMQ-IT-qOo" secondAttribute="leadingMargin" constant="-8" id="H3i-wo-2Mm"/>
  3. These constraints need to be either deleted or updated to be based directly on the superview rather than a margin. It is possible to update the constraint instead of deleting it by selecting the constraint in the outline view and then going to the Size Inspector and unchecking "Relative to margin" option in the drop down menu for the First Item or Second Item settings. Once you do that, you'll also need to add a constant that matches the margin (usually 8).

    Relative To Margin Image

As you delete or update each constraint you should see the storyboard file in the text editor update and remove the word "Margin". Once you have deleted all of the incompatible constraints the warning will go away and this line will disappear from the storyboard file:

    <capability name="Constraints to layout margins" minToolsVersion="6.0"/>

  1. If you deleted the constraints, the final step is to open the project in Xcode 5 and recreate them.


Related Topics



Leave a reply



Submit