如何在UITableViewCell中创建圆形？

Question

如何在表格单元格上创建圆形图像？例如：

这是我们的故事板，当我们想要突出显示该行时，箭头指向我们试图绘制圆圈的位置：

更新：

决定使用自定义字体和关联的Swift library执行此操作。正如Leo所指出的那样，当你可以使用图像（或字体）时，生成一个圆就太过分了。就像添加新标签和设置字体/图标一样简单：

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    ..
    if doHighlight {
        cell.statusLabel.setFAIcon(icon: .FACircle, iconSize: 6)
    }
    ..

Answer 1

最高效的方法是添加圆形图像。设置cornerRadius会有效，但这对于一个简单的彩色圆圈来说太过分了。

Answer 2

您可以制作一个添加CAShapeLayer圆圈的视图：

@IBDesignable class CircleView: UIView {

    @IBInspectable public var fillColor:   UIColor = #colorLiteral(red: 0, green: 0, blue: 1, alpha: 1)  { didSet { shapeLayer.fillColor = fillColor.cgColor } }
    @IBInspectable public var strokeColor: UIColor = #colorLiteral(red: 1, green: 1, blue: 1, alpha: 0)  { didSet { shapeLayer.strokeColor = strokeColor.cgColor } }
    @IBInspectable public var lineWidth:   CGFloat = 0   { didSet { setNeedsLayout() } }

    lazy private var shapeLayer: CAShapeLayer = {
        let _shapeLayer = CAShapeLayer()
        _shapeLayer.fillColor = self.fillColor.cgColor
        _shapeLayer.strokeColor = self.strokeColor.cgColor
        self.layer.insertSublayer(_shapeLayer, at: 0)
        return _shapeLayer
    }()

    override func layoutSubviews() {
        super.layoutSubviews()

        let center = CGPoint(x: bounds.midX, y: bounds.midY)
        let radius = (min(bounds.size.width, bounds.size.height) - lineWidth) / 2
        shapeLayer.path = UIBezierPath(arcCenter: center, radius: radius, startAngle: 0, endAngle: .pi * 2, clockwise: true).cgPath
        shapeLayer.lineWidth = lineWidth
    }
}

注意，这是@IBDesignable，因此您可以在Interface Builder中使用它。只需创建一个单独的目标（＆＃34;文件＆＃34; - ＆＃34;新＆＃34; - ＆＃34;目标...＆＃34;）并选择＆＃34; Cocoa Touch Framework＆＃34;并给它一个合适的名字（例如，如果你的应用程序是＆＃34; Foo＆＃34;，你称之为这个框架＆＃34; FooKit＆＃34;）。然后将上面的UIView子类添加到该框架，您可以在IB中引用此类（只需添加一个UIView对象并将其基类更改为CircleView）：

Answer 3

添加一个UIView实例并将其layer.cornerRadius设置为其宽度/高度的一半。

Answer 4

如果身高＆amp; width = 50

   View.clipsToBounds = true
   View.layer.cornerRadius= View.frame.size.width/2

Answer 5

class CircularImageView: UIImageView {
override func layoutSubviews() {
    super.layoutSubviews()

    let radius: CGFloat = self.bounds.size.width / 2.0
    self.layer.cornerRadius = radius
    self.clipsToBounds = true
} }

您还可以创建一个圆形图像视图，它是UIImageView的子类，因此您可以将其直接设置为UIImageView ...