TaggerKit
TaggerKit 帮助您快速将标签集成到您的 iOS 项目中。它提供了一个用于显示标签的集合视图和一个文本字段,用于将它们添加到另一个集合视图中。TaggerKit 使用的自定义布局基于 Ritesh Gupta 的 TagCellLayout。
示例
要运行示例项目,请克隆仓库,然后首先从 Example 目录中运行 pod install
命令。
需求
TaggerKit 兼容 Swift 4.2/5 并在 iOS 11+ 上运行。
变更日志
0.6.1
• 添加了对 Swift Package Manager 的支持;• 修复了点击按钮导致标签视图无法将标签发送给另一个视图的bug;• 添加了一个方便的初始化方法,可以快速创建标签视图;
0.6
• tagIsBeingAdded
和 tagIsBeingRemoved
方法无法通过覆写从 UIViewControllers 访问。这是因为 UIViewController 绝不再是 TKViewController 的代理。如果您想使用这些方法,您仍然可以使您的控制器遵守 TKCollectionViewDelegate 协议;• 可以设置自定义属性 customTagBorderWidth
和 customTagBorderColor
;• 添加了 Carthage 支持;• 支持 iOS 13、Xcode 11、Swift 5.1;• 一些代码重构;
安装
TaggerKit 可通过 CocoaPods、Carthage 或 SPM 使用。
要安装最新版本,只需将以下行添加到您的 Podfile
pod 'TaggerKit'
在您的 Cartfile 中
github "nekonora/TaggerKit" ~> 0.6.0
或将其作为 Xcode 11 内部的一个 Swift 包添加。
配置
静态标签
标签可以通过多种方式实现。让我们从简单开始:您有一组标签(字符串),您想向用户展示。静态集合视图这正是我们需要的。
- 在 Interface Builder 中,在 ViewController 中创建一个容器视图,然后从故事板中删除其子视图。
-
将 TaggerKit 导入到您的视图中,并创建对容器视图的出口
import TaggerKit class ViewController: UIViewController { @IBOutlet var containerView: UIView!
-
实例化一个
TKCollectionView()
,并将其传给容器var tagCollection = TKCollectionView() override func viewDidLoad() { super.viewDidLoad() add(tagCollection, toView: containerView)
-
给集合视图设置一些标签
tagCollection.tags = ["Some", "Tag", "For", "You"]
-
完成!
动态标签
如果想要看到预览 GIF 中的内容,请执行以下操作。
-
按照上面的说明创建两个集合视图,将它们放入两个不同的容器中。
-
为两个集合视图设置相应的
.action
属性。例如:如果您在一个显示用户已经添加了一些标签的产品视图上,这些标签应该是可删除的,因此该集合的动作应该是.removeAction
(稍后将有关于如何收到标签事件的通知)。productTagsCollection.action = .removeTag
-
创建一个文本字段出口,并将其自定义类设置为
TKTextField
。 -
设置文本字段的
.sender
和.receiver
属性。这使文本字段能够向集合添加标签。发送者是显示从文本字段(应过滤的标签)中获取标签的集合视图,而接收者则是接收这些标签的集合textField.sender = allTagsCollection textField.receiver = productTagsCollection
-
如果您希望“过滤”集合能够添加标签,请设置这些属性
allTagsCollection.action = .addTag allTagsCollection.receiver = productTagsCollection
-
最后,您可能希望在被通知并针对从集合中添加或删除的标签采取行动时执行一些操作。为此,TaggerKit 允许您重写这两个方法以添加您自己的功能(您的控制器必须是集合的代理)
allTagsCollection.delegate = self productTagsCollection.delegate = self override func tagIsBeingAdded(name: String?) { // Example: save testCollection.tags to UserDefault print("added \(name!)") } override func tagIsBeingRemoved(name: String?) { print("removed \(name!)") }
自定义
TKCollectionView
拥有一些您可以设置以修改标签外观的属性
// Custom font
tagCollection.customFont = UIFont.boldSystemFont(ofSize: 14)
// Corner radius of tags
tagCollection.customCornerRadius = 14.0
// Spacing between cells
tagCollection.customSpacing = 20.0
// Background of cells
tagCollection.customBackgroundColor = UIColor.red
// Border for cells
tagCollection.customTagBorderColor = UIColor.red
tagCollection.customTagBorderSize = 2