为 tableview 单元格图像创建圆形图片

Posted 2023-02-24

【中文标题】为 tableview 单元格图像创建圆形图片

【英文标题】：creating circular pics for tableview cell images

【发布时间】：2017-02-27 23:54:57

【问题描述】：

我正在尝试在 tableview 单元格中使图像成为圆形，我有我在 *** 上看到的各种方式，但这是我得到的最接近的方式：

如您所见，它们看起来更像是椭圆而不是圆圈。在情节提要中，我将约束设置为保持纵横比 1:1 和视图模式“纵横比填充”。我将这个 UIImage 扩展用于圆形：

extension UIImage 
  var circleMask: UIImage 
    let square = CGSize(width: min(size.width, size.height), height: min(size.width, size.height))
    let imageView = UIImageView(frame: CGRect(origin: CGPoint(x: 0, y: 0), size: square))
    imageView.contentMode = UIViewContentMode.scaleAspectFill
    imageView.image = self
    imageView.layer.cornerRadius = square.width/2
    imageView.layer.borderColor = UIColor.white.cgColor
    imageView.layer.borderWidth = 5
    imageView.layer.masksToBounds = true
    UIGraphicsBeginImageContext(imageView.bounds.size)
    imageView.layer.render(in: UIGraphicsGetCurrentContext()!)
    let result = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return result!
  

这就是我的 cellForRowAt IndexPath 的样子：

  let cell = detailTableView.dequeueReusableCell(withIdentifier: castResuseIdentifier)
    as! CastCell

  let cast = castArray[indexPath.row]

  cell.actorName.text = cast.name
  cell.characterName.text = cast.character
  cell.actorProfileImage.image = castImageArray[indexPath.row].circleMask

  self.detailTableView.rowHeight = 100
  detailTableView.allowsSelection = true

  return cell

不知道为什么它们不是完美的圆，知道吗？

【问题讨论】：

试过了，它只是让它看起来像带圆边的正方形

对不起，我意识到我的上一条评论不正确，所以我删除了它。顺便说一句，你试过这个：***.com/a/39515254/58129 吗？

您确定circleMask 仅在布局完成后才被调用吗？

@AnthonyKong 成功了，谢谢！

【参考方案1】：

这是实现该效果的一种非常糟糕的方式，因为您正在创建一个 UIImageView 并每次都将其渲染到单独的图像上下文中。

如需快速简便的方法，只需在CastCell 中为actorProfileImage 视图的图层设置cornerRadius 属性。

【参考方案2】：

不使用扩展，而是将其添加到 cellForRowAtIndexPath 中，图像变成圆形

 cell.actorProfileImage.layer.cornerRadius = cell.actorProfileImage.frame.size.height/2
  cell.actorProfileImage.clipsToBounds = true
  cell.actorProfileImage.layer.masksToBounds = true