Automatic layout AutoLayout Resolving different screens

This is not a AutoLayout tutorial, just AutoLayout mobilization articles and experience, in the fifth section of this article links and recommendations, I will be attached enough to use the AutoLayout of the tutorial. This article wanted to write two months ago, but because it has been working more, there is no time to finish it. Today finally ruthless heart, leave the code do not write, to finish him!

One, do not and I mention AutoLayout, I want to die!!

Starting with IOS6/XCODE4, Apple has offered autolayout--an automatic layout mechanism that has a better compatibility with different screen sizes, but I believe most people, like me, will almost be tortured to death when they first touch AutoLayout!

AutoLayout because layout thinking and traditional frame different, domestic about AutoLayout tutorial has too little, and AutoLayout in just when the flexibility is not easy to control, resulting in more choices to give up.

Second, why should I use AutoLayout?

With the 3.5-inch/4-inch iphone in the market using more and more, as well as the upcoming iPhone6, iphone6l, different sizes, different resolutions of the iOS devices will be more and more, the use of traditional frame layout will be more and more, with the signal from Apple, It is imperative to use AutoLayout.

Well, I should come to praise AutoLayout, it can solve what problem, what benefits to us?
1) You can basically not consider the 3.5-inch and 4-inch and the upcoming x.x-inch screen different resolution of the problem, you can finally not be in the Viewdidload method to determine the different resolutions, different controls should be placed in the different resolutions, or to write different storyboard and xib;
2) You can discard the code that calculates Tableviewcell, Uilabel height according to different words, because AutoLayout will help you calculate automatically;
3) If your layout in the horizontal screen vertical screen changes are not particularly large, you do not have to write for the vertical two sets of code or write two storyboard/xib;
4) for the upcoming 4.7-inch and 5.5-inch iphone, you can almost not even move a line of code to complete their adaptive screen layout, without each new resolution, you can only say f*ck, and then change two overnight.
Look at Apple's attitude, the default is to choose the use of AutoLayout. Although I still sometimes scold AutoLayout, but I will still resolutely choose to embark on this path.

Three, the AutoLayout two or three things

Just praise finish AutoLayout, then I have to and I like, willing to choose to walk this way comrades to mention some wake up, you really want to do what kind of toss preparation.

3.1. Transformation of layout thinking

Traditional layout ideas, a view where there is how big, it is clear that its coordinate position and width of the fixed, usually with CGRect and cgpoint these two models is enough, and it must be very listening to your words, write how much, it is absolutely how much But AutoLayout's ideas have changed, or improved, to encompass the traditional frame layout, which, in addition to telling the view's coordinates and width, provides a relative concept, such as:
1) View relative to the left side of the screen view 5 points, 10 points on the right, 15 points above, 20 points below, if the screen's length and width ratio has changed (for example, from 3.5 inch 320:480 to 4-inch 320:568, or from the horizontal screen to the vertical screen), The view will still stretch with the scale of the screen, still remain away from the screen view 5 points to the left, 10 points on the right, 15 points above, 20 points below;
2) between View1 and View2 10 points apart, when the screen size changes or rotation, they can still change their size or position changes to ensure that they are 10 points apart;
3) ...
So, the first step in using AutoLayout is that you need to think about the way it's going up and down relative to Superview or brotherview, changing the way you think about your layout.

3.2. Using AutoLayout may often get the look you don't want to see, and you won't be able to change frame.

The frame age is how many locations you write, where the view is not automatically stretched or changed, but the view in AutoLayout will change depending on the screen aspect ratio or other view changes, and you will often see that the layout is not the way you want it to be. This is why too many people have been tortured. As long as you consider the relative position is not correct, it can really be confused.

3.3.autolayout of the VFL (Visual Format Language) syntax at first, it looks like the egg hurts.

Well, since the use of AutoLayout, using frame to change the position does not work, I also use the code to complete the AutoLayout head row. However, let me choose one of the most common VFL code to show you:

NSString *vfl = @"V:|-5-[_view]-10-[_imageView(20)]-10-[_backBtn]-5-|";

Nani?! What kind of work is this?! I have to pay the cost of learning AH!!! In fact, this passage means, in the vertical direction from top to bottom, view from the parent view 5 points, ImageView distance view 10 points, while ImageView is 20 points high, backbtn ImageView bottom 10 points, distance from the bottom of the parent view 5 points.

3.4. Manual constraint writing, that long long AH ~ ~

