2016-10-10 4 views
1

Пожалуйста, мне нужна помощь ниже, я просто начать обучение, как проектировать интерфейс программно, после нескольких учебников я хотел бы попробовать что-то, то я получил stuckedДобавление ограничений программно быстрое

Я пытаюсь добиться ниже изображение

Desired output

, но это то, что я получил

not what i want

это мой код ниже

class FeedsCell: UICollectionViewCell{ 

override init(frame: CGRect){ 
    super.init(frame: frame) 
    setupViews() 
} 

let thumNailImageView : UIImageView = { 
    let imageView = UIImageView() 
    imageView.backgroundColor = UIColor.blue 
    return imageView 
}() 

let sourceName:UILabel = { 
    let srcLabel = UILabel() 
    srcLabel.backgroundColor = UIColor.purple 
    srcLabel.translatesAutoresizingMaskIntoConstraints = false 
    return srcLabel 
}() 

let separatorView: UIView = { 
    let view = UIView() 
    view.backgroundColor = UIColor.black 
    return view 
}() 

func setupViews(){ 
    addSubview(thumNailImageView) 
    addSubview(separatorView) 
    addSubview(sourceName) 

    addConstraintsWithFormat(format: "H:|-16-[v0(194)]", views: thumNailImageView) 

    addConstraintsWithFormat(format: "V:|-16-[v0]-16-[v1(1)]|", views: thumNailImageView, separatorView) 

    addConstraintsWithFormat(format: "H:|[v0]|", views: separatorView) 



    //left Constriants 
    addConstraint(NSLayoutConstraint(item: sourceName, attribute: .left, relatedBy: .equal, toItem: thumNailImageView, attribute: .right, multiplier: 1, constant: 8)) 

    //Right constraints 
    addConstraint(NSLayoutConstraint(item: sourceName, attribute: .right, relatedBy: .equal, toItem: thumNailImageView, attribute: .right, multiplier: 1, constant: 0)) 

    addConstraintsWithFormat(format: "H:|-8-[v0]-8-|", views: sourceName) 
    addConstraintsWithFormat(format: "V:|-8-[v0(20)]", views: sourceName) 

} 

    required init?(coder aDecoder: NSCoder) { 
     fatalError("init(coder:) has not been implemented") 
    } 

} 


extension UIView{ 
    func addConstraintsWithFormat(format: String, views: UIView...){ 

     var viewDictionary = [String: UIView]() 
     for(index, view) in views.enumerated(){ 
      let key = "v\(index)" 
      view.translatesAutoresizingMaskIntoConstraints = false 
      viewDictionary[key] = view 
     } 


    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: format, options: NSLayoutFormatOptions(), metrics: nil, views: viewDictionary)) 
    } 
} 
+0

Слегка OT, но вы рассматривали использование новый API привязок? Мне гораздо легче делать такие вещи. Может быть, простая ошибка (что я не вижу на первый взгляд) в приведенном выше случае исчезнет. Например. 'sourceName.leftAnchor.constrainEqualToAnchor (thumNailImageView.rightAnchor) .isActive = true' –

+0

@TravisGriggs Лучше всего использовать xibs и раскадровки. – Sulthan

+0

@Sulthan Я могу использовать xibs и раскадровку, чтобы достичь этого, но пытаюсь сделать это программно, cus я буду выполнять некоторые функции – SimpiMind

ответ

0

Я был в состоянии решить эту проблему с помощью SnapKit, чтобы добиться изображений сделали что-то вроде этого

let screenFrame = UIScreen.main.bounds 

    thumNailImageView.snp.makeConstraints { (make) in 
     make.width.equalTo(194) 
     make.top.equalTo(contentView).offset(20) 
     make.left.equalTo(contentView).offset(20) 
     make.bottom.equalTo(contentView).offset(-20) 
    } 

    sourceName.snp.makeConstraints { (make) in 
     make.width.equalTo(screenFrame.width/2 - 40) 
     make.height.equalTo(20) 
     make.top.equalTo(contentView).offset(20) 
     make.left.equalTo(contentView).offset(screenFrame.width/2 + 20) 
    } 

    postTitle.snp.makeConstraints { (make) in 
     make.width.equalTo(screenFrame.width/2 - 40) 
     make.height.equalTo(30) 
     make.top.equalTo(sourceName).offset(30) 
     make.left.equalTo(contentView).offset(screenFrame.width/2 + 20) 
    } 

    timeStamp.snp.makeConstraints { (make) in 
     make.width.equalTo(screenFrame.width/2 - 40) 
     make.height.equalTo(10) 
     make.top.equalTo(postTitle).offset(40) 
     make.left.equalTo(contentView).offset(screenFrame.width/2 + 20) 
    } 

    postContent.snp.makeConstraints { (make) in 
     make.width.equalTo(screenFrame.width/2 - 40) 
     make.height.equalTo(60) 
     make.top.equalTo(timeStamp).offset(20) 
     make.left.equalTo(contentView).offset(screenFrame.width/2 + 20) 
    } 
Смежные вопросы