封裝一個滑動切換頁面的框架

項目中經(jīng)常會用到這樣的頁面結(jié)構(gòu)，頁面頂部有tab欄，點擊能切換到對應(yīng)的頁面（有滑動效果）夯秃，下方的頁面也能夠拖動：

lADPDgQ9qbtgDdLNBQDNAtA_720_1280.jpg_620x10000q90g.jpg

當(dāng)頁面變多時，tab欄也能夠拖動了痢艺，并且當(dāng)頁面滑動使tab欄的頭部或尾部tab選中的時候仓洼，tab欄還會根據(jù)情況自動滑動：

IMB_N5geVC.GIF

還有可能有其他的效果，比如選中的tab下方有下劃線堤舒，下劃線的長度在頁面滑動過程中會根據(jù)兩個tab的長度實時的變化色建，還有tab的文字顏色也會根據(jù)頁面的滑動變化，等等舌缤。
因此箕戳，封裝了一個滑動切換頁面的框架，能夠應(yīng)對這種頁面結(jié)構(gòu)的大多數(shù)需求国撵。最簡單的使用如下：

    // 創(chuàng)建tab欄對應(yīng)的title數(shù)組
    NSArray<NSString *> *titleArr = @[@"騰訊", @"螞蟻金服", @"YY", @"網(wǎng)易"];
    // 創(chuàng)建頁面對應(yīng)的子控制器數(shù)組
    NSMutableArray<UIViewController *> *childVcArr = [NSMutableArray new];
    for (int i = 0; i < titleArr.count; i++) {
        UIViewController *vc = [UIViewController new];
        vc.view.backgroundColor = [UIColor whiteColor];
        UILabel *label = [UILabel lzs_labelWithText:titleArr[i] font:[UIFont systemFontOfSize:14] color:[UIColor redColor]];
        label.center = vc.view.center;
        [vc.view addSubview:label];
        [childVcArr addObject:vc];
    }
    // tab欄的樣式
    LZSTitleStyle *style = [LZSTitleStyle new];
    // 創(chuàng)建pageView
    LZSPageView *pageView = [[LZSPageView alloc] initWithFrame:self.view.bounds titleArr:titleArr style:style childViewControllers:childVcArr parentViewController:self];
    [self.view addSubview:pageView];

頁面如下：

image.png

LZSPageView負(fù)責(zé)tab欄和頁面的交互陵吸，以及tab欄的樣式。所以需要四個參數(shù)構(gòu)建pageView：
1.tab欄對應(yīng)的title數(shù)組
2.頁面對應(yīng)的子控制器數(shù)組
3.負(fù)責(zé)tab欄樣式的對象( LZSTitleStyle)
4.頁面對應(yīng)的子控制器數(shù)組的父控制器
這樣就得到了一個pageView介牙。具體的頁面的業(yè)務(wù)邏輯壮虫，還是寫在頁面對應(yīng)的子控制器的類中。
其中LZSTitleStyle這個類环础，是用來自定義tab欄樣式的旨指，如果你想使用框架的默認(rèn)樣式，那么創(chuàng)建一個LZSTitleStyle對象然后傳進(jìn)來就行了喳整，如果想自定義樣式，LZSTitleStyle提供如下的屬性：

@interface LZSTitleStyle : NSObject

//titleView高度裸扶，默認(rèn)44
@property(nonatomic,assign)float titleViewHeight;
//titleView的寬度框都，默認(rèn)等于pageView寬度
@property(nonatomic,assign)float titleViewWidth;
//titleView的x值，當(dāng)titleView的寬度等于pageView寬度時呵晨，一定為0魏保，當(dāng)titleView的寬度不能等于pageView寬度時,可以設(shè)置，不設(shè)置默認(rèn)為0
@property(nonatomic,assign)float titleViewX;
//title未選中顏色摸屠，默認(rèn)黑色
@property(nonatomic,strong)UIColor *normalColor;
//title選中顏色谓罗，默認(rèn)藍(lán)色
@property(nonatomic,strong)UIColor *selectColor;
//字體大小
@property(nonatomic,assign)float fontSize;
//標(biāo)題欄不能滾動時titleLab寬度等于pageView寬度/title個數(shù)，可以滾動時titleLab寬度等于文字寬度季二，默認(rèn)不能滾動
@property(nonatomic,assign)BOOL isScrollEnable;
//titleLab間距,標(biāo)題欄不能滾動時一定為0檩咱，能滾動時可以設(shè)置間距揭措，默認(rèn)30，最左邊距和最右邊距為itemMargin/2
@property(nonatomic,assign)float itemMargin;
//是否顯示下劃線刻蚯，默認(rèn)顯示
@property(nonatomic,assign)BOOL isShowScrollLine;
//標(biāo)題欄可以滾動時下劃線寬度一定會等于文字的寬度,不能滾動時可以設(shè)置下劃線寬度绊含，默認(rèn)等于titleLab的寬度
@property(nonatomic,assign)float scrollLineWidth;
//下劃線高度，默認(rèn)2
@property(nonatomic,assign)float scrollLineHeight;
//下劃線顏色炊汹，默認(rèn)藍(lán)色
@property(nonatomic,strong)UIColor *scrollLineColor;

@end

以上的LZSPageView的使用是將tab欄和子頁面當(dāng)做一個整體來看的躬充。但是有時候，tab欄和子頁面可能并不適合當(dāng)做一個整體讨便，就像剛開始這張圖：

lADPDgQ9qbtgDdLNBQDNAtA_720_1280.jpg_620x10000q90g.jpg

實際上充甚，tab欄是布局在導(dǎo)航欄上面的，像這樣子

self.navigationItem.titleView = titleView;

