Masonry 關於ScrollView的使用

問題描述

 開發中遇到了關於Masonry對於Scrollview的contentSize的設定問題。通過閱讀Masonry的原始碼，我最終找到了我想要的方法。

 其實問題很簡單，也因為我個人對於Masonry使用還不夠熟練（平時用stb挺多。。）。

 實際情況是這樣的，我要在一個簡單的檢視中顯示一個標題，一個時間，還有一個文字內容，文字內容不定，可能會很多，多到超出這個螢幕，由於是很固定的螢幕佈局，我採用的方式是，ScrollView加上一個容器View（contentView）, 還有三個label即可,三個label加到contentView上，使用Masonry進行佈局。

 這裡涉及到contentSize的地方就是其中一個label是放置內容的我們叫做contentLabel,這個是多行顯示，高度不定，由於這個檢視是加到了contentView上,contentView的高度決定了ScrollView的contentSize,於是要做的就是保證contentLabel的高度動態變化的同時contentView的高度也要動態變化，才能夠保證超出螢幕之後，可以滑動檢視超出的內容文字。多餘的不說了，看程式碼吧。可能程式碼寫的不好，希望大家可以指正:flushed:

程式碼

@interface DemoVC ()
{
    UIScrollView * _scrollView;
    UIView * _contentView;
    UILabel * _titleLabel;
    UILabel * _timeLabel;
    UILabel * _contentLabel;
}
@end

@implementation DemoVC

- (void)viewDidLoad {
    [super viewDidLoad];
    [self createView];
    [self __layoutSubViews];
}

- (void)createView {
    
    UIScrollView * scrollView = [[UIScrollView alloc] init];
    scrollView.backgroundColor = [UIColor groupTableViewBackgroundColor];
    [self.view addSubview:scrollView];
    _scrollView = scrollView;
    
    UIView * contentView = [[UIView alloc] init];
    contentView.backgroundColor = [UIColor groupTableViewBackgroundColor];
    [scrollView addSubview:contentView];
    _contentView = contentView;
    
    UILabel * titleLabel = [[UILabel alloc] init];
    titleLabel.textAlignment = NSTextAlignmentCenter;
    titleLabel.font = [UIFont systemFontOfSize:16.f];
    titleLabel.textColor = CustomBlackColor;
    [contentView addSubview:titleLabel];
    _titleLabel = titleLabel;
    
    UILabel * timeLabel = [[UILabel alloc] init];
    timeLabel.textAlignment = NSTextAlignmentCenter;
    timeLabel.font = [UIFont systemFontOfSize:11.f];
    timeLabel.textColor = [UIColor lightGrayColor];
    [contentView addSubview:timeLabel];
    _timeLabel = timeLabel;
    
    UILabel * contentLabel = [[UILabel alloc] init];
    contentLabel.numberOfLines = 0;
    contentLabel.font = [UIFont systemFontOfSize:14.f];
    contentLabel.textColor = [UIColor darkGrayColor];
    contentLabel.backgroundColor = [UIColor clearColor];
    [contentView addSubview:contentLabel];
    _contentLabel = contentLabel;
    
}

