iOS轮子

iOS视图封装 - SSGridView

2017-09-04  本文已影响12人  SealShile

SSGridView

遵循GridViewProtocol两种栅格视图实现方式DJGridView和SSGridView

imageimage
imageimage

功能

  1. 使用Generator实现(DJGridView)
  2. 使用UICollectionView实现(SSGridView)
  3. 可以自定义Seperator Line(Color/width/visible)
  4. 可以自定义间距gapX和gapY

用法

1.实现的接口

protocol GridViewProtocol: NSObjectProtocol {
    
    // Meta
    var views: [UIView] { set get }
    
    var numOfColsPerRow: Int { set get }
    
    var preferRowHeight: CGFloat { set get }
    
    // Seperator Line
    var seperatorLineColor: UIColor { set get }
    
    var seperatorLineWidth: CGFloat { set get }
    
    var seperatorLineVisiable: Bool { set get }
    
    // Gap
    var gapX: CGFloat { set get }
    
    var gapY: CGFloat { set get }
}

2.创建

        var views = [UIView]()
        for _ in 0...8 {
            let view = UIView(frame: CGRect(x: 0, y: 0, width: 50, height: 50))
            view.backgroundColor = UIColor.red
            views.append(view)
        }

        let djGridView = DJGridView(frame: self.view.bounds)
        
        djGridView.numOfColsPerRow = 3
        djGridView.gapX = 10
        djGridView.gapY = 10
        djGridView.seperatorLineWidth = 1
        djGridView.seperatorLineVisiable = true
        
        djGridView.views = views
//        self.view.addSubview(djGridView)
        
        let ssGridView = SSGridView(frame: self.view.bounds)
        ssGridView.numOfColsPerRow = 3
//        ssGridView.gapX = 10
//        ssGridView.gapY = 20
        ssGridView.seperatorLineVisiable = true
        
        ssGridView.views = views
        self.view.addSubview(ssGridView)

3.配置(可选)

DJTagListView的默认配置

    //MARK: - Public Var
    
    //MARK: Meta
    public var numOfColsPerRow: Int = 2
    
    public var preferRowHeight: CGFloat = 50.0
    
    public var views: [UIView] = [] 
    
    //MARK: Seperator Line
    public var seperatorLineColor: UIColor = UIColor.gray
    
    public var seperatorLineWidth: CGFloat = 0.5
    
    public var seperatorLineVisiable: Bool = false
    
    //MARK: Gap
    public var gapX: CGFloat = 0.0
    
    public var gapY: CGFloat = 0.0
上一篇 下一篇

猜你喜欢

热点阅读