iOS 布局(二)通过第三方库纯代码AutoLayout布局

2018-05-28  本文已影响194人  redexpress

iOS 布局(一)纯代码AutoLayout布局代码比较繁琐,本文会分别使用SnapKit、PureLayout简化代码。

SnapKit

func addViewBySnapKit() {
  let bgView = UIView()
  bgView.backgroundColor = .groupTableViewBackground
  self.view.addSubview(bgView)
  bgView.snp.makeConstraints { (make) in
    make.height.equalTo(60)
    make.top.equalToSuperview().offset(60)
    make.leading.equalToSuperview().offset(16)
    make.trailing.equalToSuperview().offset(-16)
  }
  
  let nameLabel = UILabel()
  nameLabel.text = "Gavin Yang";
  bgView.addSubview(nameLabel)
  nameLabel.snp.makeConstraints { (make) in
    make.top.bottom.equalToSuperview()
    make.leading.equalToSuperview().offset(8)
  }
  
  let addressLabel = UILabel.init()
  addressLabel.text = "China";
  addressLabel.textColor = .darkGray
  bgView.addSubview(addressLabel)
  addressLabel.snp.makeConstraints { (make) in
    make.top.bottom.equalToSuperview()
    make.leading.equalTo(nameLabel.snp.trailing).offset(20)
  }
}

PureLayout

class ViewController: UIViewController {
    
  let bgView: UIView = {
    let view = UIView.newAutoLayout()
    view.backgroundColor = .groupTableViewBackground
    return view
  }()
  
  let nameLabel: UILabel = {
    let label = UILabel.newAutoLayout()
    label.text = "Gavin Yang"
    return label
  }()
  
  let addressLabel: UILabel = {
    let label = UILabel.newAutoLayout()
    label.text = "China"
    label.textColor = .darkGray
    return label
  }()

  var didSetupConstraints = false
  
  override func loadView() {
    view = UIView()
    view.backgroundColor = .white
    view.addSubview(bgView)
    bgView.addSubview(nameLabel)
    bgView.addSubview(addressLabel)
    view.setNeedsUpdateConstraints()
  }
  
  override func updateViewConstraints() {
    if (!didSetupConstraints) {
      bgView.autoPinEdge(toSuperviewEdge: .left, withInset: 16)
      bgView.autoPinEdge(toSuperviewEdge: .right, withInset: 16)
      bgView.autoPinEdge(toSuperviewEdge: .top, withInset: 60)
      bgView.autoSetDimension(.height, toSize: 60.0)
      
      nameLabel.autoPinEdge(toSuperviewEdge: .top)
      nameLabel.autoPinEdge(toSuperviewEdge: .bottom)
      nameLabel.autoPinEdge(toSuperviewEdge: .leading, withInset: 8)
      
      addressLabel.autoPinEdge(toSuperviewEdge: .top)
      addressLabel.autoPinEdge(toSuperviewEdge: .bottom)
      addressLabel.autoPinEdge(.leading, to: .trailing, of: nameLabel, withOffset: 20)
      didSetupConstraints = true
    }
    super.updateViewConstraints()
  }
}
上一篇下一篇

猜你喜欢

热点阅读