CODEWITHSUNDEEP
iosobjective-cuilabelautolayout
Mexyn
Mexyn

Reputation: 375

AutoLayout and UILabel resize animation not working properly on device rotation

i have a strange problem on a very simple task.

I needs a very small setup to reproduce the problem:

|--------------------------------------|
|             Parent View              |
|                                      |
||------------------------------------||
||              UILabel               ||
||------------------------------------||
|                                      |
|                                      |
||------------------------------------||
||              UIView                ||
||------------------------------------||
|                                      |
|                                      |
|--------------------------------------|

In the example above we have a parent view with 2 subviews --> A UILabel and a simple UIView. Im using autolayout to apply the layout shown above:

Constraints for UILabel:
Leading Space to superview = 0
Trailing Space to superview = 0
Fixed Height constraint (e.g. 80pt)
Top Space constraint (e.g. 50pt)

The UIView subview has the same constraint types (the values for height and top space differs).

So what i expect with this setup, is that both subviews will adopt the full width of its parent as we defined that leading and trailing space should be zero. so if change the width of the parent view, the width of the subviews should change too, to stay aligned.

lets say the parent view has a dimension of 200x400 pt. when i build and run my example in portrait everything looks ok. when i rotate to landscape, everything still looks fine. the parent views width and even the subviews width got larger. but now when i rotate back to portrait the uilabels width immediately gets its target width without any animation:

|--------------------------------------|
|             Parent View              |
|                                      |
|    (immediately has target size)     |
|          |--------------|            |
|          |    UILabel   |            |
|          |--------------|            |
|                                      |
|   (this subview is still             |
|             animating its width)     |
|   |------------------------------|   |
|-->|           UIView             |<--|
|   |------------------------------|   |
|                                      |
|                                      |
|--------------------------------------|

the parent views width and the uiview subviews width are animated properly. its only the uilabel that has a strange behavior here and i cant find out what causes that issue.

Upvotes: 10

Views: 2069

Answers (4)

Цветелин Владимиров
Цветелин Владимиров

Reputation: 21

My suggestions are:

If you've subclassed the parent view use the - (void)layoutSubviews:

- (void)layoutSubviews {
    label.frame = CGRectMake(leftInset, labelY, parentView.frame.size.width - leftInset*2, labelHeight);
    childView.frame = CGRectMake(leftInset, childViewY, parentView.frame.size.width - leftInset*2, childHeight);
}

if you didn't subclassed the parent view you can use autoresizingMask:

label.autoresizingMask = UIViewAutoresizingFlexibleWidth;
childView.autoresizingMask = UIViewAutoresizingFlexibleWidth;

Upvotes: 1

Gowry
Gowry

Reputation: 11

Its better to set autolayout in story board. Please ensure that you are all the sub views is selected in your view controller when you are setting constraints. For that you should do the following:

  1. Click on the view of your main view controller
  2. Press Ctrl+A
  3. Click Resolve Auto-layout Issues
  4. Select Add missing constraints in Your View Controller

Then constraint will be set to all the subviews and will work perfectly during rotations.

Upvotes: 0

ashvardanian
ashvardanian

Reputation: 494

As I remember, for constraints you should provide some more specs, but for such easy UI elements I would suggest using UIViewAutoresizing masks. They are much simpler and have shorter definitions. In your case just use UIViewAutoresizingFlexibleWidth.

Upvotes: 0

Jsdodgers
Jsdodgers

Reputation: 5312

The problem is not that the UILabel is not animating its resize but that the text does not animate. If you were to give the label a different background color, you would find that it does indeed animate, and it is just the text which jumps to position.

One way to fix this would be to change the width of the label with no animation and move it ober by X points, where X is half of the difference between the starting and ending width, and then just animate its position.

The only problem with this method for your code is that I do not believe you will be able to do it with auto layout.

Upvotes: 0

Related Questions