How to change uiview's height using auto layout?

Question

So I created this scenario in order to understand how views increase in height according to their content. However am still not able to make it happen.

This is what I have now:

the textview is growing according to content. however the uiview containing it is disappearing. what constraints should I use so that when the uitextview becomes bigger, its parent view also increase in height?

Answer 1

Start by clearing all your constraints from everything so we have a fresh slate.

Step 1: Build your view hierarchy. In this example, we want something like this:

The view controller's view, which we'll call parentView has a subview, which we'll call redView. That redView has a child, a Text Field, which we'll call textField.

The hierarchy looks like this:

Step 2: Set any constraints that are specific to any individual view. In this case, we probably only want to set a width constraint on our text view. For now, I'll just set a width of 200pts.

Step 3: Set the constraints between textView and its parent, redView. Let's say we want a 10pt border all the way around. Let's add these constraints:

Once we've added these constraints we'll gets some auto layout warnings and errors. For starters, because the constraints I added for with and space to superview don't match the actual sizes, I'll get some warnings like this:

There will also be some errors describing missing X and Y positions for redView and for textView. There are really twice as many errors here as necessary. textView knows where to position itself relative to redView. We don't need more constraints to sort out textView's position. However, redView doesn't know where to position itself yet... and so ultimately, textView also sort of doesn't exactly know.

We can update the textView's frame to get rid of the warnings, but let's go ahead and fix the actual errors.

Step 5: Set up redView's constraints relative to the superView. redView already know what size to be. Notice we had no errors for redView's width. It just doesn't know where to be. In this case, I'll go simple and say we want redView to be centered. So we'll want to add these constraints:

Now we've fixed some of the problems. The only problem that remains is the height for everything.

To fix this, we must set the content sizing priorities of textView. Set these all to 1000 and change the "Intrinsic Size" property to "Placeholder".

By now, all of the auto layout errors should be gone and we should only be left with warnings because our storyboard frames don't match what our constraints say they should.

We can fix that by selecting parentView and updating all the frames:

There's one final caveat to this auto layout puzzle when it comes to autosizing based on content size: what happens if our text view has no content?

If our textview has no content, auto layout will choose a height of 0, and our users won't even be able to see that there's a text view there, much less tap in it to add content (and make it expand). When using auto layout and content-based sizing, we should almost always be sure that we've set either an explicit or minimum size for the content view.

We don't have to worry about our textView's width, as we set this explicitly to 200. So let's add a minimum height constraint. Start by adding any height constraint:

Now go to the size inspector for the textView, find this height constraint we added, and edit it into a greater than or equal to constraint:

Storyboard won't reflect the change in content in our textView and resize it appropriately, but your constraints are now set up correctly and this will behave appropriately on your device or in the simulator.

Answer 2

ON UITextView make your you unselected These

• Scrolling Enabled
• Bounces
• Bounce Horizontally
• Bounce Vertically
• Shows Horizontal Indicator
• Shows vertical indicator

Now Change your auto layout constraints like this.