屏幕適配
屏幕適配發(fā)展歷史
-
iPhone3GS/iPhone4
- 沒有屏幕適配可言
- 全部用frame,bounds,center進(jìn)行布局
- 很多這樣的現(xiàn)象: 坐標(biāo)值.寬度.高度值全部寫死
// 例如 UIButton *btn = [[UIButton alloc] init]; btn.frame = CGRectMake(0,0,320-a,480-b); -
iPad出現(xiàn)/iPhone橫屏出現(xiàn)
- Autoresizing技術(shù)出現(xiàn)
讓橫豎屏適配,相對簡單
讓'子控件'可以跟隨'父控件'的行為自動發(fā)生相應(yīng)的改變;
外圍的四條線--代表距離邊的距離固定
內(nèi)部的兩條線--代表可以垂直/水平可以拉伸
前提:關(guān)閉Autolayout功能
-
局限性
- 只能解決子控件和父控件的相對關(guān)系問題
- 不能解決兄弟控件相對位置關(guān)系
-
用代碼實現(xiàn)Autoresizing
redView.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleWidth; // 一般在子控件放到父控件之前,用Autoresizing; [blueView addSubview:redView]; /** UIViewAutoresizingNone = 0, UIViewAutoresizingFlexibleLeftMargin = 1 << 0, 距離父控件左邊的間距是伸縮的（不固定的） UIViewAutoresizingFlexibleRightMargin = 1 << 2, 距離父控件右邊的間距是伸縮的（不固定的） UIViewAutoresizingFlexibleTopMargin = 1 << 3, 距離父控件頂部的間距是伸縮的（不固定的） UIViewAutoresizingFlexibleBottomMargin = 1 << 5, 距離父控件底部的間距是伸縮的（不固定的） UIViewAutoresizingFlexibleWidth = 1 << 1, 寬度跟隨父控件的寬度進(jìn)行自動伸縮 UIViewAutoresizingFlexibleHeight = 1 << 4, 高度跟隨父控件的高度進(jìn)行自動伸縮 */
- Autoresizing技術(shù)出現(xiàn)
-
iOS 6.0 開始出現(xiàn)了Autolayout,(Xcode 5.0)iOS 7.0 開始火
- 核心概念:參照,約束
- 警告(黃點):frame不匹配約束;
- 錯誤(紅點):1.約束沖突,2.缺少約束;
約束添加動畫代碼
// 注意: 更改約束的代碼不用放在要執(zhí)行動畫的block中
self.spacingContraint.constant = 50;
self.widthContraint.constant = 100;
// 執(zhí)行約束改變的動畫
[UIView animateWithDuration:2.0 animations:^{
// self.blueView的約束動畫執(zhí)行語句;
[self.blueView layoutIfNeeded];
}];
-
添加約束的規(guī)則
- 對于兩個同層級view之間的約束關(guān)系,添加到他們的父view上
- 對于兩個不同層級view之間的約束關(guān)系,添加到他們最近的共同的父view上
- 對于有層級關(guān)系的兩個view之間的約束關(guān)系,添加到層級較高的父view上
-
代碼創(chuàng)建約束
// 不要講autresizing的約束轉(zhuǎn)化成為autolayout的約束; blueView.translatesAutoresizingMaskIntoConstraints = NO; // 寬度約束 NSLayoutConstraint *widthCon = [NSLayoutConstraint constraintWithItem:<#(nonnull id)#> attribute:<#(NSLayoutAttribute)#> relatedBy:<#(NSLayoutRelation)#> toItem:<#(nullable id)#> attribute:<#(NSLayoutAttribute)#> multiplier:<#(CGFloat)#> constant:<#(CGFloat)#>] [blueView addConstraint:<#(nonnull NSLayoutConstraint *)#>]; // 高度約束 NSLayoutConstraint *heightCon = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:0.0 constant:300]; [blueView addConstraint:heightCon]; // 右側(cè)約束 NSLayoutConstraint *rightCon = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeRight multiplier:1.0 constant:-20]; [self.view addConstraint:rightCon]; // 底部約束 NSLayoutConstraint *bottonCon = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeBottom multiplier:1.0 constant:-20]; // 注意添加到self.view上 [self.view addConstraint:bottonCon];
-
VFL語言
- visual format language 可視化語言
- 蘋果為了簡化約束的代碼而退出的語言
- 大部分的約束可以用vfl語言表示,但是還是有一部分不能用vfl;
-
Masonry框架的使用(簡化代碼);
- 使用步驟:
- 添加Masonry到工程中
- 添加兩個宏,導(dǎo)入主頭文件
- 注意:兩個宏一定要放到主頭文件之前
//這個方法只會添加新的約束 [blueView mas_makeConstraints:^(MASConstraintMaker *make) { }]; // 這個方法會將以前的所有約束刪掉，添加新的約束 - 使用步驟:
[blueView mas_remakeConstraints:^(MASConstraintMaker *make) {
}];
// 這個方法將會覆蓋以前的某些特定的約束
[blueView mas_updateConstraints:^(MASConstraintMaker *make) {
}];
```
- 約束的類型：
- 尺寸：width\height\size
- 邊界：left\leading\right\trailing\top\bottom
- 中心點：center\centerX\centerY
- 邊界：edges
- make_equalTo和equalTo的選擇
- mas_equalTo：這個方法會對參數(shù)進(jìn)行包裝
- equalTo：這個方法不會對參數(shù)進(jìn)行包裝
- mas_equalTo的功能強(qiáng)于 > equalTo
- 好用的兩個宏
```objc
//define this constant if you want to use Masonry without the 'mas_' prefix
// 如果想要在編程的時候去掉mas_這個東西就可以引入這個宏
#define MAS_SHORTHAND
//define this constant if you want to enable auto-boxing for default syntax
// 如果想使用自動包裝定義下面的宏
#define MAS_SHORTHAND_GLOBALS
注意: 必須放在#import "Masonry.h"之前
```
- 增加可讀性方法
```objc
-(MASConstraint *)with {
return self;
}
-(MASConstraint *)and {
return self;
}
```
使用autolayout注意點
- 一定要擁有父控件之后,再添加約束
- 關(guān)閉Autoresizing功能
