在xib tableviewcell中绘制半圆的不可预测的错误

问题描述

在代码中，我尝试使用cashapelayer（）和uibezierpath（）创建半圆。 cashapelayer和uibezierpath未按指定绘制路径。在图像中，圆圈应在屏幕的右边缘（self.contentView.frame.width）结束。但没有解决

导入UIKit

bottomCommanTableViewCell类：UITableViewCell {

let gradient_cb :CAGradientLayer? = CAGradientLayer()

@IBOutlet weak var sc_1: UIView!

@IBOutlet weak var sc_2: UIView!

override func awakeFromNib() {

    super.awakeFromNib()

    // Initialization code

   
    let path_cb = UIBezierPath()

    let z0 = CGPoint(x: 0,y: sc_1.bounds.size.height )

    let z2 = CGPoint(x: (self.bounds.size.width)/2,y: -self.bounds.size.height )

    

    let z1 = CGPoint(x: self.bounds.size.width,y: self.bounds.size.height)

    path_cb.move(to: z1)

    path_cb.addQuadCurve(to: z0,controlPoint: z2)
    path_cb.linewidth = 1

    path_cb.stroke()

    let line_cb = CAShapeLayer()

    line_cb.path = path_cb.cgPath;

    line_cb.strokeColor = UIColor.black.cgColor

    line_cb.fillColor = UIColor.blue.cgColor

    

    gradient_cb!.colors = [UIColor().HexToColor_2(hexString: "#DB9240",alpha: 1.0).cgColor,UIColor().HexToColor_2(hexString: "#F14E6B",alpha: 1.0).cgColor]

    gradient_cb!.startPoint = CGPoint(x: 0,y: 1)

    gradient_cb!.endPoint = CGPoint(x: 1,y: 0)

    gradient_cb!.mask = line_cb

    self.layer.addSublayer(gradient_cb!)


}

override func layoutSublayers(of layer: CALayer) {

    super.layoutSublayers(of: layer)

    if let layer = gradient_cb {

        layer.frame = CGRect(x: 0,y:0,width: frame.width,height: frame.height)

    }

}

override func setSelected(_ selected: Bool,animated: Bool) {

    super.setSelected(selected,animated: animated)



    // Configure the view for the selected state

}

}

扩展名UIColor {

func HexToColor_2(hexString: String,alpha:CGFloat? = 1.0) -> UIColor {

    // Convert hex string to an integer

    let hexint = Int(self.intFromHexString(hexStr: hexString))

    let red = CGFloat((hexint & 0xff0000) >> 16) / 255.0

    let green = CGFloat((hexint & 0xff00) >> 8) / 255.0

    let blue = CGFloat((hexint & 0xff) >> 0) / 255.0

    let alpha = alpha!

    // Create color object,specifying alpha as well

    let color = UIColor(red: red,green: green,blue: blue,alpha: alpha)

    return color

}



func intFromHexString_2(hexStr: String) -> UInt32 {

    var hexInt: UInt32 = 0

    // Create scanner

    let scanner: Scanner = Scanner(string: hexStr)

    // Tell scanner to skip the # character

    scanner.charactersToBeSkipped = NSCharacterSet(charactersIn: "#") as CharacterSet

    // Scan hex value

    scanner.scanHexInt32(&hexInt)

    return hexInt

}

} [半圆的纸板图像[] [1]] [2]

[1]：https://i.stack.imgur.com/4YhML.jpg![enter个图片描述在这里]（https://i.stack.imgur.com/uiUfm.jpg）

解决方法

class TCTableViewCell: UITableViewCell {

    var gradient_cb = CAGradientLayer()
    
    override func awakeFromNib() {
        super.awakeFromNib()
        // Initialization code
        self.layoutGradientLayer()
    }

    func layoutGradientLayer() {
        gradient_cb.frame = self.bounds
                
        let line_cb = CAShapeLayer()
        line_cb.path = {
            UIGraphicsBeginImageContext(bounds.size)
            let path = UIBezierPath()
            let z0 = CGPoint(x: 0,y: self.bounds.size.height )
            let z2 = CGPoint(x: (self.bounds.size.width)/2,y: -self.bounds.size.height )
            let z1 = CGPoint(x: self.bounds.size.width,y: self.bounds.size.height)
            path.move(to: z1)
            path.addQuadCurve(to: z0,controlPoint: z2)
            path.lineWidth = 1
            path.stroke()
            UIGraphicsEndImageContext()
            
            return path.cgPath
        }()
        line_cb.strokeColor = UIColor.black.cgColor
        line_cb.fillColor = UIColor.blue.cgColor

        gradient_cb.colors = [UIColor().HexToColor_2(hexString: "#DB9240",alpha: 1.0).cgColor,UIColor().HexToColor_2(hexString: "#F14E6B",alpha: 1.0).cgColor]
        gradient_cb.startPoint = CGPoint(x: 0,y: 1)
        gradient_cb.endPoint = CGPoint(x: 1,y: 0)
        gradient_cb.mask = line_cb
        if gradient_cb.superlayer == nil {
            layer.addSublayer(gradient_cb)
        }
    }
    
    override func setSelected(_ selected: Bool,animated: Bool) {
        super.setSelected(selected,animated: animated)

        // Configure the view for the selected state
    }
    
    override func layoutSublayers(of layer: CALayer) {
        super.layoutSublayers(of: layer)
        self.layoutGradientLayer()
    }
    
}

我刚刚编写的演示单元。更改视图图层的框架后，您需要重绘该图层以调整半圆的半径和arcCenter。