Masonry复杂ScrollView布局
Posted 西贝了爷
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Masonry复杂ScrollView布局相关的知识，希望对你有一定的参考价值。
前言
说到ios自动布局，有很多的解决办法。有的人使用xib/storyboard自动布局，也有人使用frame来适配。对于前者，笔者并不喜欢，也不支持。对于后者，更是麻烦，到处计算高度、宽度等，千万大量代码的冗余，对维护和开发的效率都很低。
笔者在这里介绍纯代码自动布局的第三方库：Masonry。这个库使用率相当高，在全世界都有大量的开发者在使用，其star数量也是相当高的。
效果图
本节详解Masonry的循环创建视图，并且可以展开与收缩的用法，先看看效果图：
当我们点击某一行时，可以展开：
核心代码
看下代码：
|
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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
|
@interface ScrollViewComplexController ()
@property (nonatomic, strong) UIScrollView *scrollView;
@property (nonatomic, strong) NSMutableArray *expandStates;
@end
@implementation ScrollViewComplexController
- (void)viewDidLoad {
[super viewDidLoad];
self.scrollView = [[UIScrollView alloc] init];
self.scrollView.pagingEnabled = NO;
[self.view addSubview:self.scrollView];
self.scrollView.backgroundColor = [UIColor lightGrayColor];
CGFloat screenWidth = [UIScreen mainScreen].bounds.size.width;
UILabel *lastLabel = nil;
for (NSUInteger i = 0; i < 10; ++i) {
UILabel *label = [[UILabel alloc] init];
label.numberOfLines = 0;
label.layer.borderColor = [UIColor greenColor].CGColor;
label.layer.borderWidth = 2.0;
label.text = [self randomText];
label.userInteractionEnabled = YES;
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(onTap:)];
[label addGestureRecognizer:tap];
// We must preferredMaxLayoutWidth property for adapting to iOS6.0
label.preferredMaxLayoutWidth = screenWidth - 30;
label.textAlignment = NSTextAlignmentLeft;
label.textColor = [self randomColor];
[self.scrollView addSubview:label];
[label mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.mas_equalTo(15);
make.right.mas_equalTo(self.view).offset(-15);
if (lastLabel) {
make.top.mas_equalTo(lastLabel.mas_bottom).offset(20);
} else {
make.top.mas_equalTo(self.scrollView).offset(20);
}
make.height.mas_equalTo(40);
}];
lastLabel = label;
[self.expandStates addObject:[@[label, @(NO)] mutableCopy]];
}
[self.scrollView mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.mas_equalTo(self.view);
// 让scrollview的contentSize随着内容的增多而变化
make.bottom.mas_equalTo(lastLabel.mas_bottom).offset(20);
}];
}
- (NSMutableArray *)expandStates {
if (_expandStates == nil) {
_expandStates = [[NSMutableArray alloc] init];
}
return _expandStates;
}
- (UIColor *)randomColor {
CGFloat hue = ( arc4random() % 256 / 256.0 ); // 0.0 to 1.0
CGFloat saturation = ( arc4random() % 128 / 256.0 ) + 0.5; // 0.5 to 1.0, away from white
CGFloat brightness = ( arc4random() % 128 / 256.0 ) + 0.5; // 0.5 to 1.0, away from black
return [UIColor colorWithHue:hue saturation:saturation brightness:brightness alpha:1];
}
- (NSString *)randomText {
CGFloat length = arc4random() % 150 + 5;
NSMutableString *str = [[NSMutableString alloc] init];
for (NSUInteger i = 0; i < length; ++i) {
[str appendString:@"测试数据很长，"];
}
return str;
}
- (void)onTap:(UITapGestureRecognizer *)sender {
UIView *tapView = sender.view;
NSUInteger index = 0;
for (NSMutableArray *array in self.expandStates) {
UILabel *view = [array firstObject];
if (view == tapView) {
NSNumber *state = [array lastObject];
if ([state boolValue] == YES) {
[view mas_updateConstraints:^(MASConstraintMaker *make) {
make.height.mas_equalTo(40);
}];
} else {
UIView *preView = nil;
UIView *nextView = nil;
if (index - 1 < self.expandStates.count && index >= 1) {
preView = [[self.expandStates objectAtIndex:index - 1] firstObject];
}
if (index + 1 < self.expandStates.count) {
nextView = [[self.expandStates objectAtIndex:index + 1] firstObject];
}
[view mas_remakeConstraints:^(MASConstraintMaker *make) {
if (preView) {
make.top.mas_equalTo(preView.mas_bottom).offset(20);
} else {
make.top.mas_equalTo(20);
}
make.left.mas_equalTo(15);
make.right.mas_equalTo(self.view).offset(-15);
}];
if (nextView) {
[nextView mas_updateConstraints:^(MASConstraintMaker *make) {
|
以上是关于Masonry复杂ScrollView布局的主要内容，如果未能解决你的问题，请参考以下文章