效果图.gif
XLPagerTabStrip是一个分页控制器的第三方库(Swift),使用它可以轻松地建立分页控制器，从而把各页的代码分离，避免了主控制器代码臃肿、难以维护的问题。
安装
- pod 'XLPagerTabStrip'
Pager Types
Button Bar
barButton.gif
- 这是最常见的类型，顶部是分页的标题，与下面的分页控制器联动，并且顶部具有滚动效果。
Bar
bar.gif
- Bar样式，顶部没有标题和图片，只有一个表明当前子控制器的长条。
twitter.gif
- 类似Twitter app的样式。
Segmented
segmented.gif
- 使用了
UISegmentedControl去展示分页控制器
自定义
- 如果上面几种没有你想要的样式，你还可以继承
PagerTabStripViewController类去自定义自己钟意的样式。
使用
主控制器代码
- 创建主控制器继承于
TwitterPagerTabStripViewController, ButtonBarPagerTabStripViewController, SegmentedPagerTabStripViewController, BarPagerTabStripViewController的其中一个。我们项目是ButtonBarPagerTabStripViewController。
import XLPagerTabStrip
class MyPagerTabStripName: ButtonBarPagerTabStripViewController {
..
}
- 如果你需要修改
ButtonBarPagerTabStripViewController顶部的参数，里面提供了许多属性供修改:
// 顶部buttonBar背景颜色
settings.style.buttonBarBackgroundColor: UIColor?
// 最小单元延伸间距
settings.style.buttonBarMinimumInteritemSpacing: CGFloat?
// 最小单元格间距
settings.style.buttonBarMinimumLineSpacing: CGFloat?
settings.style.buttonBarLeftContentInset: CGFloat?
settings.style.buttonBarRightContentInset: CGFloat?
// 选中长条背景颜色
settings.style.selectedBarBackgroundColor = UIColor.blackColor()
// 选中长条高度
settings.style.selectedBarHeight: CGFloat = 5
// item(标签)背景颜色
settings.style.buttonBarItemBackgroundColor: UIColor?
// item(标签)字体大小
settings.style.buttonBarItemFont = UIFont.systemFontOfSize(18)
settings.style.buttonBarItemLeftRightMargin: CGFloat = 8
// item(标签)字体颜色
settings.style.buttonBarItemTitleColor: UIColor?
settings.style.buttonBarItemsShouldFillAvailiableWidth = true
public var buttonBarHeight: CGFloat?
要修改属性需要在super.viewDidLoad()之前实现:
override func viewDidLoad() {
self.settings.style.buttonBarItemFont = .systemFont(ofSize: 14)
self.settings.style.buttonBarItemTitleColor = UIColor.hexColor("#DCB770")
self.settings.style.buttonBarHeight = 40
self.settings.style.buttonBarBackgroundColor = UIColor.white
self.settings.style.buttonBarItemBackgroundColor = UIColor.white
self.settings.style.selectedBarHeight = 2
changeCurrentIndexProgressive = { [weak self] (oldCell: ButtonBarViewCell?, newCell: ButtonBarViewCell?, progressPercentage: CGFloat, changeCurrentIndex: Bool, animated: Bool) -> Void in
guard changeCurrentIndex == true else { return }
oldCell?.label.textColor = .black
newCell?.label.textColor = UIColor.hexColor("#DCB770")
}
super.viewDidLoad()
}
- 添加子控制器,需要实现：
override public func viewControllers(for pagerTabStripController: PagerTabStripViewController) -> [UIViewController] {
return [MyEmbeddedViewController(), MySecondEmbeddedViewController()]
}
子控制器代码
- 需要遵循
IndicatorInfoProvider协议，示例：
class MyEmbeddedViewController: UITableViewController, IndicatorInfoProvider {
func indicatorInfo(for pagerTabStripController: PagerTabStripViewController) -> IndicatorInfo {
return IndicatorInfo(title: "My Child title")
}
}
- 我是4个分页，复用一个类，需要不一样的标题，所以我把标题公开给外部修改：
public var itemInfo: IndicatorInfo = "全部"
func indicatorInfo(for pagerTabStripController: PagerTabStripViewController) -> IndicatorInfo {
return itemInfo
}
主控制器:
override public func viewControllers(for pagerTabStripController: PagerTabStripViewController) -> [UIViewController] {
let child_1 = getVCOfSB("AllOrdersViewController", sbName: "Orders") as! AllOrdersViewController
child_1.itemInfo.title = "全部"
let child_2 = getVCOfSB("AllOrdersViewController", sbName: "Orders") as! AllOrdersViewController
child_2.itemInfo.title = "待付款"
let child_3 = getVCOfSB("AllOrdersViewController", sbName: "Orders") as! AllOrdersViewController
child_3.itemInfo.title = "待发货"
let child_4 = getVCOfSB("AllOrdersViewController", sbName: "Orders") as! AllOrdersViewController
child_4.itemInfo.title = "待收货"
return [child_1, child_2, child_3, child_4]
}
效果.gif
