iOS UIViewPage 指示器 仿簡書實現

UIIndicatorView

這是一個用於viewpage的一個索引指示器

pod install

target 'Pro' do
pod 'UIIndicatorView'
end

使用

可用於viewpage索引指標控件，可以參考下以下用法
### 例一

    UIIndicatorView *indicator = [[UIIndicatorView alloc] initUIIndicatorViewWithFrame:CGRectMake(10, 20, [UIScreen mainScreen].bounds.size.width - 40, 100) style:UIIndicatorViewDefaultStyle arrays:@[@"KESION", @"WENDYTING", @"TIPO", @"BLOW", @"SUCCESS"]];
    [self.view addSubview:indicator];


    UIIndicatorView *indicator2 = [[UIIndicatorView alloc] initUIIndicatorViewWithFrame:CGRectMake(10, 150, [UIScreen mainScreen].bounds.size.width - 40, 100) style:UIIndicatorViewLineStyle arrays:@[@"KESION", @"WENDYTING", @"TIPO", @"BLOW", @"SUCCESS"]];
    [self.view addSubview:indicator2];

例二

{
    [self.indicatorView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(self.addNewAttention.mas_bottom).offset(4);
        make.left.equalTo(self).offset(8);
        make.right.equalTo(self).offset(-8);
        make.height.mas_equalTo([self.indicatorView getUIHeight]);
    }];
    [_indicatorView addIndicatorItemByString:@"Tube最新內容"];
    [_indicatorView addIndicatorItemByString:@"推薦"];
    [_indicatorView addIndicatorItemByString:@"關注專題"];
    [_indicatorView addIndicatorItemByString:@"關注連載"];
    [_indicatorView addIndicatorItemByString:@"關注作者"];

    [self.indicatorView setShowIndicatorItem:0];

}
- (UIIndicatorView *)indicatorView
{
    if (!_indicatorView) {
        _indicatorView = [[UIIndicatorView alloc] initUIIndicatorViewWithIndicatorColor:kTUBEBOOK_THEME_NORMAL_COLOR font:Font(12)];
    }
    return _indicatorView;
}

如果你想有動畫效果那麼需要對UIScrollerView進行監聽，且在delegate中加下面的代碼

#pragma mark - UIScrollViewDelegate
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
   [self.tubeNavigationView.indicatorView changeIndicatorIndexByScrollerView:scrollView];
}