SPPageMenu的github地址:https://github.com/SPStore/SPPageMenu
一、cocopods導(dǎo)入
platform:ios,'8.0'
target 'MyApp' do
pod 'SPPageMenu', '~> 3.5.0'
end
二、 效果演示圖
(演示圖中僅展示了部分功能，更多功能請進(jìn)入github下載源代碼，如果您的網(wǎng)絡(luò)較慢，gif圖可能會延遲加載，您可以先把寶貴的時(shí)間瀏覽其它信息）
Untitled.gif
三、 重難點(diǎn)方法和屬性詳解
// 這個(gè)方法用于傳遞數(shù)據(jù)，items里面可以是NSString、UIImage 或SPPageMenuButtonItem類型，每個(gè)item會根據(jù)傳的元素類型自動展示你要的內(nèi)容；selectedItemIndex是選中的item下標(biāo)，selectedItemIndex不可超過 items的范圍
- (void)setItems:(nullable NSArray *)items selectedItemIndex:(NSUInteger)selectedItemIndex;
A46F678B-C330-4971-993B-C2AA048C98A6.jpeg
// 這個(gè)屬性命名為“橋梁scrollView”，當(dāng)外界的scrollView在左右切換的時(shí)候，需要讓跟蹤器時(shí)刻跟隨該scrollView滾動，bridgeScrollView就是外界左右切換的scrollView。只要bridgeScrollView有值了，SPPageMenu會監(jiān)聽bridgeScrollView的滾動狀態(tài)，從而讓跟蹤器有跟隨效果。如果你忘了設(shè)置這個(gè)屬性或者覺得不好，你還可以在scrollViewDidScroll的代理方法中，調(diào)用SPPageMenu的接口“- (void)moveTrackerFollowScrollView:(UIScrollView *)scrollView”。
@property (nonatomic, strong) UIScrollView *bridgeScrollView;
// 排列方式：支持3種排列方式；1、可滑動，按鈕寬度根據(jù)內(nèi)容自適應(yīng)；2、不可滑動，按鈕等寬；3、不可滑動，按鈕寬度根據(jù)內(nèi)容自適應(yīng)。3種排列方式都有非常高的使用頻率。第1種排列方式：SPPageMene的容量會根據(jù)按鈕個(gè)數(shù)而定；第2種和第3種排列方式:SPPageMenu的容量固定為SPPageMenu的寬度
@property (nonatomic, assign) SPPageMenuPermutationWay permutationWay;
-
排列方式一：SPPageMenuPermutationWayScrollAdaptContent
5ADC4C3A2C55E428CB93E627108AD19B.jpg -
排列方式二：SPPageMenuPermutationWayNotScrollEqualWidths
795A7E94AB1D002B026A7EB346599CE5.jpg -
排列方式三：SPPageMenuPermutationWayNotScrollAdaptContent
C3EEA99CD066F43DD5CCAEBCBD0D8C76.jpg
// 跟蹤器跟蹤模式；這個(gè)屬性從3.4版本開始閃亮登場。該屬性是個(gè)枚舉，共3個(gè)：1、SPPageMenuTrackerFollowingModeAlways，這個(gè)枚舉值的意思是讓跟蹤器時(shí)刻跟隨外界scrollView(即bridgeScrollView)橫向移動； 2、SPPageMenuTrackerFollowingModeEnd，這個(gè)枚舉的意思是當(dāng)外界scrollView滑動結(jié)束時(shí)，跟蹤器才開始移動；相當(dāng)于3.4版本之前的closeTrackerFollowingMode屬性 3、SPPageMenuTrackerFollowingModeHalf，這個(gè)枚舉的意思是當(dāng)外界scrollView拖動距離超過屏幕一半時(shí)，跟蹤器開始移動。
@property (nonatomic, assign) SPPageMenuTrackerFollowingMode trackerFollowingMode;
請大家仔細(xì)觀察跟蹤器(按鈕下面的下劃線)開始移動的時(shí)刻
-
跟蹤模式一：SPPageMenuTrackerFollowingModeAlways
always.gif -
跟蹤模式二：SPPageMenuTrackerFollowingModeEnd
end.gif -
跟蹤模式三：SPPageMenuTrackerFollowingModeHalf
half.gif
// 這個(gè)屬性是設(shè)置內(nèi)容的四周邊距，例如如果你想讓跟蹤器距離底部分割線有一段距離，你就可以設(shè)置contentInset的底部間距，這里指的內(nèi)容是不包括底部分割線的。
@property (nonatomic, assign) UIEdgeInsets contentInset;
下面截圖是設(shè)置pageMenu.contentInset = UIEdgeInsetsMake(0, 50, 0, 50)的結(jié)果,綠色為SPPageMenu的背景色，黃色部分是內(nèi)容
1391991C798B9E6DA6345401EE03A227.jpg
// // 設(shè)置指定item的四周內(nèi)邊距,這和上面那個(gè)屬性不一樣，上面的屬性contentInset作用對象是SPPageMenu整個(gè)控件，而這個(gè)方式作用對象是SPPageMenu里的一個(gè)按鈕
- (void)setContentEdgeInsets:(UIEdgeInsets)contentEdgeInsets forItemAtIndex:(NSUInteger)itemIndex;
// 這個(gè)方法在描述bridgeScrollView的時(shí)候有提到過，在外界的scrollViewDidScroll代理方法中調(diào)用，可以讓跟蹤器時(shí)刻跟隨scrollView滑動，如果bridgeScrollView已經(jīng)賦過值，那這個(gè)方法就沒必要去調(diào)用了。
- (void)moveTrackerFollowScrollView:(UIScrollView *)scrollView;
以上介紹的屬性和方法只是部分的，其余屬性和方法相對簡單，框架中也有非常詳細(xì)的注釋，這里就不再多做介紹
四、 適用場景
網(wǎng)易新聞
A7FD723F-E458-437A-AD3F-D990C8F49C26.jpeg
愛奇藝
09145AB7-9FA8-4442-8E66-28A5D02EB4A6.jpeg
微博
8D4F4543-97C8-43AB-A6ED-152ACC35429D.jpeg
淘寶
8663770C-5DB5-4100-B53D-870B3E007CE8.jpeg
