UIScrollView使用masonry布局

原创已于 2022-09-07 16:30:41 修改 · 3.4k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#uiscrollview #ui #布局 #masonry

于 2017-01-10 16:44:54 首次发布

iOS 开发专栏收录该内容

43 篇文章

订阅专栏

本文介绍了在项目中使用Masonry布局UIScrollView时遇到的问题及解决方案，重点讲述了mas_makeConstraints、mas_update和mas_remake的用法。通过代码示例展示了如何实现UIScrollView的滚动，解释了为何不需要手动设置ContentSize，以及为何同一个backView可以设置两个不同的约束。

UIScrollView使用masonry布局

项目使用masonry来布局UI, 但在使用UIScrollView的时候遇到一些问题.记录下来避免大家掉坑

masonry 三种使用 mas_make,mas_update,mas_remake

关于masonry的使用就不过多的讲解了.可以参考 —— [ githup masonry使用 ]

代码块

例如：
 [self.view addSubview:self.scrollView];
    [self.scrollView addSubview:self.backView];
    [self.backView addSubview:self.headerView];
    [self.backView addSubview:self.introduceView];
    [self.backView addSubview:self.administratorsView];
    [self.backView addSubview:self.userTimesView];
    [self.backView addSubview:self.equipmentView];
    [self.backView addSubview:self.describeView];


 [self.backView mas_makeConstraints:^(MASConstraintMaker *make) {
      
     //   make.edges.equalTo(self.scrollView);
    //    make.width.equalTo(self.scrollView);
         和下面的效果一样
        
        make.top.mas_equalTo(self.scrollView.mas_top).offset(0);
        make.left.mas_equalTo(self.scrollView.mas_left).offset(0);
        make.right.mas_equalTo(self.scrollView.mas_right).offset(0);
        make.bottom.mas_equalTo(self.scrollView.mas_bottom).offset(0);


    }];

    [self.headerView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.mas_equalTo(self.scrollView.mas_top).offset(0);
        make.left.mas_equalTo(self.scrollView.mas_left).offset(0);
        make.size.mas_equalTo(CGSizeMake(Screen_Width, Gloden_Height));

    }];
    [self.introduceView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.mas_equalTo(self.headerView.mas_bottom).offset(0);
        make.left.mas_equalTo(self.scrollView.mas_left).offset(0);
        make.size.mas_equalTo(CGSizeMake(Screen_Width, 155));
    }];
    [self.administratorsView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.mas_equalTo(self.introduceView.mas_bottom).offset(5);
        make.left.mas_equalTo(self.scrollView.mas_left).offset(0);
        make.size.mas_equalTo(CGSizeMake(Screen_Width, 50));
    }];
    [self.userTimesView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.mas_equalTo(self.administratorsView.mas_bottom).offset(5);
        make.left.mas_equalTo(self.scrollView.mas_left).offset(0);
        make.size.mas_equalTo(CGSizeMake(Screen_Width, 65));

    }];
    [self.equipmentView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.mas_equalTo(self.userTimesView.mas_bottom).offset(5);
        make.left.mas_equalTo(self.scrollView.mas_left).offset(0);
        make.size.mas_equalTo(CGSizeMake(Screen_Width, 120));
        
    }];
    

    NSString * name = @"新纪元开始，虽然才过了70几年，但旧纪元仿佛是远古时期的事情。他有点后悔没有多问爸妈有关旧纪元的事情，精确地说，自从成年后他分配到新的住所，他们之间的联系也渐渐减少了，甚至爸妈上天堂的前一天，他们一起吃饭时也没有多说什么。“不过大概很快就可以在天堂里相见了吧”张简心想";
    
    CGSize S = [JJBTools boundingRectWithSize:CGSizeMake(Screen_Width-32, 0) font:14 text:name];
    
    [self.describeView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.mas_equalTo(self.equipmentView.mas_bottom).offset(5);
        make.left.mas_equalTo(self.scrollView.mas_left).offset(0);
        make.size.mas_equalTo(CGSizeMake(Screen_Width, S.height + 40 + Gloden_Height + 30));
        
    }];
   
//新约束
    [self.backView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.bottom.equalTo(self.describeView.mas_bottom);
    }];

这些代码可以实现scrollview 的滚动
有人会问为什么没看到你设置ContenSize 的大小.为什么会滚动呢

其实当你把self.backView添加到scrollView上时,他的大小就是scrollView的contenSize的大小了

你会注意上面的代码 [self.backView mas_makeConstraints…]使用了两次…

这是没有错的…虽然self.backView对象是一样的…但连个约束是不一样的.第一个是对scrollview 的…第二个是对self.describeView的.

PS:self.backView这个视图是来设置scrollView的contenSize的大小的.引用它来实现scrollView的滚动