Masonry之UIScrollView 自動布局

　　由於項目開始比較急，又是一個人，再加上apple自動布局比較麻煩，衡量以后就用了frame來布局畫面。現在稍微閑了一些，就開始對之前的代碼做一些優化。其中有一個小功能是這樣的，一個可以橫向滑動的scrollView，畫面加載的時候從服務器取背景圖以及文字說明和跳轉鏈接，同時圖片做緩存，下一次重新加載的時候如果加載失敗，就加載上一次的內容。那么這個地方就涉及了畫面，圖片緩存兩個部分。本文先從畫面開始說起。

　　第一次使用自動布局來寫scrollView，就遇到了坑。后來在一個博客中找到了答案。鏈接如下：UIScrollView添加AutoLayout約束的坑，核心的意思是：

　　1、scrollView內部子控件的尺寸不能以scrollView的尺寸為參照
　　2、scrollView內部的子控件的約束必須完整

　　設計思路，子視圖（AdvertisementView）一個view，滾動視圖（AdvertisementScrollView）一個view，然后滾動視圖中添加scrollView，ViewController里邊直接添加滾動視圖。

　　代碼如下：

　　AdvertisementView.h

#import <UIKit/UIKit.h>

@interface AdvertisementView : UIView

@property (nonatomic, strong) UILabel *textLabel;

@property (nonatomic, strong) UILabel *textDetailLabel;

- (void)setTextColor:(UIColor *)textColor text:(NSString *)text textDetail:(NSString *)textDetail;

@end

 

　　AdvertisementView.m

#import "AdvertisementView.h"
#import "Define.h"

@implementation AdvertisementView

- (id)init {
    self = [super init];
    if (self) {
        self.textLabel = [[UILabel alloc] init];
        [self.textLabel setFont:[UIFont fontWithName:FONT_NAME size:15]];
        [self.textLabel setTextAlignment:NSTextAlignmentRight];
        [self addSubview:self.textLabel];
        
        self.textDetailLabel = [[UILabel alloc] init];
        [self.textDetailLabel setFont:[UIFont fontWithName:FONT_NAME size:25]];
        [self.textDetailLabel setTextAlignment:NSTextAlignmentRight];
        [self addSubview:self.textDetailLabel];
    }
    
    return self;
}

- (void)layoutSubviews {
    
    [self.textDetailLabel mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(self).with.offset(0);
        make.right.equalTo(self).with.offset(-15);
        make.bottom.equalTo(self).with.offset(-15);
        make.height.mas_equalTo(@25);
    }];
    
    [self.textLabel mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(self).with.offset(0);
        make.right.equalTo(self).with.offset(-15);
        make.bottom.equalTo(self.textDetailLabel.mas_top).with.offset(-5);
        make.height.mas_equalTo(@15);
    }];
}

#pragma mark - load data

- (void)setTextColor:(UIColor *)textColor text:(NSString *)text textDetail:(NSString *)textDetail {
    if (self) {
        [self.textLabel setText:text];
        [self.textLabel setTextColor:textColor];
        
        [self.textDetailLabel setText:textDetail];
        [self.textDetailLabel setTextColor:textColor];
    } else {
        NSLog(@"Error : AdvertisementView class is not init successfully.");
    }
}

@end

　　AdvertisementScrollView.h

#import <UIKit/UIKit.h>
#import "AdvertisementView.h"

@interface AdvertisementScrollView : UIView <UIScrollViewDelegate> {
    NSArray *_viewArray;
}

@property (nonatomic, strong) NSArray *viewArray;

@end

　　AdvertisementScrollView.m

#import "AdvertisementScrollView.h"

@interface AdvertisementScrollView ()

@property (nonatomic, strong) UIScrollView *scrollView;
@property (nonatomic, strong) UIView *contentView;
@property (nonatomic, strong) UIPageControl *pageControl;

@end

@implementation AdvertisementScrollView

- (id)init {
    self = [super init];
    
    if (self) {
        [self addSubview:self.scrollView];
    }
    
    return self;
}

