iOS自定義一個仿網易左右滑動切換頁面框架

FSScrollContentView

github:https://github.com/shunFSKi/FSScrollContentView
這是本人在整理項目時抽離了業務代碼整理封裝的一個通俗易懂較為實用的框架。
支持點擊上方標題，切換下方內容頁面，也支持滑動下方內容區域，切換上方的標題。

• 主要用來適用於多個視圖左右滑動，切換頂部標簽控制顯示視圖的需求
• 仿網易新聞，一些電商app的樣式實現
• 實現簡單，通俗易懂，支持一些簡單的自定義
• 自動適應標簽數量控制滑動或不能滑動

效果圖

scrollContentView.gif

使用方式

1、cocoapods

pod search FSScrollContentView 
如果找不到執行pod setup
pod 'FSScrollContentView' 

2、添加文件

直接clone代碼后將項目中的FSScrollContentViewLib文件夾導入自己項目中，導入FSScrollContentView.h頭文件

API使用說明

其實demo中有很詳細的注釋說明，通俗易懂
框架包含FSPageContentView和FSSegmentTitleView兩個完全獨立的類文件，可酌情使用

FSPageContentView

• 創建FSPageContentView

/** 對象方法創建FSPageContentView @param frame frame @param childVCs 子VC數組 @param parentVC 父視圖VC @param delegate delegate @return FSPageContentView */ - (instancetype)initWithFrame:(CGRect)frame childVCs:(NSArray *)childVCs parentVC:(UIViewController *)parentVC delegate:(id<FSPageContentViewDelegate>)delegate; 

• FSPageContentView屬性修改

/** 設置contentView當前展示的頁面索引，默認為0 */ @property (nonatomic, assign) NSInteger contentViewCurrentIndex; 

• FSPageContentView代理方法

/** FSPageContentView開始滑動 @param contentView FSPageContentView */ - (void)FSContentViewWillBeginDragging:(FSPageContentView *)contentView; /** FSPageContentView滑動調用 @param contentView FSPageContentView @param startIndex 開始滑動頁面索引 @param endIndex 結束滑動頁面索引 @param progress 滑動進度 */ - (void)FSContentViewDidScroll:(FSPageContentView *)contentView startIndex:(NSInteger)startIndex endIndex:(NSInteger)endIndex progress:(CGFloat)progress; /** FSPageContentView結束滑動 @param contentView FSPageContentView @param startIndex 開始滑動索引 @param endIndex 結束滑動索引 */ - (void)FSContenViewDidEndDecelerating:(FSPageContentView *)contentView startIndex:(NSInteger)startIndex endIndex:(NSInteger)endIndex; 

FSSegmentTitleView

• 創建FSSegmentTitleView

/** 對象方法創建FSSegmentTitleView @param frame frame @param titlesArr 標題數組，必須傳值 @param delegate delegate @param incatorType 指示器類型 @return FSSegmentTitleView */ - (instancetype)initWithFrame:(CGRect)frame titles:(NSArray *)titlesArr delegate:(id<FSSegmentTitleViewDelegate>)delegate indicatorType:(FSIndicatorType)incatorType; 

• FSSegmentTitleView屬性修改

/**
標題數組，必須傳值
*/
@property (nonatomic, strong) NSArray *titlesArr;廢棄/DEPRECATED_1.0.1

/** 標題文字間距，默認20 */ @property (nonatomic, assign) CGFloat itemMargin; /** 當前選中標題索引，默認0 */ @property (nonatomic, assign) NSInteger selectIndex; /** 標題字體大小，默認15 */ @property (nonatomic, strong) UIFont *titleFont; /** 標題正常顏色，默認black */ @property (nonatomic, strong) UIColor *titleNormalColor; /** 標題選中顏色，默認red */ @property (nonatomic, strong) UIColor *titleSelectColor; /** 指示器顏色，默認與titleSelectColor一樣,在FSIndicatorTypeNone下無效 */ @property (nonatomic, strong) UIColor *indicatorColor; /** 在FSIndicatorTypeCustom時可自定義此屬性，為指示器一端延伸長度，默認5 */ @property (nonatomic, assign) CGFloat indicatorExtension; 

• FSSegmentTitleView代理方法

/** 切換標題 @param titleView FSSegmentTitleView @param startIndex 切換前標題索引 @param endIndex 切換后標題索引 */ - (void)FSSegmentTitleView:(FSSegmentTitleView *)titleView startIndex:(NSInteger)startIndex endIndex:(NSInteger)endIndex; 

• FSSegmentTitleView枚舉類型

typedef enum : NSUInteger { FSIndicatorTypeDefault,//默認與按鈕長度相同 FSIndicatorTypeEqualTitle,//與文字長度相同 FSIndicatorTypeCustom,//自定義文字邊緣延伸寬度 FSIndicatorTypeNone, } FSIndicatorType;//指示器類型枚舉 

For example

詳細使用可以查看demo

self.titleView = [[FSSegmentTitleView alloc]initWithFrame:CGRectMake(0, 64, CGRectGetWidth(self.view.bounds), 50) delegate:self indicatorType:0]; self.titleView.titlesArr = @[@"全部",@"服飾穿搭",@"生活百貨",@"美食吃貨",@"美容護理",@"母嬰兒童",@"數碼家電",@"其他"]; [self.view addSubview:_titleView]; NSMutableArray *childVCs = [[NSMutableArray alloc]init]; for (NSString *title in self.titleView.titlesArr) { ChildViewController *vc = [[ChildViewController alloc]init]; vc.title = title; [childVCs addObject:vc]; } self.pageContentView = [[FSPageContentView alloc]initWithFrame:CGRectMake(0, 114, CGRectGetWidth(self.view.bounds), CGRectGetHeight(self.view.bounds) - 90) childVCs:childVCs parentVC:self delegate:self]; [self.view addSubview:_pageContentView]; - (void)FSSegmentTitleView:(FSSegmentTitleView *)titleView startIndex:(NSInteger)startIndex endIndex:(NSInteger)endIndex { self.pageContentView.contentViewCurrentIndex = endIndex; } - (void)FSContenViewDidEndDecelerating:(FSPageContentView *)contentView startIndex:(NSInteger)startIndex endIndex:(NSInteger)endIndex { self.titleView.selectIndex = endIndex; } 

版本

• 2017.4.28 ——> 1.0初始版本
• 2017.5.7 ——> 1.0.1修改初始化方法，添加了標題選中自定義文字大小類型

作者：PURE藍胖子
鏈接：https://www.jianshu.com/p/34cecb066cc1
來源：簡書
簡書著作權歸作者所有，任何形式的轉載都請聯系作者獲得授權並注明出處。