How to change aspect ratio of a UIView

Question

I have a custom UIView which uses autolayout programatically to set the size of the frame. For this purpose, I set a constraint on the width property of the view to be equal to that of the superview and then a constraint of the aspect ratio to be some hard coded value

//width constraint
NSLayoutConstraint *widhtConstraint=[NSLayoutConstraint constraintWithItem:entryView
                                                                 attribute:NSLayoutAttributeWidth
                                                                 relatedBy:NSLayoutRelationEqual
                                                                    toItem:scrollView
                                                                 attribute:NSLayoutAttributeWidth
                                                                multiplier:1.0f
                                                                  constant:8.0f];

[scrollView addConstraint:widhtConstraint];

//aspect ratio constraint
NSLayoutConstraint *aspectRatioConstraint=[NSLayoutConstraint constraintWithItem:entryView
                                                                       attribute:NSLayoutAttributeWidth
                                                                       relatedBy:NSLayoutRelationEqual
                                                                          toItem:entryView
                                                                       attribute:NSLayoutAttributeHeight
                                                                      multiplier:80.0/27.0//aspect ratio same as formula view
                                                                        constant:0.0f];

[scrollView addConstraint:aspectRatioConstraint];

Please refer image:

Constraint setup

I wish to change the aspect ratio of this frame on touch of a button(View More) by increasing its height and then later resize it back to original on touching the same button.Additionally how do I figure out the total height of the view governed by all its subviews such that each subview is visible without clipping.(Basically the standard collapse feature)

How do I manipulate the aspect ratio constraint such that it contains all the subviews under it? — Nikhil Verma, Apr 27 '15 at 03:39
Can you suggest how I could dynamically change the 'aspectRatioConstraint' multiplier property(which in this case tells the aspect ratio of the view) . Being new to Autolayout, I couldn't find anything online either. — Nikhil Verma, Apr 27 '15 at 05:09

score 0 · Answer 1 · answered Apr 26 '15 at 21:44

You can have the aspect ratio as a variable in your code and have the code to set the constraints in a method such as updateConstraints.

float aspectRatio; NSLayoutConstraint *aspectRatioConstraint=[NSLayoutConstraint constraintWithItem:entryView
                                                                   attribute:NSLayoutAttributeWidth
                                                                   relatedBy:NSLayoutRelationEqual
                                                                      toItem:entryView
                                                                   attribute:NSLayoutAttributeHeight
                                                                  multiplier:self.aspectRatio//aspect ratio same as formula view
                                                                    constant:0.0f];

Then when the button is pressed, in the action method you can modify the self.aspectRatio as fit and then call setNeedsUpdateConstraints and subsequently setNeedsLayout.

Sorry, but how could changing a primitive variable affect the 'aspectRatioConstraint' dynamically? That variable is simply passed by value. There also isn't a setter for 'multiplier'. — Nikhil Verma, Apr 27 '15 at 03:03
Yes, left to itself it will not change dynamically. Thats why you need to call setNeedsUpdateConstraints and subsequently setNeedsLayout. This will cause the constraints to be done again and the view laid out as well. http://stackoverflow.com/a/20927069/1135417 — OutOnAWeekend, Apr 27 '15 at 14:57

score 0 · Answer 2 · answered Apr 27 '15 at 04:19

0

I haven't understood exactly what the question is, but changing constraints in response to a button press so as to expand / collapse a superview is easy:

enter image description here

If that is the kind of thing you are after, you can find a downloadable example project here: https://github.com/mattneub/Programming-iOS-Book-Examples/tree/master/bk2ch04p183animationAndAutolayout4

answered Apr 27 '15 at 04:19

matt

515,959
87
875
1,141

The example suggests, changing the height constraint of the view which is not what I want. I want to change the aspect ratio such that the view becomes tall enough to encapsulate all the subviews within it (minding the width). – Nikhil Verma Apr 27 '15 at 05:14
In the example that is exactly what happens. The subviews dictate the height. – matt Apr 27 '15 at 05:16

How to change aspect ratio of a UIView

2 Answers2