- (void)layoutSubviews {
    [super layoutSubviews];
    
    [self.scrollView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.edges.equalTo(self);
    }];
    
    [self.pageControl mas_makeConstraints:^(MASConstraintMaker *make) {
        make.bottom.mas_equalTo(self.mas_bottom);
        make.centerX.equalTo(self.mas_centerX);
        make.size.mas_equalTo(CGSizeMake(self.bounds.size.width/2 , 30));
    }];
    
    [self.contentView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.edges.equalTo(self.scrollView);
        make.height.equalTo(self.scrollView);
    }];
    
    AdvertisementView *lastAdView = nil;
    
    for (AdvertisementView *adView in self.viewArray) {
        [adView mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(lastAdView ? lastAdView.mas_right : @0);
            make.bottom.equalTo(@0);
            make.width.equalTo(self.scrollView.mas_width);
            make.height.equalTo(self.scrollView.mas_height);
        }];
        
        lastAdView = adView;
    }
    
    [self.contentView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.right.equalTo(lastAdView.mas_right);
    }];
}

#pragma mark - UIScrollViewDelegate

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
    CGFloat pageWidth = scrollView.frame.size.width;
    int currentPage = floor((scrollView.contentOffset.x - pageWidth / 2) / pageWidth) + 1;
    
    self.pageControl.currentPage = currentPage;
}

#pragma mark - getters&setters

- (UIScrollView *)scrollView {
    if (_scrollView == nil) {
        _scrollView = [[UIScrollView alloc] init];
        _scrollView.backgroundColor = [UIColor redColor];
        _scrollView.delegate = self;
        _scrollView.bounces = NO;
        _scrollView.pagingEnabled = YES;
        _scrollView.showsVerticalScrollIndicator = NO;
        _scrollView.showsHorizontalScrollIndicator = NO;
        
        [_scrollView addSubview:self.contentView];
    }
    
    return _scrollView;
}

- (UIView *)contentView {
    if (_contentView == nil) {
        _contentView = [[UIView alloc] init];
    }
    
    return _contentView;
}

- (UIPageControl *)pageControl {
    if (_pageControl == nil) {
        _pageControl = [[UIPageControl alloc] init];
        [_pageControl setCurrentPageIndicatorTintColor:[UIColor whiteColor]];
        [_pageControl setPageIndicatorTintColor:[UIColor grayColor]];
        [_pageControl setCurrentPage:0];
        [_pageControl setNumberOfPages:[self.viewArray count]];
    }
    
    return _pageControl;
}

- (NSArray *)viewArray {
    return _viewArray;
}

- (void)setViewArray:(NSArray *)viewArray {
    _viewArray = viewArray;
    
    for (AdvertisementView *adView in self.viewArray) {
        [self.contentView addSubview:adView];
    }
    [self addSubview:self.pageControl];
}

@end

　　MainPersonalInfoViewController.h

#import <UIKit/UIKit.h>
#import "AdvertisementScrollView.h"
#import "AdvertisementView.h"

@interface MainPersonalInfoViewController : UIViewController {
    AdvertisementScrollView *_adScrollView;
}

@property (nonatomic, strong) AdvertisementScrollView *adScrollView;

@end

　　MainPersonalInfoViewController.m

#import "MainPersonalInfoViewController.h"

@interface MainPersonalInfoViewController ()

@end

@implementation MainPersonalInfoViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    [self.view addSubview:self.adScrollView];
}

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    
    [self.adScrollView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(self.view).with.offset(0);
        make.right.equalTo(self.view).with.offset(0);
        make.top.equalTo(self.view).with.offset(0);
        make.height.mas_equalTo(@150);
    }];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
}

#pragma mark - getters&setters

- (AdvertisementScrollView *)adScrollView {
    if (_adScrollView == nil) {
        _adScrollView = [[AdvertisementScrollView alloc] init];
        [_adScrollView setBackgroundColor:[UIColor grayColor]];
        
        AdvertisementView *adView1 = [[AdvertisementView alloc] init];
        [adView1 setBackgroundColor:[self randomColor]];
        [adView1 setTextColor:[self randomColor] text:@"2.0T四缸又如何？" textDetail:@"測試奧迪Q7 40TFSI S line"];
        
        AdvertisementView *adView2 = [[AdvertisementView alloc] init];
        [adView2 setBackgroundColor:[self randomColor]];
        [adView2 setTextColor:[self randomColor] text:@"解讀低配車" textDetail:@"實拍日產逍客1.2T車型"];
        
        [_adScrollView setViewArray:[@[adView1, adView2] mutableCopy]];
    }
    
    return _adScrollView;
}

- (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];
}

@end

　　以上。