如何使用自动布局约束而不是框架？

Question

我想在collectionView的顶部创建一个粘性标题，所以当我尝试滚动时，标题将始终存在。

下面的代码是作品。

collectionView?.contentInset = UIEdgeInsets(top: 59, left: 0, bottom: 0, right: 0) 

if let width = collectionView?.bounds.width { 
    let heaaderEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light)) 
    heaaderEffectView.frame = CGRectMake(0, 64, width, 59) 

    let headerView = DetailedReviewsHeader(frame: CGRectMake(0, 0, width, 59)) 
    heaaderEffectView.contentView.addSubview(headerView) 
    headerView.numberOfReviews = reviews?.count ?? 0 
    headerView.sortButton.addTarget(self, action: #selector(showSortOptions(_:)), forControlEvents: .TouchUpInside) 

    view.addSubview(heaaderEffectView) 
} 

我怎么想取代这条线到自动布局

heaaderEffectView.frame = CGRectMake(0, 64, width, 59) 

一个我试图

view.addSubview(headerEffectView) 
    headerEffectView.topAnchor.constraintEqualToAnchor(view.topAnchor).active = true 
    headerEffectView.heightAnchor.constraintEqualToConstant(59.0).active = true 

但它不工作。该帧始终是（0,0,0,0）。有任何想法吗 ？

Answer 1

我已经添加了应用约束的代码。这是您的要求的代码。尝试一次。清楚看看最后的评论。

collectionView?.contentInset = UIEdgeInsets(top: 59, left: 0, bottom: 0, right: 0) 

if let width = collectionView?.bounds.width { 
    let heaaderEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light)) 
    //heaaderEffectView.frame = CGRectMake(0, 64, width, 59) 

    view.addSubview(heaaderEffectView) 
    heaaderEffectView.translatesAutoresizingMaskIntoConstraints = false 

    heaaderEffectView.addConstraint(NSLayoutConstraint(item: heaaderEffectView, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: nil, attribute: NSLayoutAttribute.NotAnAttribute, multiplier: 1.0, constant: width))// for width of heaaderEffectView 
    heaaderEffectView.addConstraint(NSLayoutConstraint(item: heaaderEffectView, attribute: NSLayoutAttribute.Height, relatedBy: NSLayoutRelation.Equal, toItem: nil, attribute: NSLayoutAttribute.NotAnAttribute, multiplier: 1.0, constant: 59.0))// for height of heaaderEffectView 
    view.addConstraint(NSLayoutConstraint(item: heaaderEffectView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: view, attribute: NSLayoutAttribute.Top, multiplier: 1.0, constant: 64.0))// for y spacing that is top constraint to super view from heaaderEffectView 
    view.addConstraint(NSLayoutConstraint(item: heaaderEffectView, attribute: NSLayoutAttribute.Bottom, relatedBy: NSLayoutRelation.Equal, toItem: view, attribute: NSLayoutAttribute.Bottom, multiplier: 1.0, constant: 0.0))// for x spacing that is leading constraint to super view from heaaderEffectView 

    let headerView = DetailedReviewsHeader(frame: CGRectMake(0, 0, width, 59))// you can remove using frame but i kept it because i don't know what the initializer does with the frame 
    headerView.numberOfReviews = reviews?.count ?? 0 
    headerView.sortButton.addTarget(self, action: #selector(showSortOptions(_:)), forControlEvents: .TouchUpInside) 

    heaaderEffectView.contentView.addSubview(headerView) 
    headerView.translatesAutoresizingMaskIntoConstraints = false 

    heaaderEffectView.addConstraint(NSLayoutConstraint(item: headerView, attribute: NSLayoutAttribute.Leading, relatedBy: NSLayoutRelation.Equal, toItem: heaaderEffectView, attribute: NSLayoutAttribute.Leading, multiplier: 1.0, constant: 0.0))// for leading 0 
    heaaderEffectView.addConstraint(NSLayoutConstraint(item: headerView, attribute: NSLayoutAttribute.Trailing, relatedBy: NSLayoutRelation.Equal, toItem: heaaderEffectView, attribute: NSLayoutAttribute.Trailing, multiplier: 1.0, constant: 0.0))// for trailing 0 
    heaaderEffectView.addConstraint(NSLayoutConstraint(item: headerView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: heaaderEffectView, attribute: NSLayoutAttribute.Top, multiplier: 1.0, constant: 0.0))// for top 0 
    heaaderEffectView.addConstraint(NSLayoutConstraint(item: headerView, attribute: NSLayoutAttribute.Bottom, relatedBy: NSLayoutRelation.Equal, toItem: heaaderEffectView, attribute: NSLayoutAttribute.Bottom, multiplier: 1.0, constant: 0.0))// for bottom 0 

    view.layoutIfNeeded() 
}