Autolayout not working as expected

1
votes

I am trying to build an app with Autolayout. Tried it using storyboard and also programmatically but no luck. Views are not behaving as expected.

This is the output screens. (Targeting iOS7)

This is the output screens.

Problems: I want green button to be just above the red button with 10px vertical gap. But the red button is getting overlapped on 3.5 inch display, its proper on 4 inch display.

Below is the code I tried.

        [self.btnGreen setTranslatesAutoresizingMaskIntoConstraints:NO];

        [self.viewContainer addConstraint:[NSLayoutConstraint constraintWithItem:self.btnGreen attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:self.viewContainer attribute:NSLayoutAttributeHeight multiplier:1.0 constant:100.0]];


        [self.viewContainer addConstraint:[NSLayoutConstraint constraintWithItem:self.btnGreen attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:self.viewContainer attribute:NSLayoutAttributeWidth multiplier:1.0 constant:100.0]];

I have Refereed below links: 1) Apple guideline 2) http://matthewmorey.com/ 3) Also this one

But not getting desired output.

Any help will be appreciated.

1
iosios7autolayout
There's no need to specify a second item if you're just constraining width or height to a constant. You can do: [NSLayoutConstraint constraintWithItem:self.btnGreen attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute: NSLayoutAttributeNotAnAttribute multiplier:0 constant:width]; instead. – James Frost
It looks as though your green button wouldn't even fit in the gap between your red button and the white box above? How would you like the layout to look? – James Frost

1 Answers

2
votes

Try these constraints shown in Figure : enter image description here