所以這個時候就不能直接創(chuàng)建出pageView了霸褒。LZSPageView也提供更加靈活的創(chuàng)建方式來應(yīng)對這種tab欄和子頁面分開的情況：

    // 創(chuàng)建LZSTitleStyle伴找，設(shè)置屬性
    LZSTitleStyle *style = [LZSTitleStyle new];
    style.titleViewHeight = 44;
    style.titleViewWidth = 240;
    style.titleViewX = 0;
    style.normalColor = k3A3D48;
    style.selectColor = k4C72F5;
    style.fontSize = 15;
    style.scrollLineWidth = 30;
    style.scrollLineHeight = 2.5;
    style.scrollLineColor = k4C72F5;
    // 創(chuàng)建LZSTitleView
    self.titleView = [[LZSTitleView alloc] initWithFrame:CGRectMake(0, 0, style.titleViewWidth, style.titleViewHeight) titleArr:@[@"成長故事",@"企業(yè)文化",@"表彰文化"] style:style];
    self.navigationItem.titleView = self.titleView;
    // 創(chuàng)建LZSContentView
    self.childVcArr = @[[self setupGrowthCourseVc],[self setupEnterpriseCultureVc],[self setupPraiseCultureVc]];
    self.contentView = [[LZSContentView alloc] initWithFrame:CGRectMake(0, 0, self.view.width, self.view.height-kStatusBarHeight-self.navigationController.navigationBar.height) childViewControllers:self.childVcArr parentViewController:self];
    [self.view addSubview:self.contentView];
    // 關(guān)鍵，互相設(shè)置代理
    self.titleView.delegate = self.contentView;
    [self.contentView addDelegate:self.titleView];

就是分別創(chuàng)建包含tab欄的LZSTitleView和包含子頁面的LZSContentView傲霸，然后兩個view互相成為代理疆瑰。這樣箍鼓，你就可以單獨(dú)拿到titleView和contentView析孽，而titleView和contentView之間的交互邏輯還是通過框架來解決。

這里L(fēng)ZSContentView設(shè)置代理的方式是使用addDelegate這個方法旁蔼，而不是提供一個delegate屬性去設(shè)置梳凛。因為可能還有其他地方需要監(jiān)聽LZSContentView的滾動耿币，提供一個delegate屬性就只能給titleView使用了，其他地方就監(jiān)聽不了LZSContentView的滾動韧拒。而addDelegate的方法可以讓多個類成為LZSContentView的代理淹接。內(nèi)部實現(xiàn)是使用一個數(shù)組去記錄這些delegate，然后需要調(diào)用的時候遍歷數(shù)組調(diào)用delegate的方法叛溢，這里使用的這個數(shù)組不能使NSMutableArray塑悼，因為NSMutableArray會對它的元素強(qiáng)引用，OC提供了NSPointerArray這個類楷掉，這個類對它的元素是弱引用厢蒜。

這個框架還對子控制器的view的加載時機(jī)(viewDidLoad這個方法)做了處理。LZSContentView的內(nèi)部使用一個UICollectionView去放置子控制器的view的烹植，不過子控制器的view并不會在cell一出現(xiàn)在界面的時候就加載斑鸦，而會等到collectionView停止?jié)L動的時候再加載。這樣做的目的是草雕，如果cell一出現(xiàn)在界面就加載子控制器的view（也就是走viewDidLoad方法）巷屿，如果子頁面很多，而我是通過點擊tab欄去切換子頁面的墩虹，那么剛開始我直接點擊tab欄很后面的tab時嘱巾，就會滑過中間很多界面憨琳，這些界面可能是用戶不想看的，然后這些頁面就都走了viewDidLoad方法浓冒，這樣既會造成滑動動畫的卡頓栽渴，也會造成不必要的頁面的加載：

IMB_NIDknd.GIF

相關(guān)代碼如下：

@interface LZSContentView ()<UICollectionViewDataSource,UICollectionViewDelegate>

@property(nonatomic,strong)NSMutableArray<NSNumber *> *isLoadViewArr;

@end

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    LZSContentCollectionViewCell *cell = [_collectionView dequeueReusableCellWithReuseIdentifier:@"contentCollectionViewCell" forIndexPath:indexPath];
    if (indexPath.row == 0) {
        cell.vc = _childVcArr[indexPath.row];
        _isLoadViewArr[0] = @1;
    } else {
        NSNumber *number = _isLoadViewArr[indexPath.row];
        if (number.integerValue) {
            cell.vc = _childVcArr[indexPath.row];
        } else {
            cell.vc = nil;
        }
    }
    
    
    return cell;
}

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView {

    NSNumber *number = _isLoadViewArr[indexPath.row];
    if (!number.integerValue) {
        cell.vc = _childVcArr[indexPath.row];
        _isLoadViewArr[indexPath.row] = @1;
    }
 
}

- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView {
    
    NSNumber *number = _isLoadViewArr[indexPath.row];
    if (!number.integerValue) {
        cell.vc = _childVcArr[indexPath.row];
        _isLoadViewArr[indexPath.row] = @1;
    }
}

就是使用一個數(shù)組記錄子控制的view是否已經(jīng)加載過了，如果沒有加載過稳懒，那么在- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath里設(shè)置 cell.vc = nil闲擦。如果已經(jīng)加載過了，則設(shè)置cell.vc = _childVcArr[indexPath.row]场梆。在- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView和- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView里判斷當(dāng)前頁面子控制的view是否已經(jīng)加載過了墅冷，如果沒有加載，設(shè)置 cell.vc = _childVcArr[indexPath.row]或油。

github地址：https://github.com/linzhesheng/LZSPageView