UIScrollView + UILabel (Dynamic Height) in AutoLayout

Hello Everyone,

This is my first post in Software Development tips blog.

All of us know that Scrollview has a biggest problem while working it with AutoLayout.

ScrollView has ambiguous scrollable content height

Fix this issue through this fantastic answers


Okay, lets come to our actual solution. How to have a UILabel in Dynamic height inside a UIScrollView when AutoLayout mode. Solution is here. Just have a look at below image,

So, here is my demo application UI's stack of Views.

• UIView -> UIScrollView -> UIView (For contents) -> UITextFields, UILabels and UIButton

Here the instruction text may or may not have n number of sentences. So, in this case how to handle a Dynamic height of UILabel inside a UIScrollView. Follow the below steps,

• First set the constraints as per your needs to all of your Views.
• Then, take a referencing outlets for your UIScrollView, UILabel (Your dynamic text's label) and finally UIButton (You'll understand why you need a reference outlet for this later)

@property (nonatomic, weak) IBOutlet UIScrollView *registrationScrollView;
@property (nonatomic, weak) IBOutlet UILabel *instructionsLabel;
@property (nonatomic, weak) IBOutlet UIButton *submitButton;

Then, in your ViewController should be like below,

- (void)viewDidAppear:(BOOL)animated { [super viewDidAppear:animated];
    CGRect labelFrame = self.instructionsLabel.frame; // Keep the current frame value 😉
    self.instructionsLabel.text = self.dummyText;
    CGRect labelRect = [self.dummyText boundingRectWithSize:CGSizeMake(labelFrame.size.width, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin attributes:@{ NSFontAttributeName : [UIFont systemFontOfSize:17] } context:nil];
    self.instructionsLabel.frame = CGRectMake(labelFrame.origin.x, labelFrame.origin.y, labelFrame.size.width, labelRect.size.height);
}

/*
* Modify the scorllview.contentSize here
*/
- (void)viewDidLayoutSubviews {
    self.submitButton.frame = CGRectMake(self.submitButton.frame.origin.x, self.instructionsLabel.frame.origin.y + self.instructionsLabel.frame.size.height + 35.0, self.submitButton.frame.size.width, self.submitButton.frame.size.height); // Setting button frame here because label frame alignment finishes here 😜😜
    self.registrationScrollView.contentSize = CGSizeMake(self.registrationScrollView.frame.size.width, self.submitButton.frame.origin.y + self.submitButton.frame.size.height); // Finally set the content size here to finish the scrollView scrolling 😍
} 

We have to set the dynamic text in viewDidAppear and calculate the dynamic text height for modify the UILabel height. Then, in viewDidLayoutSubviews we have to modify the button frame also. Because, it has to be in instructionLabel bottom. Then, calculate the contentSize for UIScrollView in viewDidLayoutSubviews itself and set it there.

That's it. Compile your code and build it.

Check out my full demo Here

Cheers