Of course, you can also write a layout constraint constraint, which is similar to frame specifying origin and size, but like this:

[self.view addConstraint: [NSLayoutConstraint constraintWithItem:blueViewattribute:NSLayoutAttributeLeftrelatedBy:NSLayoutRelationEqualtoItem:redViewattribute:NSLayoutAttributeLeftmultiplier:1constant:0]];

In the above, "view is 5 points from the parent view, ImageView is 10 points from view, while ImageView is 20 points high, BACKBTN is 10 points from ImageView bottom, 5 points from the bottom of the parent view" Every comma is a constraint like this one.

Four, are you ready to give up? No! agreed to love AutoLayout it!

Writing here, I suddenly feel that I was in the Black AutoLayout, no, look at my topic, I really have fallen in love with the use of AutoLayout. Let me say how to use AutoLayout.

4.1.autolayout general application steps and the most suitable scenario

When your page does not change the overall layout and design, only in the different screen size, different text and content under the adaptation of the change, then the use of AutoLayout is more appropriate. Not in a frame-like era, hard-pressed to calculate the respective location point coordinates and size for different screen sizes. You typically use the Xcode->editor->pin/align menu to add constraints to a view. The control position is generally determined by interfacebuilder, and when there are controls that need to be stretched, adapted, or shifted automatically, add constraint; Use the tutorial to get started with auto-layout tutorial 1 in iOS 7

4.2. Your view has a relatively simple layout change

When it comes to animating or dynamically adding views, AutoLayout exposes the culprit I think is crazy-priority and layout conflicts. AutoLayout constraints on the same orientation, such as those that describe the distance from the top edge of the Superview, if the values of the two constraints are different, but the precedence is the same, the AutoLayout will report the layout conflict. A constraint will be discarded based on its calculations (you might discard the constraints you want, but you keep the layout you don't want to see). So, when we have a layout change, we can't just change it like the absolute position of the frame, and only the location information. So, what do we do with this layout conflict? That is, the two constraints with the same description but different values have different precedence. AutoLayout default will use a higher precedence constraint.
But when we add a higher-priority constraint that changes the layout of the view, what do you do when you're done and want to change back? At this point, you must remove the higher-priority constraint.
So, when it comes to dynamic changes to a view, my usual practice is to add a default constraint to the control that needs to be changed, but to lower the priority for this default constraint and add a higher-priority constraint2 when the change occurs. And the code with a dictionary cache the Constraint2 object, so that I can delete or re-add at any time, so that the view changes back and forth.

4.3. Your view has a more complex animation effect or a large layout change

Although AutoLayout can complete all the layout problems, it is still inconvenient in some cases, As described in section 4.2, each change you have to add or delete a different priority constraint, just to construct the constraint object is a pretty tough job, and you might have to cache the object for later cleanup. So, when you need to change the layout of the control very often, and the position of the change is indeterminate (for example, by dragging a view to any position on the screen by gesture), I recommend that the view do not use AutoLayout, and that the absolute positioning method that is obtained by using frame is better, You only need to fully consider the various screen adaptations and calculate the appropriate coordinate points for them. At the same time, I also suggest that this frequently changing view is not even interfacebuilder to draw, it is best to write directly, because once you tick AutoLayout, all views in storyboard will be AutoLayout. And when you need to change the layout of the view, you must use the
view.translatesAutoresizingMaskIntoConstraints = NO;
superview.translatesAutoresizingMaskIntoConstraints = NO;
To avoid adding a default AutoLayout constraint to your view.

Scale by relative distance

V. Links and RECOMMENDATIONS

1. "Start automatic Layout in iOS 7 Tutorial 1"
This tutorial read basically can be more familiar with the use of AutoLayout, and then combined with some of the experience of this article, should be able to solve most of the problems. In this article, tutorial 2 does not have Chinese translation, only English original: "Beginning Auto Layout Tutorial in IOS 7:part 2"
2. "AutoLayout and the VFL experience sharing"
This article contains a simpler description of the use of the VFL and common AutoLayout techniques. Enough for everyone to use.
3. Introduction to AutoLayout (Automatic layout)
This article contains a streamlined approach to AutoLayout code operations.

If you have read through this article and the above links can not be flexible use of autolayout, welcome to leave me a message, we discuss together! Also welcome to follow my blog http://www.ilikewhite.com and Weibo http://weibo.com/ilikewhite

Automatic layout AutoLayout Resolving different screens