Search code examples
iosuiimageviewnslayoutconstraintprogrammatically-createdios-autolayout

Autolayout programmatically and UIImageView


I am trying to layout some views in code. At runtime I need to check how many deals we have and then layout the code appropriately. I have a UILabel and a UIImageView.

I create the objects as follows:

UILabel *numberOfDealsLabel = [UILabel new];
[numberOfDealsLabel setFont:[UIFont fontWithName:@"HelveticaNeue-CondensedBold" size:50]];
numberOfDealsLabel.translatesAutoresizingMaskIntoConstraints = NO;
numberOfDealsLabel.textColor = [UIColor whiteColor];
[numberOfDealsLabel setTextAlignment:NSTextAlignmentCenter];
numberOfDealsLabel.numberOfLines = 1;
numberOfDealsLabel.text = [NSString stringWithFormat:@"%d", 2];
[numberOfDealsLabel sizeToFit];
numberOfDealsLabel.preferredMaxLayoutWidth = view.frame.size.width;
[view addSubview:numberOfDealsLabel];

UIImageView *dealsImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"deal"]];
[view addSubview:dealsImage];

The view is just a square. From here I am trying to add the following constraints so that both views hug the top of the view and share the space horizontally.

[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[numberOfDealsLabel][dealsImage]|" options:nil metrics:nil views:views]];

[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[numberOfDealsLabel]|" options:nil metrics:nil views:views]];

[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[dealsImage]|" options:nil metrics:nil views:views]];

I am getting the following error:

Probably at least one of the constraints in the following list is one you don't want. Try this: (1) look at each constraint and try to figure out which you don't expect; (2) find the code that added the unwanted constraint or constraints and fix it. (Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints)

This error is being caused by the following constraint:

[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[numberOfDealsLabel][dealsImage]|" options:nil metrics:nil views:views]];

I don't understand why this is causing an issue. My first thought was because the UILabel was too big and the size of that plus the image was causing a problem. However I changed the text size to a very small number and I still have the same problem.

Any advice on what might be causing this problem would be great.


Solution

  • From what it look like, you aren't calling "translatesAutoresizingMaskIntoConstraints = NO" on the UIIamgeView, this should help at least a little bit if not just fix the entire problem

    so, this is first thing I would do if I were you:

    UIImageView *dealsImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"deal"]];
    [dealsImage setTranslatesAutoresizingMaskIntoConstraints:FALSE]; //this is new code
    [view addSubview:dealsImage];
    

    From Apple:

    For views that are aware of Auto Layout, in most circumstances you want translatesAutoresizingMaskIntoConstraints to be NO.

    https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/AutolayoutPG/AdoptingAutoLayout/AdoptingAutoLayout.html