1.概述:随着iOS设备的更新迭代,屏幕适配问题也变得愈发重要,应运而生了Autolayout。在Xcode4.1和OS X10.7之后才起效。
2.简介:Apple提供了2种方式布局Autolayout,用xib来布局;另一种利用代码进行布局,在Apple的sdk中提供了2个类库:NSLayoutManager和NSLayoutConstraint。NSLayoutManager类主要是配合NSTextStorage,NSTextContainer实现NSCoding协议用来布局text视图,而NSLayoutConstraint类则是布局整个视图结构(着重介绍)。
3.原理:Autolayout的主要思想就是约束。在NSLayoutConstraint类中,有一个最重要的类方法
+(instancetype)constraintWithItem:(id)view1 attribute:(NSLayoutAttribute)attr1 relatedBy:(NSLayoutRelation)relation toItem:(id)view2 attribute:(NSLayoutAttribute)attr2 multiplier:(CGFloat)multiplier constant:(CGFloat)c;
实现的公式是"view1.attr1 = view2.attr2 * multiplier + constant".建立2个视图之间的约束联系(第二视图可以为nil)。但是用这个方法的简单明了,缺点就是太过繁琐复杂.但是我们推荐使用VFL进行布局。
4.1内容:
1).当我们使用Autolayout时,我们要摒弃Xcode自动适应设置,将translatesAutoresizingMaskIntoConstraints＝NO;不然会造成视图混乱。
2).遵从“高内聚”的原则,在UIView.h类中系统定义了- (void)updateConstraints;在UIViewController.h类中系统定义了- (void)updateViewConstraints;Overrides must callsuperor send -updateConstraints to the view=>即[superupdateViewConstraints];
3).最基本的添加约束的方法:创建一个view对象,创建一个NSLayoutConstraint约束对象,constraintWithItem进行约束设置,view对象中添加约束。
4.2内容:
1).Autolayout还提供了VFL(Visual Format Language)来约束,+ (NSArray *)constraintsWithVisualFormat:(NSString *)format options:(NSLayoutFormatOptions)opts metrics:(NSDictionary *)metrics views:(NSDictionary *)views;
//format:传入单独每个view的约束语句;查询xcode的api的Visual Format Syntax。
2).Autolayout步骤:创建一个view,并且添加到父视图中去显示－>［父视图addConstraints:(约束数组)］－>传入参数，format具体约束语句,opts可置为nil,metrics传入距离参数(用参数代替魔数),views传入相应的视图控件,metrics和views是为format服务的。
3).例1:
- (void)updateViewConstraints{
[super updateViewConstraints];//override初始化UIView*view1 =[[UIView alloc] init];
view1.translatesAutoresizingMaskIntoConstraints= NO;//取消自动布局view1.backgroundColor =[UIColor blueColor];
[self.view addSubview:view1];
NSDictionary*views_Dic = @{@"view1":view1};//约束的控件NSString*hLayoutStr =@"H:|-(==100)-[view1(==100)]";//H:代表横向,｜代表相对于父视图,－代表约束距离,()里面的所有表示约束距离,[]里面表示约束的视图对象,这句话表示:横向从左到右,相对于父视图距离100像素,view1的宽为100NSString *vLayoutStr =@"V:|-(==100)-[view1(==50)]";//V:代表纵向,｜代表相对于父视图,－代表约束距离,()里面的所有表示约束距离,[]里面表示约束的视图对象,这句话表示:纵向从上到下,相对于父视图距离100像素,view1的高为50NSArray*hLayoutArr = [NSLayoutConstraint constraintsWithVisualFormat:hLayoutStr options:0metrics:nil views:views_Dic];
NSArray*vLayoutArr = [NSLayoutConstraint constraintsWithVisualFormat:vLayoutStr options:0metrics:nil views:views_Dic];
[self.view addConstraints:hLayoutArr];
[self.view addConstraints:vLayoutArr];
}
例2:
- (void)updateViewConstraints{
[super updateViewConstraints];//override初始化UIView*view1 =[[UIView alloc] init];
view1.translatesAutoresizingMaskIntoConstraints=NO;
view1.backgroundColor=[UIColor blueColor];
[self.view addSubview:view1];
UIView*view2 =[[UIView alloc] init];
view2.translatesAutoresizingMaskIntoConstraints=NO;
view2.backgroundColor=[UIColor greenColor];
[self.view addSubview:view2];
NSDictionary*views_Dic = @{@"view1":view1,@"view2":view2};
NSDictionary*views_metrics = @{@"Top":@50,@"Right":@20};
NSString*hLayoutStr =@"H:|-(==100)-[view1(==100)]-[view2(view1)]-Right-|";//表示:从父视图的左边开始,约束100像素,约束view1的宽为100像素,约束view2的宽与view1等宽,约束距离父视图右边的距离为20像素。NSString *vLayoutStr =@"V:|-(100)-[view1(==100)]-[view2(==100)]";
NSArray*hLayoutArr = [NSLayoutConstraint constraintsWithVisualFormat:hLayoutStr options:0metrics:views_metrics views:views_Dic];
NSArray*vLayoutArr = [NSLayoutConstraint constraintsWithVisualFormat:vLayoutStr options:0metrics:views_metrics views:views_Dic];
[self.view addConstraints:hLayoutArr];//横向约束[self.view addConstraints:vLayoutArr];//纵向约束}
例3:
- (void)viewDidLoad {
UIView*view_nav =[[UIView alloc] init];
view_nav.translatesAutoresizingMaskIntoConstraints=NO;
view_nav.backgroundColor=[UIColorFactory colorNav];
[self.view addSubview:view_nav];
self.mUAccounts_table=[[UITableView alloc] init];
self.mUAccounts_table.delegate=self;
self.mUAccounts_table.dataSource=self;
self.mUAccounts_table.translatesAutoresizingMaskIntoConstraints=NO;
[self.view addSubview:self.mUAccounts_table];//AutoLayout进行约束NSDictionary *views_dic = @{@"view_nav":view_nav,@"mUAccounts_table":self.mUAccounts_table};
NSDictionary*metrics_dic = @{@"Top":@0,@"Bottom":@0,@"Left":@0,@"Right":@0,@"ScreenWidth":@((float)ScreenWidth),@"tabBar_height":@(self.tabBarController.tabBar.frame.size.height),@"Table_height":@((float)ScreenHeight-64-49)};//当等宽或者等高时,将相同方向的两个视图拆分成同个方向的2个约束[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-Left-[view_nav(ScreenWidth)]"options:NSLayoutFormatAlignAllLeft metrics:metrics_dic views:views_dic]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-Top-[view_nav(64)]-[mUAccounts_table(Table_height)]"options:0metrics:metrics_dic views:views_dic]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[mUAccounts_table(ScreenWidth)]"options:0metrics:metrics_dic views:views_dic]];
}
5.1注意:
1).有可能出现-(void)updateViewConstraints;不自动调用的情况,可以直接在viewDidLoad中添加[selfupdateViewConstraints];进行调用。
2).VFL的结构1:－距离－对象(尺寸)－距离,不能出现-距离-距离的情况。
3).当出现Unable to simultaneously satisfy constraints时意味着约束之间有冲突,不能满足所有约束。
4).限定一个视图的约束一般通过与其他视图的位置和自身宽高总共4个约束,或者全部与其他视图约束,自身不做宽高约束。(4个约束灵活形成一个适配的视图)
5).约束对象注意,父视图添加约束,自身宽高约束则是自身当做父视图来约束。
6).当出现等宽和等高的情况时,可将同一个方向的两个视图约束拆分成同个方向的2个约束。