前言

说到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
 
@interface ScrollViewController ()
 
@property (nonatomic, strong) UIScrollView *scrollView;
 
@end
 
@implementation ScrollViewController
 
- (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 < 20; ++i) {
    UILabel *label = [[UILabel alloc] init];
    label.numberOfLines = 0;
    label.layer.borderColor = [UIColor greenColor].CGColor;
    label.layer.borderWidth = 2.0;
    label.text = [self randomText];
    
    // 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);
      }
    }];
    
    lastLabel = label;
  }
  
  [self.scrollView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.edges.mas_equalTo(self.view);
    
    // 让scrollview的contentSize随着内容的增多而变化
    make.bottom.mas_equalTo(lastLabel.mas_bottom).offset(20);
  }];
}
 
- (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() % 50 + 5;
  
  NSMutableString *str = [[NSMutableString alloc] init];
  for (NSUInteger i = 0; i < length; ++i) {
    [str appendString:@"测试数据很长,"];
  }
  
  return str;
}
 
@end
 

讲解

对于循环创建,我们需要记录下一个视图所依赖的控件,这里使用了lastLabel来记录。

我们要想让scrollviewcontentSize随内容的变化而变化,那么就我们一定要添加注意添加约束:

 
1
2
3
4
5
6
7
8
 
  [self.scrollView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.edges.mas_equalTo(self.view);
    
    // 让scrollview的contentSize随着内容的增多而变化
    make.bottom.mas_equalTo(lastLabel.mas_bottom).offset(20);
  }];
 

对于scrollviewtableview,我们不能使用bottom来计算其高,因为这个属性对于scrollviewtableview来说,不用用来计算高度的,而是用于计算contentSize.height的。我们要想随内容而变化,以便可滚动查看,就必须设置bottom约束。

Masonry scrollview循环布局的更多相关文章

  1. 使用Masonry搭建特殊布局时与xib的对比

    之前只有比较浅的接触过Masonry.项目中大多数的布局还是用xib中的AutoLayout与手码的frame计算相结合,相信也会有很多项目和我一样是这两种布局的组合.其实xib各方面用的感觉都挺好, ...

  2. NGUI ScrollView 循环 Item 实现性能优化

    今天来说说一直都让我在项目中头疼的其中一个问题,NGUI 的scrollView 列表性能问题,实现循环使用item减少性能上的开销. 希望能够给其他同学们使用和提供一个我个人的思路,这个写的不是太完 ...

  3. 封装scrollView 循环滚动,tableViewCell(连载) mvc

    封装 封装 封装 ... 封装的重要性太重要了 给大家在送点干货 从一个项目中抽取出来的.和大家一起分享 封装scrollView 循环滚动.tableViewCell(连载) 明天还会更新 tabl ...

  4. iOS scrollview循环播放加缩放

    前些日子一直在研究3d的框架没有时间写博客,不过最后需求改了,也没研究出个啥.这段时间出了新的需求,需要循环播放图片,并且滑动的时候中间的图片有缩放的效果.刚开始想在网上搜索,不过并没有找到合适的de ...

  5. 97、进入ScrollView根布局页面,直接跳到页面底部,不能显示顶部内容

    API使用:http://www.cnblogs.com/over140/archive/2011/01/27/1945964.html 以ScrollView为根的部局,不能从顶部显示其包含的页面内 ...

  6. Scrollview包裹布局问题。

    输入框获取焦点,键盘弹出,背景图片上移: https://blog.csdn.net/wljian1/article/details/79962802 android:scrollbarThumbVe ...

  7. ScrollView在布局中的作用

    ScrollView就是滚动一个View,将View里面的内容滚动起来. 但是由于scroolview只能有一个孩子,因此我们可以在ScrollView中在定义一个布局. 这样的话,我们就会直接滚动整 ...

  8. scrollview 滚动布局

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"    android:layou ...

  9. iOS masonry 不规则tagView布局 并自适应高度

    在搜索页面经常会有不规则的tag出现,这种tagView要有点击事件,单个tagView可以设置文字颜色,宽度不固定根据内容自适应,高度固定,数量不固定.总高度就不固定.最近对于masonry的使用又 ...

随机推荐

  1. 使用hadoop mapreduce分析mongodb数据

    使用hadoop mapreduce分析mongodb数据 (现在很多互联网爬虫将数据存入mongdb中,所以研究了一下,写此文档) 版权声明:本文为yunshuxueyuan原创文章.如需转载请标明 ...

  2. 在oracle下我们如何正确的执行数据库恢复

    标签:oracle 数据库 恢复 原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://jiujian.blog.51cto.com/4 ...

  3. hdu 4421 和poj3678类似二级制操作(2-sat问题)

    /* 题意:还是二进制异或,和poj3678类似 建边和poj3678一样 */ #include<stdio.h> #include<string.h> #include&l ...

  4. hdu4135 Co-prime【容斥原理】

    Co-prime Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total S ...

  5. docker持续集成部署、csphere监控平台【转:http://blog.csdn.net/java_dyq/article/details/51997024】

    为什么使用Docker “ 从我个人使用的角度讲的话  部署来的更方便 只要构建过一次环境 推送到镜像仓库 迁移起来也是分分钟的事情 虚拟化让集群的管理和控制部署都更方便 hub.docker.com ...

  6. 洛谷 P 1018 乘积最大 ==Codevs

    题目描述 今年是国际数学联盟确定的“2000――世界数学年”,又恰逢我国著名数学家华罗庚先生诞辰90周年.在华罗庚先生的家乡江苏金坛,组织了一场别开生面的数学智力竞赛的活动,你的一个好朋友XZ也有幸得 ...

  7. 【git】git回退到某个历史版本(强行推送代码)

    1. 使用git log命令查看所有的历史版本,获取某个历史版本的id,假设查到历史版本的id是139dcfaa558e3276b30b6b2e5cbbb9c00bbdca96. 2. 3. 把修改推 ...

  8. django学习之- 动态验证码学习

    实例:通过前台和后台,实现用户登录页面动态图片验证码校验,图片验证码部分使用Pillow模块实现,作为单独学习部分记录. 前端: <!DOCTYPE html> <html lang ...

  9. EXTJS中整合tinymce的富文本编辑器,添加上传图片功能

    提供部分代码.Ext.create('Ext.window.Window', { id: 'wind', title: 'CRUD窗口', modal: true, height: 800, widt ...

  10. SpringMVC Ueditor1.4.3 未找到上传数据

    ueditor自事的fileupload组件与spring的有冲突.将那个类BinaryUploader 重写就可以了             return storageState;         ...