1.屏幕适配---主要是一个屏幕横竖屏。
Snip20160429_2.png
1.1 3gs与4主要用frame。bounds。center进行布局。【frame，bound 都是固定的】
-
1.2 ipad出现，iphone横屏
- 出现Autoresizing技术
- 让子控件可以跟随父控件的行为自动发生相应的变化。
- 关闭Autoloyout功能
- 出现Autoresizing技术
-
只设置宽和高的时候，需要用到水平居中（水平方向上中间），与竖直居中。
Snip20160429_4.png-
下面通过面板设置。
Snip20160429_3.png - 如果用代码添加控件用代码来实现autoresing如下
-
UIView *blueView = [[UIView alloc] init];
blueView .backgroudColor = [UIColor blueColor];
CGFoat wh = 100;
CGFoat x = self.view.frame,size.width -wh;
CGFoat y = self.view.frame.size.heigh - wh;
blueView.frame = CGRectMake(x,y,100,100);
//左边伸缩
blueView.outoresizingMask = UIViewAutoresizingFlexbleLeftMargin |UIViewAutoresizingFlexibleTopMargin |.............
//顶部伸缩
[self.view addSubviews:blueView]
- 只能解决父子关系，不能解决兄弟关系。子控件可以在父控件里拉伸，或者挨着父控件。
2.在Autoresizing之后出现了Autolayout(功能强大)---参照与约束
- 先打开use Auto Layout如下图，Alignment对齐的意思，Constraints约束的 意思
Snip20160429_6.png
- 下图就是要设置的约束（只能添约束不能改约束）
- 其中选择等宽等高要按着cmd键，选择两个控件。然后下图Equal.......
Snip20160429_9.png
-
主要的警报
Snip20160429_7.png - 一般添加约束的思路是在脑海中勾画控件与主控件的关系，然后就是控件的宽度与高度.
- 有一个比较控件比较特殊，就是UILable,约束的时候只需要约束top,left,以及weight。其中宽度可以小于某一个值，这样就会text,很少也能被包裹。
- 两个控件的在父控件中，他们两个之间的约束在父控件中。
-约束的修改需要拿到控件然后用，
self.spacingContraint.constant = 50;
self.withContraint.constant = 100;
- 如果做动画需要加上控件名字 layoutIFNeed。（在动画函数的参数的block中）。换句话就是说控件调用 layoutIFNeed。
[UIView animateWithDuration:1 animations:^{
[self layoutIfNeeded];
} completion:^(BOOL finished) {
//repeat!
[self animateWithInvertedInsets:!invertedInsets];
}];
2.代码实现autolayout。
- 2.1 每个线代表一个约束对象。
- 2.2 新建约束对象用到的方法是
Snip20160504_1.png
- 例如
UIView *redView = [[UIView alloc] init];
redView.backgroundColor = [UIColor redColor];
// 不要将AutoresizingMask转为Autolayout的约束
redView.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:redView];// 添加宽度约束:100
/************************** 蓝色 **************************/
// 添加高度约束:40
NSLayoutConstraint *heightConstraint = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:0.0 constant:40];
[blueView addConstraint:heightConstraint];
// 添加左边约束：blueView的左边距离父控件左边有20的间距
NSLayoutConstraint *leftConstraint = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeft multiplier:1.0 constant:20];
[self.view addConstraint:leftConstraint];
// 添加右边约束：blueView的右边距离父控件右边有20的间距
NSLayoutConstraint *rightConstraint = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeRight multiplier:1.0 constant:-20];
[self.view addConstraint:rightConstraint];
// 添加顶部约束：blueView的顶部距离父控件顶部有20的间距
NSLayoutConstraint *topConstraint = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTop multiplier:1.0 constant:20];
[self.view addConstraint:topConstraint];
/************************** 红色 **************************/
// 添加高度约束:蓝色等高
NSLayoutConstraint *heightConstraint2 = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeHeight multiplier:1.0 constant:0];
[self.view addConstraint:heightConstraint2];
// 添加左边约束：redView的左边 == 父控件的中心x
NSLayoutConstraint *leftConstraint2 = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1.0 constant:0];
[self.view addConstraint:leftConstraint2];
// 添加顶部约束：redView的顶部距离blueView的底部有20的间距
NSLayoutConstraint *topConstraint2 = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeBottom multiplier:1.0 constant:20];
[self.view addConstraint:topConstraint2];
// 添加右边约束：redView的右边 == blueView的右边
NSLayoutConstraint *rightConstraint2 = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeRight multiplier:1.0 constant:0];
[self.view addConstraint:rightConstraint2];
}
-
核心计算公式
Paste_Image.png - 苹果的vfl（旧的项目）
NSNumber *margin = @20;
// 添加水平方向的约束
NSString *vfl = @"H:|-margin-[blueView]-margin-|";
NSDictionary *views = NSDictionaryOfVariableBindings(blueView);//传进去一个对象生成一个字典。
NSDictionary *mertrics = NSDictionaryOfVariableBindings(margin);
NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:vfl options:kNilOptions metrics:mertrics views:views];
[self.view addConstraints:constraints];
// 添加竖直方向的间距
NSNumber *height = @40;
NSString *vfl2 = @"V:|-margin-[blueView(height)]";
NSDictionary *mertrics2 = NSDictionaryOfVariableBindings(margin, height);
NSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:vfl2 options:kNilOptions metrics:mertrics2 views:views];
[self.view addConstraints:constraints2];
- 两个控件(两种方法结合---VFL与outolayout结合)
NSNumber *margin = @20;
// 添加水平方向的约束
NSString *vfl = @"H:|-margin-[blueView]-margin-[redView(==blueView)]-margin-|";
NSDictionary *views = NSDictionaryOfVariableBindings(blueView, redView);
NSDictionary *mertrics = NSDictionaryOfVariableBindings(margin);
NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:vfl options:NSLayoutFormatAlignAllTop | NSLayoutFormatAlignAllBottom metrics:mertrics views:views];
[self.view addConstraints:constraints];
// 添加竖直方向的间距
NSNumber *height = @40;
NSString *vfl2 = @"V:[blueView(height)]-margin-|";
NSDictionary *mertrics2 = NSDictionaryOfVariableBindings(margin, height);
NSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:vfl2 options:kNilOptions metrics:mertrics2 views:views];
[self.view addConstraints:constraints2];
//添加红色剩余的约束
NSLayoutConstraint *redContraint1 = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeTop multiplier:1.0 constant:0];
NSLayoutConstraint *redContraint2 = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0];
[self.view addConstraint:redContraint1];
[self.view addConstraint:redContraint2];