- (void)__layoutSubViews {
    
    [_scrollView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.edges.equalTo(self.view);
    }];

    [_contentView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.edges.equalTo(_scrollView);
        make.width.equalTo(_scrollView);
        make.height.greaterThanOrEqualTo(@0.f);//此處保證容器View高度的動態變化 大於等於0.f的高度
    }];
    
    [_titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(_contentView).offset(20.f);
        make.left.equalTo(_contentView).offset(10);
        make.right.equalTo(_contentView).offset(-10);
        make.height.equalTo(@16.f);
    }];
    
    [_timeLabel mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(_titleLabel.mas_bottom).offset(5.f);
        make.left.equalTo(_contentView).offset(10);
        make.right.equalTo(_contentView).offset(-10);
        make.height.equalTo(@16.f);
    }];
    
    [_contentLabel mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(_timeLabel.mas_bottom).offset(20.f);
        make.left.equalTo(_contentView).offset(10);
        make.right.equalTo(_contentView).offset(-10);
        make.bottom.equalTo(_contentView).offset(-10);// 設定與容器View底部高度固定，contentLabel高度變化的時候，由於設定了容器View的高度動態變化，底部距離固定。 此時contentView的高度變化之後，ScrollView的contentSize就發生了變化，適配文字內容，滑動檢視超出螢幕文字。
//        make.height.greaterThanOrEqualTo(@16.f);//高度動態變化 大於等於16  
    }];
    
    _titleLabel.text = @"測試效果";
    _timeLabel.text = @"2015.09.09";
    _contentLabel.text = @"為什麼要預設向上的陰影呢？儘管Core Animation是從圖層套裝演變而來（可以認為是為iOS建立的私有動畫框架），但是呢，它卻是在Mac OS上面世的，前面有提到，二者的Y軸是顛倒的。這就導致了預設的3個點位移的陰影是向上的。在Mac上，shadowOffset的預設值是陰影向下的，這樣你就能理解為什麼iOS上的陰影方向是向上的了（如圖4.5）為什麼要預設向上的陰影呢？儘管Core Animation是從圖層套裝演變而來（可以認為是為iOS建立的私有動畫框架），但是呢，它卻是在Mac OS上面世的，前面有提到，二者的Y軸是顛倒的。這就導致了預設的3個點位移的陰影是向上的。在Mac上，shadowOffset的預設值是陰影向下的，這樣你就能理解為什麼iOS上的陰影方向是向上的了（如圖4.5）為什麼要預設向上的陰影呢？儘管Core Animation是從圖層套裝演變而來（可以認為是為iOS建立的私有動畫框架），但是呢，它卻是在Mac OS上面世的，前面有提到，二者的Y軸是顛倒的。這就導致了預設的3個點位移的陰影是向上的。在Mac上，shadowOffset的預設值是陰影向下的，這樣你就能理解為什麼iOS上的陰影方向是向上的了（如圖4.5）為什麼要預設向上的陰影呢？儘管Core Animation是從圖層套裝演變而來（可以認為是為iOS建立的私有動畫框架），但是呢，它卻是在Mac OS上面世的，前面有提到，二者的Y軸是顛倒的。這就導致了預設的3個點位移的陰影是向上的。在Mac上，shadowOffset的預設值是陰影向下的，這樣你就能理解為什麼iOS上的陰影方向是向上的了（如圖4.5）為什麼要預設向上的陰影呢？儘管Core Animation是從圖層套裝演變而來（可以認為是為iOS建立的私有動畫框架），但是呢，它卻是在Mac OS上面世的，前面有提到，二者的Y軸是顛倒的。這就導致了預設的3個點位移的陰影是向上的。在Mac上，shadowOffset的預設值是陰影向下的，這樣你就能理解為什麼iOS上的陰影方向是向上的了（如圖4.5）為什麼要預設向上的陰影呢？儘管Core Animation是從圖層套裝演變而來（可以認為是為iOS建立的私有動畫框架），但是呢，它卻是在Mac OS上面世的，前面有提到，二者的Y軸是顛倒的。這就導致了預設的3個點位移的陰影是向上的。在Mac上，shadowOffset的預設值是陰影向下的，這樣你就能理解為什麼iOS上的陰影方向是向上的了（如圖4.5）為什麼要預設向上的陰影呢？儘管Core Animation是從圖層套裝演變而來（可以認為是為iOS建立的私有動畫框架），但是呢，它卻是在Mac OS上面世的，前面有提到，二者的Y軸是顛倒的。這就導致了預設的3個點位移的陰影是向上的。在Mac上，shadowOffset的預設值是陰影向下的，這樣你就能理解為什麼iOS上的陰影方向是向上的了（如圖4.5）為什麼要預設向上的陰影呢？儘管Core Animation是從圖層套裝演變而來（可以認為是為iOS建立的私有動畫框架），但是呢，它卻是在Mac OS上面世的，前面有提到，二者的Y軸是顛倒的。這就導致了預設的3個點位移的陰影是向上的。在Mac上，shadowOffset的預設值是陰影向下的，這樣你就能理解為什麼iOS上的陰影方向是向上的了（如圖4.5）為什麼要預設向上的陰影呢？儘管Core Animation是從圖層套裝演變而來（可以認為是為iOS建立的私有動畫框架），但是呢，它卻是在Mac OS上面世的，前面有提到，二者的Y軸是顛倒的。這就導致了預設的3個點位移的陰影是向上的。在Mac上，shadowOffset的預設值是陰影向下的，這樣你就能理解為什麼iOS上的陰影方向是向上的了（如圖4.5）";
    

}