如何将 UIActivityIndi​​catorView 置于 UICollectionViewCell 的中心？

Question

我正在尝试在每个集合视图单元格中放置一个 UIActivityIndi​​catorView，因为它会下载其图像。我让它出现在每个单元格中，但它拒绝居中。它留在左上角。我怎样才能让它正确地居中？

我是这样做的：

extension UIView {

    func showActivityIndicator(onView: UIView, withIndicator: UIActivityIndicatorView) {
        withIndicator.frame = CGRect(x: onView.frame.midX - 20, y: onView.frame.midY - 20, width: 40, height: 40)
        withIndicator.activityIndicatorViewStyle = .whiteLarge
        withIndicator.center = onView.center
        onView.addSubview(withIndicator)
        withIndicator.startAnimating()
    }
}

我在 cellForItemAtIndexPath 中调用该函数，如下所示：

showActivityIndicator(onView: cell.contentView, withIndicator: activityInd)

但我不会将其从左上角移开。有什么建议吗？

Answer 1

您需要添加约束以使其居中。例如使用 NSLayoutAnchor.

您需要将 translatesAutoresizingMaskIntoConstraints 设置为 false，以设置您的约束。并将其添加到视图后设置约束（代码注释中的提示）：

extension UIView {

    func showActivityIndicator(onView: UIView, withIndicator: UIActivityIndicatorView) {
        withIndicator.frame = CGRect(x: onView.frame.midX - 20, y: onView.frame.midY - 20, width: 40, height: 40)
        withIndicator.activityIndicatorViewStyle = .whiteLarge

        // set translatesAutoresizingMaskIntoConstraints to false to set your constraints
        withIndicator.translatesAutoresizingMaskIntoConstraints = false
        onView.addSubview(withIndicator)
        withIndicator.startAnimating()

        // add the constraints to center the indicator
        withIndicator.centerXAnchor.constraint(equalTo: onView.centerXAnchor).isActive = true
        withIndicator.centerYAnchor.constraint(equalTo: onView.centerYAnchor).isActive = true
    }

}

Answer 2

我建议使用约束（又名自动布局）：

indicator.translatesAutoresizingMaskIntoConstraints = false
"your cell".addSubview(indicator)

let widthConstraint = NSLayoutConstraint(item: indicator, attribute: .Width, relatedBy: .Equal,
                                                 toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant: 250)

let heightConstraint = NSLayoutConstraint(item: indicator, attribute: .Height, relatedBy: .Equal,
                                                  toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant: 100)

let xConstraint = NSLayoutConstraint(item: indicator, attribute: .CenterX, relatedBy: .Equal, toItem: self.tableView, attribute: .CenterX, multiplier: 1, constant: 0)

let yConstraint = NSLayoutConstraint(item: indicator, attribute: .CenterY, relatedBy: .Equal, toItem: self.tableView, attribute: .CenterY, multiplier: 1, constant: 0)

NSLayoutConstraint.activateConstraints([widthConstraint, heightConstraint, xConstraint, yConstraint])

Answer 3

试试这个

withIndicator.center = CGPointMake(self.frame.size.width/2, self.frame.size.height/2);