美文网首页iOS轮子
iOS视图封装 - DJTagListView

iOS视图封装 - DJTagListView

作者: SealShile | 来源:发表于2017-08-23 15:20 被阅读16次

    DJTagListView

    https://github.com/shileseal/DJTagListView
    还有1个TODO未解决,欢迎star和fork

    标签列表

    DJTagListView_image_1.png

    功能

    1. 无选择样式的标签列表
    2. 自定义标签列表的样式
    3. 自定义标签样式
    4. 自定义标签间距
    5. 标签选择分为单选和多选
    DJTagListView_image_2.png
    DJTagListView_image_3 (1).png

    用法

    1.实现的接口

    protocol DJTagListProtocol {
        
        var delegate: DJTagListViewDelegate? { get set }
        
        func setTags(titles: [String])
        
        func setTags(titles: [String], selectedIndexes: [Int])
        
        func addTag(title: String)
        
        func addTags(titles: [String])
        
        func removeTag(index: Int)
        
        func removeAllTags()
        
        func clickTag(index: Int)
        
        func selectTag(index: Int)
        
        func deselectTag(index: Int)
        
        func deselectAllTags()
    }
    
    public protocol DJTagListViewDelegate: NSObjectProtocol {
        
        func tagClicked(tagListView: DJTagListView, sender: UIButton)
    }
    

    2.创建

    
        @IBOutlet weak var sbTagListView: DJTagListView!
        
        //    var djTagListView: DJTagListView = DJTagListView(frame: CGRect(x: 10, y: 100, width: 320, height: 100))
        
            sbTagListView.setTags(["标签1", "标签2", "标签3"])
            sbTagListView.setTags(["标签4", "标签5"], selectedIndexes: [3, 4])
            sbTagListView.addTag("标签6标签6标签6")
            sbTagListView.addTags(["标签7", "标签8"])
            sbTagListView.addTag("标签9")
            sbTagListView.removeTag(8)
            sbTagListView.addTag("标签10标签10标签10标签10标签10标签10标签10标签10标签10")
            sbTagListView.addTag("标签11")
            sbTagListView.addTag("标签12")
         
        sbTagListView.delegate = self
    
    self.view.addSubview(sbTagListView)
    

    3.配置(可选)

            sbTagListView.cornerRadius = 10
            sbTagListView.borderWidth = 0.5
            sbTagListView.tagSelectType = .multiSelection
    

    DJTagListView的默认配置

        //MARK: - Selection Style
        var tagSelectType: TagSelectType = .multiSelection
        
        //MARK: - Tag Layout Style
        var minimumLineSpacing: CGFloat = 5
        var minimumInteritemSpacing: CGFloat = 5
        
        //MARK: - Tag Style
        var titleFont: UIFont = UIFont.systemFontOfSize(12)
        var borderWidth: CGFloat = 0
        
        var titleNormalColor: UIColor = UIColor.grayColor()
        var titleHighlightedColor: UIColor = UIColor.blackColor()
        var titleSelectedColor: UIColor = UIColor.whiteColor()
        
        var tagBgNormalColor: UIColor = UIColor.whiteColor()
        var tagBgHighlightedColor: UIColor = UIColor.whiteColor()
        var tagBgSelectedColor: UIColor = UIColor.redColor()
        
        var borderNormalColor: UIColor = UIColor.grayColor()
        var borderHighlightedColor: UIColor = UIColor.grayColor()
        var borderSelectedColor: UIColor = UIColor.redColor()
        
        var cornerRadius: CGFloat = 0
    

    4.回调方法

    extension ViewController: DJTagListViewDelegate {
    
        func tagClicked(tagListView: DJTagListView, sender: UIButton) {
            print(sender.titleLabel?.text!)
            print(sender.selected)
        }
    }
    

    相关文章

      网友评论

        本文标题:iOS视图封装 - DJTagListView

        本文链接:https://www.haomeiwen.com/subject/hpbddxtx.html