sandsame/SGPagingView

A powerful and easy to use segment control (美团、淘宝、京东、微博、腾讯、网易、今日头条等标题滚动视图)

SGPagingView

目录

• 效果图

• 主要内容的介绍

• SGPagingView 集成

• SGPagingView 结构图

• 代码介绍

• 问题及解决方案

• 版本介绍

• Concluding remarks

效果图

主要内容的介绍

• 系统样式
  

• 图片样式
  

• 指示器遮盖样式
  

• 指示器固定样式
  

• 指示器动态样式
  

• 指示器下划线样式
  

• 指示器长度自定义
  

• 标题文字渐显效果
  

• 标题文字缩放效果
  

• 多种指示器滚动样式
  

SGPagingView 集成

• 1、CocoaPods 导入 pod 'SGPagingView', '~> 1.5.1'
• 2、下载、拖拽 “SGPagingView” 文件夹到工程中

SGPagingView 结构图

 SGPageTitleViewConfigure（SGPageTitleView 初始化配置信息）

 SGPageTitleView（用于与 SGPageContent 联动）

 SGPageContentScrollView（内部由 UIScrollView 实现）

 SGPageContentCollectionView（内部由 UICollectionView 实现）

代码介绍

SGPagingView 的使用（详细使用, 请参考 Demo）

    /// pageTitleViewConfigure
    SGPageTitleViewConfigure *configure = [SGPageTitleViewConfigure pageTitleViewConfigure];
    /// pageTitleView
    SGPageTitleView *pageTitleView = [SGPageTitleView pageTitleViewWithFrame:frame delegate:self titleNames:titleNames configure:configure];
    [self.view addSubview:pageTitleView];
    
    /// pageContent
    SGPageContentScrollView *pageContentScrollView = [[SGPageContentScrollView alloc] initWithFrame:frame parentVC:self childVCs:childVCs];
    pageContentScrollView.delegatePageContentScrollView = self;
    [self.view addSubview:pageContentScrollView];

• 滚动内容视图的代理方法

- (void)pageContentScrollView:(SGPageContentScrollView *)pageContentScrollView progress:(CGFloat)progress originalIndex:(NSInteger)originalIndex targetIndex:(NSInteger)targetIndex {
    [self.pageTitleView setPageTitleViewWithProgress:progress originalIndex:originalIndex targetIndex:targetIndex];
}

• 滚动标题视图的代理方法

- (void)pageTitleView:(SGPageTitleView *)pageTitleView selectedIndex:(NSInteger)selectedIndex {
    [self.pageContentScrollView setPageCententScrollViewCurrentIndex:selectedIndex];
}

SGPagingView 的介绍

主要属性、方法	描述
selectedIndex	选中标题下标
resetSelectedIndex	重置标题下标
titleFont	标题文字字号大小，默认 15 号字体
titleColor	普通状态下标题按钮文字的颜色，默认为黑色
titleSelectedColor	选中状态下标题按钮文字的颜色，默认为红色
indicatorColor	指示器颜色，默认为红色
indicatorStyle	指示器样式，默认为下划线样式；下划线、遮盖样式
indicatorHeight	指示器高度；下划线样式下默认为 2.f，遮盖样式下，默认为标题文字的高度，若大于 SGPageTitleView，则高度为 SGPageTitleView 高度，下划线样式未做处理
indicatorAdditionalWidth	指示器遮盖、下划线样式下额外增加的宽度，默认为 0.0f；介于标题文字宽度与按钮宽度之间
titleAdditionalWidth	标题额外增加的宽度，默认为 20.0f
indicatorStyle	指示器样式;SGIndicatorStyleDefault、SGIndicatorStyleCover、SGIndicatorStyleFixed、SGIndicatorStyleDynamic（仅在 SGIndicatorScrollStyleDefault 样式下支持）
indicatorCornerRadius	圆角属性，默认为 0.f；若圆角大于 1/2 指示器高度，则圆角大小为指示器高度的 1/2
indicatorScrollStyle	指示器滚动样式
resetTitle:forIndex:	根据标题下标值重置标题文字
setAttributedTitle:selectedAttributedTitle:forIndex:	根据标题下标值设置标题的 attributedTitle 属性
setImages:selectedImages:imagePositionType:spacing:	设置图片及样式

