Ios6+autolayout Using Tutorials

in order to fit IPhone6 Plus, must learn to AutoLayout, study for two days, remember the experience 650) this.width=650; "Src=" http://img.baidu.com/hi/jx2/j_0005. GIF "alt=" J_0005.gif "/>.

AutoLayout is similar to the layout of Android, or HTML CSS similar to web development, simply to replace the absolute bureau with a relative layout (which is my understanding).

There are two ways to use AutoLayout, 1. Configure with Xib, 2. Write in code.

Whether using Xib or code, one of the principles to follow is that a view you must contain the following two limitations: 1.position, set x, y coordinates, upper and lower left and right clearance, center, etc. these conditions can be determined position, but these are conflicting, only one; 2.size, must be set to size, You can set the width of a fixed value, or it can be scaled by setting a width-to-height ratio.

1. Configure with Xib

This way is more intuitive, open xib configuration can be, specific ways to use the network there are many introductions, here is not elaborate

2. Write in code

With Xib configuration should be able to do most of the need, but still have to write in code, here is an example I wrote, including the use of option, metric.

The effect of this example is that the xib placed two horizontally centered butt1,butt3, and then created the BUTT2,BUTT2 with the BUTT3 horizontally aligned with the code, and finally created the view1,view1 to be laid out only with the root view, and not affected by other views

//butt2

{

UIButton *butt = [UIButton buttonwithtype:uibuttontypecustom];

Butt. BackgroundColor = [uicolor redcolor];

[Butt settitle:@ "2" forstate:uicontrolstatenormal];

Butt. Translatesautoresizingmaskintoconstraints = NO;

Butt.    frame = cgrectmake(0, 0, .) ; // this Frame actually, it's not necessary.

[Self. View addsubview: butt];

butt2 = butt;

// width : High = 1:1

[butt2 addconstraint: [nslayoutconstraint constraintwithitem: '/ c5>butt2 attribute:nslayoutattributewidth relatedby: Nslayoutrelationequal toitem:butt2 attribute: Nslayoutattributeheight multiplier:1 constant:0 ]];

//butt2 and butt3 horizontal alignment, Vertical gap of 50, width is set

nsdictionary *viewsdict = nsdictionaryofvariablebindings(butt3, butt2);

[self. View addconstraints: [nslayoutconstraint constraintswithvisualformat:@ "V: [Butt3]-20-[butt2 (==50)] " options:nslayoutformatalignallcenterx metrics: Nil views: Viewsdict]];

}

//a New View, relative to the root view layout

{

UIView *view1 = [[UIView alloc] initwithframe:cgrectmake( 0 , 0 , 0 , 0 )];

View1. Translatesautoresizingmaskintoconstraints = NO;

View1. BackgroundColor = [uicolor bluecolor];

[Self. View addsubview: View1];

//1. Width-to- height ratio 1:1.5

[self. View addconstraint: [nslayoutconstraint constraintwithitem: view1 attribute :nslayoutattributeheight relatedby:nslayoutrelationequal toitem: View1 attribute:nslayoutattributewidth multiplier:1.5f Constant:0];

//2. Fixed height 150

[self. View addconstraint: [nslayoutconstraint constraintwithitem: view1 attribute :nslayoutattributeheight relatedby:nslayoutrelationequal toitem: Nil attribute:nslayoutattributewidth multiplier:0.f constant:150.f];

//3. Center horizontally (3 and 4 only, because the two constraints are conflicting )

//[Self.view addconstraint:[nslayoutconstraint constraintwithitem:view1 attribute:nslayoutattributece Nterx relatedby:nslayoutrelationequal toItem:self.view Attribute:nslayoutattributecenterx multiplier:1 constant:0]] ;

//4. Align Right , leave the gap

[self. View addconstraint: [nslayoutconstraint constraintwithitem: view1 attribute :nslayoutattributetrailing relatedby:nslayoutrelationequal toitem: Self . View attribute:nslayoutattributetrailing multiplier:1 constant:-ten]];

//5. The upper and lower intervals, the effect here is to keep the top gap of 6 , so the bottom of the gap if the variable >=100, try to compare the effect of the lower of the following.

cgfloat hmargin = 100.f;

[self. View addconstraints: [nslayoutconstraint constraintswithvisualformat:@ "V : |-hmar-[view1]-(>=hmar)-| " options:0 metrics:@{@ "Hmar": @ (hmargin)} views: Nsdictionaryofvariablebindings(view1)];

//6. Upper and lower intervals , variable top clearance

//[self.view addconstraints:[nslayoutconstraint constraintswithvisualformat:@ "V:|-(>=100)-[view1]-(= =100)-| "options:0 metrics:nil views:nsdictionaryofvariablebindings (view1)]";

}

for the VFL, please refer to Apple's official documentation: Visual Format Language

This article is from the "idanal" blog, make sure to keep this source http://danal.blog.51cto.com/3353275/1617595

Ios6+autolayout Using Tutorials