In iOS development, AutoLayout is a very powerful thing, with a good, you can get twice the result with half the effort. But the AutoLayout is very easy to learn, I was just looking for more than an hour data are easy to use, powerful than the There are plenty of people who believe. But no matter how simple things, it is not always the right place, I was in the UIScrollView constraint on the toss for a long time, all kinds of error, all kinds of information search, finally in the author try to find a solution. I believe there must be a lot of work in the same as me, it is frustrating to toss the colleagues, here, I will share their understanding to everyone.
We first divide the constraints into the following categories (referring only to the constraints between child controls and UIScrollview)
1 pitch class: the child control to the parent control of the upper and lower left and right spacing of the 2 broad categories: both the child control and the parent control of the high aspect ratio of the central class: the child control in the parent control in the horizontal or vertical center
First, let’s look at an example of adding a constraint to a child control on an ordinary View
wood is wrong, very easy thing
Then look at the UIScrollView to add constraints to the child control example
Nani? The same constraints, even the wrong, to the original understanding of the author, obviously told it to the upper and lower left and right spacing, and why would it be wrong, is Xcode bug?
In AutoLayout, all kinds of constraints are not distance, relative to the parent control itself, but relative to the parent control content view (such as UIScrollview contentSize), due to the content of ordinary view itself and view the same size, so it can be regarded as relative to the self scrollView at load time, automatically according to the internal control to calculate contentSize the value of.
After reading the above sentence, I believe that everyone should know why is wrong, the child control frame relies on Scrollview contentSize, and the value of contentSize and calculated according to sub control frame, that in the end what? So Xcode meng……
In the development, we may encounter such a situation, the Scrollview contentSize set in viewDidLoad, but when the program runs, and not their desired effect, because the Scrollview is based on the internal controls to calculate the value of contentSize, so we can viewDidAppear to set it up
Having said so much, how can we solve this problem? Nonsense not say, directly into
UIScrollview the correct way to add constraints
Suppose we want to achieve the following effects
first add UIScrollview to the controller view, adding constraints (this I do not teach it, the author here is down about the distance is 0, so the size and the size of the UIScrollview screen after operation.)
Here only vertical rolling, the level of the situation is not rolling, the other is similar, I believe that your IQ
Add a UIView UIScrollView to the only child controls (constraints as shown below), put the view as a content view Scrollview (call it “view only”), after all the child controls are added to the view
to the parent control on the left and right spacing fixed (0 is written, according to the needs of their own decisions), fixed the height of the view (written in 800), after the completion of the constraints
error, normal, reported because the horizontal direction is not determined, the vertical direction is no problem. The author of the first to explain the meaning of the above constraints, only view to Scrollview content view below the spacing is 0, and the fixed height is 800, then Scrollview will automatically calculate the contentSize.height = 0 (on the pitch) +800 + 0 (under spacing) = 800, so the horizontal direction? ContentSize.width = 0 (left pitch) + width + + (right spacing) = 0, under condition, cannot be calculated
The online data shows that the distance constraint is in fact within the margin setting of scrollView, after the author personally verified, this argument is wrong, the distance is set to 10, and then run the program to print the scrollView.contentInset, the results showed that are 0, 20 and contentSize wide Gaodouduo, so is in the contentSize space the contentInset is not.
Next we add a constraint
and Scrollview only view width, and look at the results of
did not report the wrong, oh yeah, after you want to add any control to the only view to add it, with respect to the only view to add constraints on the so easy.
Maybe we will have a question, only view and Scrollview width, and that in the end is not wide, or rely on the contentSize?
The width and height constraint is relative to the Scrollview itself, not relative to its content view, so how wide is the Scrollview, the only view is wide, and has nothing to do with contentSize
So far, Scrollview contentSize can determine the size of the
contentSize.height = 0 (on the pitch) +800 + 0 (under spacing) = 800
contentSize.width = 0 (left + only view wide spacing) + 0 (right spacing) = only view wide (scrollview/ controller view/ screen width)
Remember to change the 800, the last button to change the maximum Y (Y + height) + the following spacing, as shown in figure
If you can determine the maximum Y value of the last button at run time, you can modify the height constraint of the unique view by code
Like a fool, just the only view of the Scrollview is no longer fixed height, but it is automatically adjusted according to the constraints of the child controls within it, as shown in figure
we look at the constraints of the last button on the left and right spacing + fixed height has been able to determine its location and size, and why add a lower pitch? In order to determine the height of the unique view of the parent control, the height of the only view = the maximum Y value of the button + the lower spacing
Do not call the only view, directly in the Scrollview to add a child control
to add the first child control (called it “sub 1”) and constraint
sub 1 Scrollview distance from the content view, the upper spacing of 10, the left and right spacing of 0
1 and Scrollview width, and the height is determined according to its internal control sub constraints, there is no map, AutoLayout should not understand, as is the fixed height, as its position and size have been identified, and scrollview.contentSize.width = 0 (left + width + 1 spacing) 0 (right = 1 (spacing) width is scrollview/ controller view/ screen width).
The error is set to 1 because there is no sub spacing Scrollview content view, whether it is temporarily (if you look unhappy, can add a constraint, remember to delete), to add the following to the Scrollview view in figure
, add after effect
controls the following constraints are the same (not map)
- The vertical distance to the above view is 10
- Scrollview to the content of the left and right margins of 0
- Fixed height
constraint or error, the reason for the error and add 1
Next add the last control
get, wood has a mistake, we look at the constraints
- 1 on the pitch is 10, the position and size of the previous control has been determined Y = Y button on the maximum value of a control + + 10
- 2 around the pitch is, the width of the Scrollview button has been determined by the width of the width of the content view of the contents of the = the width of the content view – * * * 10 button = X
- 3 fixed height 40 button height = 40 above constraints have been identified in frame buttons, then the last distance is in order to determine the Y value of scrollview.contentSize.heightscrollview.contentSize.height = button height + + button distance
So far, the location of all sub control to determine the size of the Scrollview contentSize OK, finally to see the operating results.