话题标签 0.1.3

话题标签 0.1.3

Oscar Gotting 维护。



  • Oscar Gotting

话题标签

CIStatus Version License Platform Swift 4.2 support

Hashtags Logo

话题标签是一个用于显示、自定义与一组话题标签交互的iOS库,用Swift编写

⭐️功能

  • 简单易用
  • 完全自定义
  • 动态高度

📲示例

要运行示例项目,请克隆仓库,然后首先从Example目录运行pod install

📋要求

话题标签需要iOS 9.0+

📦安装

话题标签可通过CocoaPods获取。要安装它,只需将以下行添加到您的Podfile:

pod 'Hashtags'

😏用法

基础用法

1) 创建话题标签

let tag = HashTag(word: "hashtag")
let tag = HashTag(word: "hashtag", withHashSymbol: false)
let tag = HashTag(word: "hashtag", withHashSymbol: true, isRemovable: true)

布尔值isRemovable定义话题标签是否可以从列表中移除,通过在它旁边显示一个按钮。布尔值withHashSymbol允许自动在单词前显示一个'#'符号。

注意:默认情况下,话题标签将显示哈希符号且不可移除。

2) 创建视图

您可以使用Hashtags视图直接从代码或通过Interface Builder。

使用代码
var hashtags = HashtagView(frame: ...)

hashtags.backgroundColor = UIColor.lightGray
hashtags.tagBackgroundColor = UIColor.blue
hashtags.cornerRadius = 5.0
hashtags.tagCornerRadius = 5.0
hashtags.tagPadding = 5.0
hashtags.horizontalTagSpacing = 7.0
hashtags.verticalTagSpacing = 5.0

self.view.addSubview(hashtags)
使用接口构建器

简单定义一个 UIView 并将其类设置为 HashtagsView。这样就完成了。

Example Interface Builder

3) 向视图添加标签

let hashtag = ...
hashtagsView.addTag(tag: tag)

您可以一次性添加一个或多个标签。如果要删除它们,也是一样。

func addTag(tag: HashTag)
func addTags(tags: [HashTag])
func removeTag(tag: HashTag)
func removeTags()

动态高度

当标签超过视图实际大小,您可能希望扩展 HashtagView 的大小。

为此,实现 HashtagsViewDelegate

UIViewController: HashtagsViewDelegate {

    func hashtagRemoved(hashtag: HashTag) {
        // Your code here
    }
    func viewShouldResizeTo(size: CGSize) {
        // Your code here
    }
}

示例

当需要时,设置高度约束(从代码或接口构建器)来扩展 HashtagsView 的高度是简单的方法之一。然后,当视图需要扩展时,可以修改约束的 constant 属性。添加动画,你就完成了!

Example dynamic height

UIViewController: HashtagsViewDelegate {
    func viewShouldResizeTo(size: CGSize) {
        guard let constraint = self.heightConstraint else {
            return
        }
        constraint.constant = size.height
        UIView.animate(withDuration: 0.4) {
            self.view.layoutIfNeeded()
        }
    }
}

注意:如果您正在使用接口构建器,您可能希望使用 @IBOutlet 将高度约束链接到父视图。有关更多详细信息,请查看我们的示例项目。

🎨自定义

外观

您可以更改视图的样式属性以及标签本身的设计。

整个视图内的填充
  • containerPaddingLeft

  • containerPaddingRight

  • containerPaddingTop

  • containerPaddingBottom

每个标签内的填充
  • tagPaddingLeft

  • tagPaddingRight

  • tagPaddingTop

  • tagPaddingBottom

标签之间的间隔
  • horizontalTagSpacing

  • verticalTagSpacing

标签外观
  • tagCornerRadius

  • tagBackgroundColor

  • tagTextColor

  • removeButtonSize

  • removeButtonSpacing

如果您决定从界面构建器中定义视图,您也可以访问这些值。

Example Interface Builder

👱作者

Oscar Gotting (@Scaraux)

😍鸣谢

AlignedCollectionViewFlowLayout by Mischa Hildebrand

🚔许可证

Hashtags 在MIT许可证下提供。有关更多信息,请参阅LICENSE文件。