Swift 3 |以编程方式添加约束不会使我的子视图居中
Swift 3 | Adding constraints programmatically doesn't center my subview
我尝试编写一个 UIImageView 扩展,它在我的 ImageView 中间显示一个 ActivityIndicator,我尝试了以下方法,请注意我的 ImageView 对高度 (100) 和宽度 (100) 有限制:
public extension UIImageView {
public func downloadedFrom(url: URL) {
let activityIndicator = UIActivityIndicatorView(activityIndicatorStyle: UIActivityIndicatorViewStyle.gray)
activityIndicator.startAnimating()
let leftSpaceConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.left, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: NSLayoutAttribute.left, multiplier: 1, constant: 40)
let topSpaceConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.top, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: NSLayoutAttribute.top, multiplier: 1, constant: 40)
let widthConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.width, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: 20)
let heightConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.height, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: 20)
self.addSubview(activityIndicator)
self.addConstraints([leftSpaceConstraint, topSpaceConstraint, widthConstraint, heightConstraint])
}
}
我也尝试设置 leadingSpaceConstraint / trailingSpaceConstraint / horizontalConstraint / verticalConstraint 但我的代码没有效果,我设置的每个约束都没有改变任何东西。我的 activityIndicator 像这样留在左上角:
我不明白为什么?在 viewDidLoad 中调用方法 "downloadedFrom" 是这样的:
myImageView.downloadedFrom(url: imageUrl)
我哪里出错了? TY
您正在将您的 imageView 从左侧放在父 UIView 的顶部。它需要取决于 x-axis 和 y-axis 的父 UIImageView 中间的坐标。此外,将 translatesAutoresizingMaskIntoConstraints 设置为 false。看下面的代码:
public extension UIImageView {
public func downloadedFrom(url: URL) {
let activityIndicator = UIActivityIndicatorView(activityIndicatorStyle: UIActivityIndicatorViewStyle.gray)
activityIndicator.startAnimating()
activityIndicator.translatesAutoresizingMaskIntoConstraints = false
let leftSpaceConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.centerX, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: NSLayoutAttribute.centerX, multiplier: 1, constant: 0)
let topSpaceConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.centerY, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: NSLayoutAttribute.centerY, multiplier: 1, constant: 0)
let widthConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.width, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: 20)
let heightConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.height, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: 20)
self.addSubview(activityIndicator)
self.addConstraints([leftSpaceConstraint, topSpaceConstraint, widthConstraint, heightConstraint])
}
}
我尝试编写一个 UIImageView 扩展,它在我的 ImageView 中间显示一个 ActivityIndicator,我尝试了以下方法,请注意我的 ImageView 对高度 (100) 和宽度 (100) 有限制:
public extension UIImageView {
public func downloadedFrom(url: URL) {
let activityIndicator = UIActivityIndicatorView(activityIndicatorStyle: UIActivityIndicatorViewStyle.gray)
activityIndicator.startAnimating()
let leftSpaceConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.left, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: NSLayoutAttribute.left, multiplier: 1, constant: 40)
let topSpaceConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.top, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: NSLayoutAttribute.top, multiplier: 1, constant: 40)
let widthConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.width, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: 20)
let heightConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.height, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: 20)
self.addSubview(activityIndicator)
self.addConstraints([leftSpaceConstraint, topSpaceConstraint, widthConstraint, heightConstraint])
}
}
我也尝试设置 leadingSpaceConstraint / trailingSpaceConstraint / horizontalConstraint / verticalConstraint 但我的代码没有效果,我设置的每个约束都没有改变任何东西。我的 activityIndicator 像这样留在左上角:
我不明白为什么?在 viewDidLoad 中调用方法 "downloadedFrom" 是这样的:
myImageView.downloadedFrom(url: imageUrl)
我哪里出错了? TY
您正在将您的 imageView 从左侧放在父 UIView 的顶部。它需要取决于 x-axis 和 y-axis 的父 UIImageView 中间的坐标。此外,将 translatesAutoresizingMaskIntoConstraints 设置为 false。看下面的代码:
public extension UIImageView {
public func downloadedFrom(url: URL) {
let activityIndicator = UIActivityIndicatorView(activityIndicatorStyle: UIActivityIndicatorViewStyle.gray)
activityIndicator.startAnimating()
activityIndicator.translatesAutoresizingMaskIntoConstraints = false
let leftSpaceConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.centerX, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: NSLayoutAttribute.centerX, multiplier: 1, constant: 0)
let topSpaceConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.centerY, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: NSLayoutAttribute.centerY, multiplier: 1, constant: 0)
let widthConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.width, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: 20)
let heightConstraint = NSLayoutConstraint(item: activityIndicator, attribute: NSLayoutAttribute.height, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: 20)
self.addSubview(activityIndicator)
self.addConstraints([leftSpaceConstraint, topSpaceConstraint, widthConstraint, heightConstraint])
}
}