1.各屏幕大小
设备 |
尺寸 |
像素 |
点 |
iPhone \ iPhone 3G \ iPhone 3GS |
3.5 inch |
320 x 480 |
320 x 480 |
iPhone 4 \ iPhone 4S |
3.5 inch |
640 x 960 |
320 x 480 |
iPhone 5 \ iPhone 5C \ iPhone 5S |
4.0 inch |
640 x 1136 |
320 x 568 |
iPhone6 |
4.7 inch |
750 x 1334 |
375 x 667 |
iPhone6 plus |
5.5 inch |
1242 x 2208 |
414 x 736 |
iPad \ iPad2 |
9.7 inch |
768 x 1024 |
768 x 1024 |
iPad 3(The new iPad) \ iPad4 \ iPad Air |
9.7 inch |
1536 x 2048 |
768 x 1024 |
iPad Mini |
7.9 inch |
768 x 1024 |
768 x 1024 |
iPad Mini 2(iPad Mini with retina display) |
7.9 inch |
1536 x 2048 |
768 x 1024 |
2.Autolayout
(1)代码实现Autolayout的步骤
利用NSLayoutConstraint类创建具体的约束对象
添加约束对象到相应的view上
- (void)addConstraint:(NSLayoutConstraint *)constraint;
- (void)addConstraints:(NSArray *)constraints;
(2)代码实现Autolayout的注意点
要先禁止autoresizing功能,设置view的下面属性为NO
view.translatesAutoresizingMaskIntoConstraints = NO;
添加约束之前,一定要保证相关控件都已经在各自的父控件上
不用再给view设置frame
注意点:
对于两个同层级view之间的约束关系,添加到它们的父view上
对于两个不同层级view之间的约束关系,添加到他们最近的共同父view上
对于有层次关系的两个view之间的约束关系,添加到层次较高的父view上
UIView *blueView = [[UIView alloc] init]; blueView.backgroundColor = [UIColor blueColor]; // 不要将AutoresizingMask转为Autolayout的约束 blueView.translatesAutoresizingMaskIntoConstraints = NO; [self.view addSubview:blueView]; 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];
3.Masonry
// 蓝色控件 UIView *blueView = [[UIView alloc] init]; blueView.backgroundColor = [UIColor blueColor]; [self.view addSubview:blueView]; // 红色控件 UIView *redView = [[UIView alloc] init]; redView.backgroundColor = [UIColor redColor]; [self.view addSubview:redView]; // 添加约束 CGFloat margin = 20; CGFloat height = 50; [blueView makeConstraints:^(MASConstraintMaker *make) { make.left.equalTo(self.view.left).offset(margin); make.right.equalTo(redView.left).offset(-margin); make.bottom.equalTo(self.view.bottom).offset(-margin); make.height.equalTo(height); make.top.equalTo(redView.top); make.bottom.equalTo(redView.bottom); make.width.equalTo(redView.width); }]; [redView makeConstraints:^(MASConstraintMaker *make) { make.right.equalTo(self.view.right).offset(-margin); }];
/** mas_equalTo:这个方法会对参数进行包装 equalTo:这个方法不会对参数进行包装 mas_equalTo的功能强于 > equalTo */ /** 约束的类型: 1.尺寸:width\height\size 2.边界:left\leading\right\trailing\top\bottom 3.中心点:center\centerX\centerY 4.边界:edges */ /* // 这个方法只会添加新的约束 [blueView mas_makeConstraints:^(MASConstraintMaker *make) { }]; // 这个方法会将以前的所有约束删掉,添加新的约束 [blueView mas_remakeConstraints:^(MASConstraintMaker *make) { }]; // 这个方法将会覆盖以前的某些特定的约束 [blueView mas_updateConstraints:^(MASConstraintMaker *make) { }]; */
时间: 2024-11-16 00:28:03