AutoLayout : Relative scaling of views

Question

I want to achieve consistent views across different screens. My layout constraints works on small screens perfectly but it scrambles on large screens.

I have made a view(Red Border indicating that view)and pin it in to the main super view. Then I have made sub views and put it inside that view. I have pinned the the top bottom trailing and leading edge of the layout which contains button of the it's parent view (Red Border indicating that view). The view containing button is looking like this in small screen (iPhone 5)

enter image description here

while it's looking in big screens like this (iPhone 6 and above)

enter image description here

I want this layout to have the same relative height in all the screens like the other views. How can I achieve this?

Are those views part of a tableview/collectionview or are they 4 views with the same size next to each other? — Lucas Derraugh, Sep 27 '16 at 05:49
they all are the separate views vertically arranged over each other — osama, Sep 27 '16 at 05:55
sir i have tried stack views but actually i am new to iOS have little grip over it that;s why i am not getting the results i want — osama, Sep 27 '16 at 05:57
@OsamaBinBashir Try to check out this answer, there is a nice example how to achieve a height dependent on other view(s). http://stackoverflow.com/a/39306279/661022 — pedrouan, Sep 27 '16 at 06:00
@OsamaBinBashir There is also this really nice tutorial here: http://www.appcoda.com/stack-views-intro/ — Lucas Derraugh, Sep 27 '16 at 06:00
Well, you have a taller device, so something is going to have to stretch. Where do you want the extra space to go? — Paulw11, Sep 27 '16 at 06:14

woogii · Accepted Answer · 2016-09-27T06:07:31.743

1

I guess you can use UIView that contains a button inside and set bottom,lead,trailing,top constraints for the UIView. Then you can set height constraint of that UIView and set multiplier values to have relative height to its superView(=Red box). Finally, you can set constraints for your button inside the UIView whatever you want. If you know how to use StackView, I recommend you to use it because it is easy and simple solution. Here is very good tutorial about StackView.

edited Sep 27 '16 at 06:07

answered Sep 27 '16 at 06:00

woogii

413
3
11

Stack view has done the trick for me thanks mate :D that tutorial is also very help full :D – osama Sep 27 '16 at 10:38

score 0 · Answer 2 · answered Sep 27 '16 at 05:52

0

If height is constant for subview except that button view the layout will be like what you mentioned in the first image .If you kept height as constant for that button view the problem will be solved

answered Sep 27 '16 at 05:52

Vignaya

1
1

Can you supply an example code as well? This will help in better understanding. – Ankit Sep 27 '16 at 06:07
For Linear Layout ie If View is arranged Vertically and for every view, if you want fixed height you have to set height as a constant for every subview under the main view.By seeing your image I guess so you didn't set a constant height for button subview – Vignaya Sep 27 '16 at 06:52

AutoLayout : Relative scaling of views

2 Answers2