CODEWITHSUNDEEP
iosxcode5autolayout
rdurand
rdurand

Reputation: 7410

Autolayout is expecting a different height

I'm struggling with autolayout in my iOS 7 project on Xcode 5. Let's say I want to show these buttons :

    Something
        -
        |                      10 pts fixed space from top
        -
     Button 1                  50 pts height on 4" display, reduce height if 3"5
        -
        |                      10 pts fixed space
        -
     Button 2                  50 pts height on 4" display, reduce height if 3"5

I layout my buttons in Interface Builder (with a storyboard).

Then I start adding constraints :

Problem is Autolayout is complaining about my button's, saying "Expected: height=30". Why ? I want a 50 pts button, why is this a problem ? Of course, I can fix this by adding a height constraint, but I want the height to be reduced if the height of the screen is reduced. And, if I run it, even on a 4" display, the button's height is set to 30, as autolayout said it "should be".. And I didn't even set the second button's constraints yet, which will make it even worse.

How can I achieve such a thing ? It seems really basic and I still don't understand what's going on.

Note that I could manually set all the heights in code, but I really want to avoid that.

Upvotes: 5

Views: 4244

Answers (3)

rdurand
rdurand

Reputation: 7410

Ok, I think I made it.

Here is what I did :

  • I set all my constraints in the storyboard, with the Retina 4" form-factor.

  • Constraints for the something view : fixed height & width, fixed top space and leading space. This view is absolutely fixed.

  • Constraints for button 1 : fixed vertical space to something view, fixed leading space, fixed width. 2 height constraints : 30 <= height <= 50.

  • Constraints for button 2 : fixed vertical space to button 1, fixed leading space, fixed width. Also 2 height constraints : 30 <= height <= 50. And fixed bottom space to bottom layout.

All constraints have a maximum priority of 1000, except the last one (fixed bottom space to bottom layout), which is set at 900 !

That way, the buttons keep a height >=30 and move up, but get shrinked vertically because the other constraints are more important.

Thanks a lot to @VasiliyDeych and @P.Sami for their advice. It helped a lot.

Upvotes: 2

P. Sami
P. Sami

Reputation: 2207

What you can do for solving the vertical constraint issue is to give Equal constraints to your button1 and button2 and give a fixed vertical constraint to the something view and from your second button to the bottom of the superview.

So this way you won`t need to give a fixed height to any of them and the distance between them and other elements (something and bottom of superview) will be standard.

I hope this helps!

Upvotes: 2

Vasiliy Kulakov
Vasiliy Kulakov

Reputation: 5491

You're going to need to show us how your constraints are set up.

Constraints are a set of rules that the views must follow. If there is no rule saying the button must shrink with the parent view, it will not happen.

Based on your example, if I understood it correctly, you would want a set of constraints like this (defined in VFL for ease):

[yourParentView addVisualConstraints:@"V:|[something(100@75)]-(10@100)-[button1(<=50,>=30@100)]-(10@100)-[button2(button1@100)]-(>=300@50)-|"
                  forViews:NSDictionaryOfVariableBindings(something,button1,button2)];

All constraints here are vertical (V:), the numbers in parentheses represent a number of points, followed by @ and the desired priority of maintaining that number of points. The | symbols represent the top and bottom edges of the superview. So ]-(>=300@50)-| is saying, I'd like to keep 300 or more pixels between button2 and the bottom of the superview, but I care about it with a priority of 50. button1(<=50,>=30@100) means I really care that this button is between 30 and 50 pixels in height, with a priority of 100. button2(button1) means I want button2 to be the same height as button1. I also really care about keeping that 10-point distance between my elements. And I somewhat care that something (which is flush to the superview's top edge, hence |[) is going to stay at 100 points tall.

Does this not work for what you are intending to do?

Upvotes: 1

Related Questions