What is setTranslatesAutoresizingMaskIntoConstraints:NO for?

Question

In some project that I try to understand there is some code:

[[[self foregroundContentView] contentView] addSubview:[self hueLabel]];
[[[self foregroundContentView] contentView] addSubview:[self hueSlider]];

[[[self foregroundContentView] contentView] addSubview:[self saturationLabel]];
[[[self foregroundContentView] contentView] addSubview:[self saturationSlider]];

[[[self foregroundContentView] contentView] addSubview:[self brightnessLabel]];
[[[self foregroundContentView] contentView] addSubview:[self brightnessSlider]];

[[[self foregroundContentView] contentView] addSubview:[self saveButton]];


[[self foregroundContentScrollView] addSubview:[self foregroundContentView]];
[[self foregroundContentScrollView] addSubview:[self imageView]];

[[self view] addSubview:[self backgroundView]];
[[self view] addSubview:[self foregroundContentScrollView]];

Every view has a property setTranslatesAutoresizingMaskIntoConstraints set to NO, for instance:

[[self saveButton] setTranslatesAutoresizingMaskIntoConstraints:NO];

Then it adds some constraints to these views:

    NSDictionary* views = @{
                        @"backgroundView" : [self backgroundView],
                        @"foregroundContentScrollView" : [self foregroundContentScrollView],
                        @"foregroundContentView" : [self foregroundContentView],
                        @"hueLabel" : [self hueLabel],
                        @"hueSlider" : [self hueSlider],
                        @"saturationLabel" : [self saturationLabel],
                        @"saturationSlider" : [self saturationSlider],
                        @"brightnessLabel" : [self brightnessLabel],
                        @"brightnessSlider" : [self brightnessSlider],
                        @"saveButton" : [self saveButton],
                        @"imageView" : [self imageView]
                        };

[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[backgroundView]|" options:0 metrics:nil views:views]];
[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[backgroundView]|" options:0 metrics:nil views:views]];

[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[foregroundContentScrollView]|" options:0 metrics:nil views:views]];
[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[foregroundContentScrollView]|" options:0 metrics:nil views:views]];

[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[foregroundContentView]|" options:0 metrics:nil views:views]];
[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[foregroundContentView]|" options:0 metrics:nil views:views]];

[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[hueLabel]-|" options:0 metrics:nil views:views]];
[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[hueSlider]-|" options:0 metrics:nil views:views]];
[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[saturationLabel]-|" options:0 metrics:nil views:views]];
[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[saturationSlider]-|" options:0 metrics:nil views:views]];
[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[brightnessLabel]-|" options:0 metrics:nil views:views]];
[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[brightnessSlider]-|" options:0 metrics:nil views:views]];
[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[saveButton]-|" options:0 metrics:nil views:views]];
[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[imageView(==foregroundContentScrollView)]|" options:0 metrics:nil views:views]];

[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(>=30)-[hueLabel]-[hueSlider]-[saturationLabel]-[saturationSlider]-[brightnessLabel]-[brightnessSlider]-[saveButton]-(>=10)-[imageView(==200)]|" options:0 metrics:nil views:views]];

The questions are:

• what is setTranslatesAutoresizingMaskIntoConstraints:NO for? Why when I remove one of line with that method, then everything is broken?

• what that line do?

  [[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[foregroundContentScrollView]|" options:0 metrics:nil views:views]];
  

Answer 1

Auto layout is a relatively recent feature. That means there are three types of code out there:

• Code which is unaware of auto layout. It uses the springs-and-struts approach because it doesn't know about anything else.
• Code which is aware of auto layout but chooses to use springs-and-struts, at least in some circumstances.
• Code which uses auto layout.

This applies to your code, the code of the frameworks (UIKit), and the code of third-party libraries.

Because of the existence of the first type of code, all views must have the old springs-and-struts behavior by default. Code which is aware of auto layout can turn that off if it wants, but code which is unaware obviously couldn't turn it on, because it doesn't know it has to or what property to set to do so.

Because the old springs-and-struts behavior would conflict with most ways that auto layout is used, code which uses auto layout usually has to turn it off. It does so by setting the translatesAutoresizingMaskIntoConstraints property to NO.

That decision has to be left to the controller code which places the view in question into the view hierarchy, because only that code knows how it wants to arrange the view in the layout (or, in the case of the first type of code, doesn't "know" but uses springs-and-struts out of ignorance).

If you fail to clear translatesAutoresizingMaskIntoConstraints in your controller code that uses auto layout, you will usually get exceptions due to unsatisfiable constraints. The exceptions will be caught and mostly ignored, but the auto layout system will have to ignore some of your constraints to complete layout. As a consequence, your views may be laid out incorrectly.

This line:

[[self view] addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[foregroundContentScrollView]|" options:0 metrics:nil views:views]];

adds constraints which keep the foregroundContentScrollView filling its superview horizontally. That view's leading edge will be made to equal its superview's leading edge, and its trailing edge will be made to equal its superview's trailing edge.