码迷,mamicode.com
首页 > 其他好文 > 详细

PureLayout

时间:2016-01-15 23:05:25      阅读:252      评论:0      收藏:0      [点我收藏+]

标签:

PureLayout 是 iOS & OS X Auto Layout 的终极 API——非常简单,又非常强大。PureLayout 通过一个全面的Auto Layout API 扩展了 UIView/NSView, NSArray 和 NSLayoutConstraint,仿照苹果自身的框架, 构建了一个全面的自动布局 API, 这样你再也不用为适配而苦恼啦!!!

添加PureLayout到你的工程里面

  • 用CocoaPods安装(podilfe中加pod ‘PureLayout‘)/GitHub下载PureLayout, 手动添加到你的项目中
  • 导入头文件#import <PureLayout/PureLayout.h> /  #import "PureLayout.h"

我们就这个布局来简单说一下

技术分享

首先新建几个 View

1
2
3
4
5
@property (nonatomic, strong) UIView *blueView;
@property (nonatomic, strong) UIView *redView;
@property (nonatomic, strong) UIView *yellowView;
@property (nonatomic, strong) UIView *greenView;
@property (nonatomic, assign) BOOL didSetupConstraints; // 判断是否存在约束条件

然后在加载试图

1
2
3
4
5
6
7
8
9
10
11
- (void)loadView
{
self.view = [UIView new];
self.view.backgroundColor = [UIColor colorWithWhite:0.1 alpha:1.0];

[self.view addSubview:self.blueView];
[self.view addSubview:self.redView];
[self.view addSubview:self.yellowView];
[self.view addSubview:self.greenView];
[self.view setNeedsUpdateConstraints]; // 设置新的约束天剑
}

如果没有试图,那么就重新创建一个

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

- (UIView *)blueView
{
if (!_blueView) {
_blueView = [UIView newAutoLayoutView];
_blueView.backgroundColor = [UIColor blueColor];
}
return _blueView;
}

- (UIView *)redView
{
if (!_redView) {
_redView = [UIView newAutoLayoutView];
_redView.backgroundColor = [UIColor redColor];
}
return _redView;
}

- (UIView *)yellowView
{
if (!_yellowView) {
_yellowView = [UIView newAutoLayoutView];
_yellowView.backgroundColor = [UIColor yellowColor];
}
return _yellowView;
}

- (UIView *)greenView
{
if (!_greenView) {
_greenView = [UIView newAutoLayoutView];
_greenView.backgroundColor = [UIColor greenColor];
}
return _greenView;
}

然后再添加试图的约束条件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
- (void)updateViewConstraints   //更新约束条件
{
// 如果没有自动约束条件
if (!self.didSetupConstraints) {
// Blue view is centered on screen,(Centers the view in its superview.) with size {50 pt, 50 pt}

//设置蓝色的 view 在父试图的中心,
[self.blueView autoCenterInSuperview];
//设置蓝色的 view 的宽和高(50.0 50.0)
[self.blueView autoSetDimensionsToSize:CGSizeMake(50.0, 50.0)];

// Red view is positioned at the bottom right corner of the blue view, with the same width, and a height of 40 pt
// 设置红色 view 的顶部是蓝色 view 的底部
[self.redView autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:self.blueView];
//设置红色 view 的左边是蓝色 view 的右边
[self.redView autoPinEdge:ALEdgeLeft toEdge:ALEdgeRight ofView:self.blueView];
//设置红色 view 的宽度就是蓝色 view 的宽度
[self.redView autoMatchDimension:ALDimensionWidth toDimension:ALDimensionWidth ofView:self.blueView];
//设置红色 view 的高度为40.0
[self.redView autoSetDimension:ALDimensionHeight toSize:40.0];

// Yellow view is positioned 10 pt below the red view, extending across the screen with 20 pt insets from the edges,
// and with a fixed height of 25 pt
//设置黄色 veiw 的顶部距离红色 view 距离为10.0
[self.yellowView autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:self.redView withOffset:10.0];
//设置黄色 view 的高度为25.0
[self.yellowView autoSetDimension:ALDimensionHeight toSize:25.0];
//设置黄色 view 距离父试图左边的距离为20.0
[self.yellowView autoPinEdgeToSuperviewEdge:ALEdgeLeft withInset:20.0];
//设置黄色 view 距离父试图右边的距离为20.0
[self.yellowView autoPinEdgeToSuperviewEdge:ALEdgeRight withInset:20.0];

// Green view is positioned 10 pt below the yellow view, aligned to the vertical axis of its superview,
// with its height twice the height of the yellow view and its width fixed to 150 pt
//设置绿色 view 的顶部距离黄色 view 的底部距离为10.0
[self.greenView autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:self.yellowView withOffset:10.0];
//设置绿色 view 相对父试图竖向居中
[self.greenView autoAlignAxisToSuperviewAxis:ALAxisVertical];
//设置绿色的 view 的高度是黄色 view 高度的2.0倍
[self.greenView autoMatchDimension:ALDimensionHeight toDimension:ALDimensionHeight ofView:self.yellowView withMultiplier:2.0];
//设置绿色 view 的宽度为150.0
[self.greenView autoSetDimension:ALDimensionWidth toSize:150.0];

//设置已经添加过约束了
self.didSetupConstraints = YES;
}

[super updateViewConstraints];
}

github 地址:https://github.com/smileyborg/PureLayout#

PureLayout

标签:

原文地址:http://www.cnblogs.com/SensenCoder/p/5134628.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!