PolioPager
PolioPager 是使用 iOS 中包括搜索标签的 PagerTabStrip 的最简单方式。完全用 Swift 编写。
(日语请见此处)
比较
SNKRS
↓↓↓↓
PoiloPager
PolioPager 允许我们像使用 SNKRS 一样使用 PagerTabStrip。
安装
CocoaPods
您可以通过在 Podfile 中添加它来使用 CocoaPods 安装 PolioPager
pod 'PolioPager'为了获得全部好处，请导入 PolioPager
import PolioPagerCarthage
创建一个包含框架的Cartfile，并运行carthage update。遵循说明将$(SRCROOT)/Carthage/Build/iOS/PolioPager.framework添加到iOS项目中。
github "YuigaWada/PolioPager"
Swift包管理器
打开Xcode，从菜单中选择文件 > Swift包 > 添加包依赖。
手动操作
- 下载并将
PolioPager拖放到项目中。 - 恭喜！
使用示例
import PolioPager
class ViewController: PolioPagerViewController {
override func viewDidLoad() {
super.viewDidLoad()
}
override func tabItems()-> [TabItem] {
return [TabItem(title: "Redbull"),TabItem(title: "Monster"),TabItem(title: "Caffeine Addiction")]
}
override func viewControllers()-> [UIViewController]
{
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let viewController1 = storyboard.instantiateViewController(withIdentifier: "searchView")
let viewController2 = storyboard.instantiateViewController(withIdentifier: "view1")
let viewController3 = storyboard.instantiateViewController(withIdentifier: "view2")
let viewController4 = storyboard.instantiateViewController(withIdentifier: "view3")
return [viewController1, viewController2, viewController3, viewController4]
}
}使用
PolioPager非常简单。
首先，您需要创建一个继承自PolioPagerViewController的视图控制器
class ViewController: PolioPagerViewController {
...
}
您至少需要tabItems()和viewControllers()。
标签项
您只需准备标签项结构和覆盖tabItems()即可。
每个标签的宽度将自动计算。
override func tabItems()-> [TabItem] {
return [TabItem(title: "Redbull"),TabItem(title: "Monster"),TabItem(title: "Caffeine Addiction")]
}视图控制器
覆盖viewControllers()。
override func viewControllers()-> [UIViewController]
{
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let viewController1 = storyboard.instantiateViewController(withIdentifier: "searchView")
let viewController2 = storyboard.instantiateViewController(withIdentifier: "view1")
return [viewController1, viewController2]
}在上面的示例中，视图控制器是通过Storyboard准备的。
对于不了解 instantiateViewController 的人来说，请查看下面。
↓
TabItem 结构
TabItem 定义如下。
public struct TabItem {
var title: String?
var image: UIImage?
var font: UIFont
var cellWidth: CGFloat?
var backgroundColor: UIColor
var normalColor:UIColor
var highlightedColor: UIColor
public init(title: String? = nil,
image: UIImage? = nil,
font:UIFont = .systemFont(ofSize: 15),
cellWidth: CGFloat? = nil,
backgroundColor: UIColor = .white,
normalColor: UIColor = .lightGray,
highlightedColor: UIColor = .black){
self.title = title
self.image = image
self.font = font
self.cellWidth = cellWidth
self.backgroundColor = backgroundColor
self.normalColor = normalColor
self.highlightedColor = highlightedColor
}
}
Search ViewController
要在 Search ViewController 中的 TextFiled 获取输入，你必须采用 PolioPagerSearchTabDelegate 协议。
例如，
import PolioPager
class SearchViewController: UIViewController, PolioPagerSearchTabDelegate, UITextFieldDelegate {
@IBOutlet weak var label: UILabel!
var searchBar: UIView!
var searchTextField: UITextField!
var cancelButton: UIButton!
override func viewDidLoad() {
super.viewDidLoad()
self.searchTextField.delegate = self
}
func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool {
guard let text = textField.text else{ return true }
label.text = text
return true
}
}自定义
颜色 & 边框 & 持续时间
请查看这里。
//color
public var tabBackgroundColor: UIColor = .white
//duration
public var barAnimationDuration: Double = 0.23
public var eachLineSpacing: CGFloat = 5
public var sectionInset: UIEdgeInsets = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 10)
public var selectedBarHeight: CGFloat = 3
//selectedBar
public var selectedBarMargins: (upper: CGFloat, lower: CGFloat) = (1, 2)
//pageView
public var pageViewMargin: CGFloat = 1
边框
你可以在 Tab 和 pageView 之间绘制边框。
public var needBorder: Bool
public var boderHeight: CGFloat = 1
public var borderColor: UIColor = .lightGray持续时间
public var barAnimationDuration: Double = 0.23 //Default.
public var barAnimationDuration: Double = 0.10
其他
你还可以获取这些组件！
//MARK: open IBOutlet
@IBOutlet weak open var collectionView: UICollectionView!
@IBOutlet weak open var searchBar: UIView!
@IBOutlet weak open var selectedBar: UIView!
@IBOutlet weak open var pageView: UIView!
@IBOutlet weak open var searchTextField: UITextField!
@IBOutlet weak open var cancelButton: UIButton!例如，如果你想改变选中条的样式，
//PolioPagerViewController
override func viewDidLoad() {
self.selectedBarHeight = 2
self.selectedBar.layer.cornerRadius = 0
self.selectedBar.backgroundColor = .gray
super.viewDidLoad()
}
更多
如果您要更改可见子视图控制器，请使用moveTo(index: Int)
//PolioPagerViewController
moveTo(index: 1)
moveTo(index: nextIndex)
...您可以设置初始索引。
class ViewController: PolioPagerViewController {
override func viewDidLoad() {
self.initialIndex = 1
...
}
}待办事项
- highlightedColor的工作效果不佳
- 准备Carthage
- selectedBar的宽度可按比例指定
- 制作日语版README
贡献
我们非常欢迎您为PolioPager做出贡献，有关更多信息，请检查LICENSE文件。
其他
Yuiga Wada - 网站 Twitter - @YuigaWada
遵照MIT协议发布。有关更多信息，请参阅LICENSE文件。