我怎样才能在我的自定义表格视图单元格上实现这个 UI

Posted 2023-03-04

【中文标题】我怎样才能在我的自定义表格视图单元格上实现这个 UI

【英文标题】：how can i achive this UI on my custom table view cell

【发布时间】：2021-02-11 12:21:24

【问题描述】：

我想在我的 tableviewcell 上实现这个自定义形状，我该怎么做？

UITableViewCell

【问题讨论】：

请提供一些代码向我们展示您已经尝试过的内容。

我刚刚尝试了一个简单的圆形矩形 uibezierpath

【参考方案1】：

将UIBezierPath 与圆弧一起使用。

将此类添加到您的视图中。

class CellShapeView: UIView 
    
    var fillColor: UIColor = .yellow
    
    private var path: UIBezierPath = UIBezierPath()
    
    override func awakeFromNib() 
        super.awakeFromNib()
        self.backgroundColor = UIColor.clear
    
    
    override func draw(_ rect: CGRect) 
        super.draw(rect)
        
        //For Round corners
        UIBezierPath(roundedRect: rect, byRoundingCorners: .allCorners, cornerRadii: CGSize(width: 10, height: 10)).addClip()
        
        path.move(to: CGPoint(x: 0, y: self.frame.size.height))
        path.addLine(to: CGPoint(x: 0, y: 0))
        path.addLine(to: CGPoint(x: self.frame.size.width, y: 0))
        path.addLine(to: CGPoint(x: self.frame.size.width, y: self.frame.size.height))
        
        path.move(to: CGPoint(x: self.frame.size.width, y: self.frame.size.height))
        
        //Right Side circle arc
        path.addArc(withCenter: CGPoint(x: self.frame.size.width, y: self.frame.size.height/2),
                    radius: 10,
                    startAngle: CGFloat((270 * Double.pi) / 180),
                    endAngle: CGFloat((90 * Double.pi) / 180),
                    clockwise: false)
        
        
        path.close()
        fillColor.setFill()
        path.fill()