问题及解决方案

1、CocoaPods 安装 SGPagingView 时，遇到的问题及解决方案

• 若在使用 CocoaPods 安装 SGPagingView 时，出现 [!] Unable to find a specification for SGPagingView 提示时，打开终端先输入 pod repo remove master；执行完毕后再输入 pod setup 即可 (可能会等待一段时间)

---

2、关于父子控制器的说明（SGPageContentScrollView 与 SGPageContentCollectionView）

参考链接

• 添加子视图控制器时，子视图控制器的 viewWillAppear 方法不调用
• addChildViewController 与 viewWillAppear、viewDidAppear 关系说明

---

3、关于侧滑返回手势（请参考 DefaultVCPopGesture 类以及点击子控制器对下一界面所做的处理）

1、如果是系统默认返回 item ；只需实现 SGPageContentScrollView 的 pageContentScrollView:offsetX:代理方法或 SGPageContentCollectionView 的 pageContentCollectionView:offsetX:代理方法，并在此方法实现以下代码即可，如：

- (void)pageContentScrollView:(SGPageContentScrollView *)pageContentScrollView index:(NSInteger)index {
    if (index == 0) {
        self.navigationController.interactivePopGestureRecognizer.enabled = YES;
    } else {
        self.navigationController.interactivePopGestureRecognizer.enabled = NO;
    }
}

2、如果是自定义返回 item

a. 设置代理：self.navigationController.interactivePopGestureRecognizer.delegate = (id)self;

b. 遵循协议：UINavigationControllerDelegate

c. 实现代理方法：

- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer {
    return YES;
}

d. 实现 SGPageContentScrollView 的 pageContentScrollView:index:代理方法或 SGPageContentCollectionView 的 pageContentCollectionView:index:代理方法；实现代码如 1、

3、issues 关于返回手势 已有开发者提供了解决方案，可供参看

---

版本介绍

• 2016-10-07 ：初始版本的创建

• 2017-04-13 ：版本升级（根据标题内容自动识别 SGPageTitleView 是静止还是滚动样式）

• 2017-07-21 ：v1.1.7 加入 CocoaPods 管理以及新增 SGPageContentScrollView 类

• 2017-10-17 ：v1.3.0 版本升级（新增 SGPageTitleViewConfigure 类并提供更多属性设置以及支持指示器遮盖样式）

• 2017-10-28 ：v1.3.2 SGPageTitleViewConfigure 类新增指示器遮盖样式下的边框宽度及边框颜色属性

• 2017-11-28 ：v1.3.3 SGPageContentView 与 SGPageContentScrollView 新增代理方法，用来处理侧滑返回手势

• 2017-12-28 ：v1.3.5 新增指示器动态样式（仅在 SGIndicatorScrollStyleDefault 样式下支持）

• 2018-01-30 ：v1.3.6 解决 SGPageTitleView 标题点击与 SGPageContentView 滚动问题

• 2018-05-08 ：v1.3.7 修复 v1.3.6 选中标题重复点击恢复默认状态以及 SGPageTitleViewConfigure 新增配置属性

• 2018-05-09 ：v1.4.0 版本升级（SGPageTitleView.h 中的部分属性调整到 SGPageTitleViewConfigure.h）

• 2018-06-01 ：v1.4.2 新增标题间分割线属性、根据下标设置标题的 attributedTitle 方法以及设置标题图片位置样式方法

• 2018-07-01 ：v1.4.3 优化标题首次点击居中问题以及修复标题文字缩放切换到后台再返回时存在的标题字号问题

• 2018-07-09 ：v1.5.0 版本升级（具体相关信息请查看 releases 中版本介绍）

Concluding remarks

• 如在使用中, 遇到什么问题或有更好建议者, 请记得 Issues me 或 kingsic@126.com 邮箱联系我