高仿網易新聞客戶端首頁滑動切換頁面框架--LXScrollContentView

LXScrollContentView

高仿網易新聞客戶端左右滑動切換頁面的框架

github連接：github.com/LiuXingCode…

簡書連接：www.jianshu.com/p/4ca324102…

1. LXScrollContentView描述

這是一個高仿網易新聞客戶端首頁滑動切換頁面的框架。支持點擊上方標題，切換下方內容頁面，也支持滑動下方內容區域，切換上方的標題。

點擊上方標題下方頁面切換

滑動切換內容頁面上方標題跟隨切換

2.安裝方法

LXScrollContentView支持CocoaPods安裝

pod 'LXScrollContentView'複製代碼

也能夠下載示例Demo,把裏面的LXScrollContentViewLib文件夾拖到你的項目中便可

3.API使用說明

本框架有 LXScollTitleView 和 LXScrollContentView 兩個類，它們徹底獨立，能夠根據項目需求選擇使用。

LXScollTitleView表示上方標題區域，它的具體使用方法以下：

/** 文字未選中顏色，默認black */
@property (nonatomic, strong) UIColor *normalColor;

/** 文字選中和下方滾動條顏色，默認red */
@property (nonatomic, strong) UIColor *selectedColor;


/** 第幾個標題處於選中狀態，默認爲0 */
@property (nonatomic, assign) NSInteger selectedIndex;


/** 每一個標題寬度,默認85.f */
@property (nonatomic, assign) CGFloat titleWidth;


/** 標題字體font，默認14.f */
@property (nonatomic, strong) UIFont *titleFont;

/** 下方滾動指示條高度，默認2.f */
@property (nonatomic, assign) CGFloat indicatorHeight;

/** 選中標題回調block */
@property (nonatomic, copy) BMPageTitleViewSelectedBlock selectedBlock;


/** 刷新界面 @param titles 標題數組 */
- (void)reloadViewWithTitles:(NSArray *)titles;複製代碼

LXScrollContentView 表示下方滾動內容區域，它的具體使用方法以下：

/** 設置當前滾動到第幾個頁面，默認爲0 */
@property (nonatomic, assign) NSInteger currentIndex;


/** 頁面滾動中止時觸發block回調 */
@property (nonatomic, copy) LXScrollContentViewBlock scrollBlock;


/** 刷新頁面內容 @param childVcs 當前View須要裝入的控制器集合 @param parentVC 當前View所在的父控制器 */
- (void)reloadViewWithChildVcs:(NSArray<UIViewController *> *)childVcs parentVC:(UIViewController *)parentVC;複製代碼

如下是一個在ViewController中具體使用案例

//初始化UI
- (void)setupUI{
    self.titleView = [[LXScollTitleView alloc] initWithFrame:CGRectZero];
    __weak typeof(self) weakSelf = self;
    self.titleView.selectedBlock = ^(NSInteger index){
        __weak typeof(self) strongSelf = weakSelf;
        strongSelf.contentView.currentIndex = index;
    };
    self.titleView.backgroundColor = [UIColor colorWithWhite:0.95 alpha:1];
    self.titleView.titleWidth = 60.f;
    [self.view addSubview:self.titleView];

    self.contentView = [[LXScrollContentView alloc] initWithFrame:CGRectZero];
    self.contentView.scrollBlock = ^(NSInteger index){
        __weak typeof(self) strongSelf = weakSelf;
        strongSelf.titleView.selectedIndex = index;
    };
    [self.view addSubview:self.contentView];
}

//調整titleView和contentView的frame
- (void)viewDidLayoutSubviews{
    [super viewDidLayoutSubviews];
    self.titleView.frame = CGRectMake(0, 0, self.view.frame.size.width, 35);
    self.contentView.frame = CGRectMake(0, 35, self.view.frame.size.width, self.view.frame.size.height - 35);
}

//刷新titleView和contentView的數據源，根據項目需求自行選擇數據源
- (void)reloadData{
    NSArray *titles = @[@"首頁",@"體育",@"科技",@"生活",@"本地",@"視頻",@"娛樂",@"時尚",@"房地產",@"經濟"];
    [self.titleView reloadViewWithTitles:titles];

    NSMutableArray *vcs = [[NSMutableArray alloc] init];
    for (NSString *title in titles) {
        LXTestViewController *vc = [[LXTestViewController alloc] init];
        vc.category = title;
        [vcs addObject:vc];
    }
    [self.contentView reloadViewWithChildVcs:vcs parentVC:self];
}複製代碼

4.指望

1.這是 LXScrollContentView 框架發佈的第一個版本，還有不少不完善的地方，歡迎你們提出bug。

2.LXScollTitleView 暫時只有一種樣式，我會盡快增長更多樣式。

3.LXScrollContentView目前使用UICollectionView滑動，在性能方面已經比較優秀。接下來考慮加入cache功能，爭取達到更加順滑的效果。

4.你們若是以爲本框架不錯，但願大家能夠 Star 一下，我會更有動力的去不斷完善。

5.個人郵箱帳號：liuxinghenau@163.com ，簡書地址：www.jianshu.com/u/f367c6621… ，你們有問題能夠隨時聯繫。