圆形背景上的 UIImageView，在 UICollectionViewCell 上

Question

我想给 UICollectionViewCell 上的 UIImageView 一个圆形彩色背景。为此，我将 cornerRadius 应用于 UIImageView 的 layer。

显然 cornerRadius 需要是 frame 的 height/width 的一半。我将这段代码放在 layoutSubviews 方法中，这可能是错误的，因为当它被调用时图像的 frame 是巨大的。旋转 phone 并向后旋转即可解决问题，因为此时 frame 已正确设置。

我应该把cornerRadius计算代码放在哪里？

有没有更好的方法在圆形背景上获取图像？

注意：UIImageView 可能会在布局操作期间更改 height/width。我正在使用自动布局。

代码：

class EventPickerCell: UICollectionViewCell
{
    @IBOutlet weak var image: UIImageView!
    @IBOutlet weak var label: UILabel!

    override func layoutSubviews()
    {
        super.layoutSubviews()

        print("imagesizes = frame = \(image.frame), bounds = \(image.bounds)")
        image.layer.cornerRadius = CGRectGetWidth(image.frame)/2
        image.layer.backgroundColor = UIColor.whiteColor().CGColor
    }
}

Answer 1

试试 cellForItemAtIndexPath。

您可以将您的单元格实例化为 EventPickerCell 并访问其所有属性。

另一种方法是查看计算变量。

类似的东西：在你的手机里：

var image: UIImage = UIImage() {
    didSet {
         imageView.image = image
         imageView.layer.cornerRadius = image.size.width
}

这将在您设置单元格图像后立即设置角半径。

Answer 2

您在 func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell 中将单元格提供给集合视图控制器。这是你配置单元格的地方，所以你也应该在这里更新图像层。

如果您只想让视图自己执行此操作，您可以创建一个 UIImageView 子类并观察 bounds 更新：

override var bounds: CGRect {
  didSet {
    // update layer here
  }
}

Answer 3

您总是可以将 UIImageView 子类化，以便在 frame 更改时设置 cornerRadius。

class CircularImageView : UIImageView {
    override var frame: CGRect {
        didSet { // frame did change
            self.layer.cornerRadius = frame.size.width*0.5 // set corner radius
        }
    }
}

圆形背景上的 UIImageView，在 UICollectionViewCell 上

UIImageView on circular background, on a UICollectionViewCell

uikit

uiimage

ios

uicollectionviewcell

swift