Ios 图层顶部drawRect中的图形元素

Ios 图层顶部drawRect中的图形元素,ios,swift,cashapelayer,Ios,Swift,Cashapelayer,我正在尝试创建一个环,使其周围填充的颜色更浅。我计划在drawRect中绘制圆形,并在CAShapeLayer中设置填充动画,然后在顶部绘制一个白色圆形。到目前为止,我的圆圈在模拟器中看起来像这样: 我只需要边缘的浅色。是否可以将CAShapeLayer放置在drawRect中绘制的两个圆之间?代码如下: class MyTimer: UIView { let circleBgColor: UIColor = UIColor(colorLiteralRed: 244.0/255.0,

我正在尝试创建一个环,使其周围填充的颜色更浅。我计划在drawRect中绘制圆形,并在CAShapeLayer中设置填充动画,然后在顶部绘制一个白色圆形。到目前为止,我的圆圈在模拟器中看起来像这样:

我只需要边缘的浅色。是否可以将CAShapeLayer放置在drawRect中绘制的两个圆之间?代码如下:

class MyTimer: UIView {

    let circleBgColor: UIColor = UIColor(colorLiteralRed: 244.0/255.0, green: 165.0/255.0, blue: 35.0/255.0, alpha: 1)
    let circleFgColor : UIColor = UIColor(colorLiteralRed: 254.0/255.0, green: 198.0/255.0, blue: 106.0/255.0, alpha: 1)

    let timeLeftLayer = CAShapeLayer()


    override init(frame: CGRect) {
        super.init(frame: frame)
        self.config()
    }

    //Only called in IB
    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        self.config()
    }

    convenience init() {
        self.init(frame: CGRectZero)
    }

    //Common code here
    func config() {

        backgroundColor = UIColor.clearColor()

        //initially full of time left
        let circlePath = UIBezierPath(arcCenter: CGPoint(x: frame.size.width / 2.0, y: frame.size.height / 2.0), radius: frame.size.width/2, startAngle: 0.0, endAngle: CGFloat(M_PI), clockwise: true)
        timeLeftLayer.path = circlePath.CGPath
        timeLeftLayer.fillColor = circleFgColor.CGColor
        timeLeftLayer.strokeEnd = 1

    }



    override func drawRect(rect: CGRect) {

        let outterCirclePath = UIBezierPath(ovalInRect: rect)
        circleBgColor.setFill()
        outterCirclePath.fill()


        layer.addSublayer(timeLeftLayer)


        let centerCirclePath = UIBezierPath(arcCenter: CGPoint(x: rect.size.width/2, y: rect.size.height/2), radius: rect.size.height*0.4, startAngle: 0, endAngle: CGFloat(M_PI*2), clockwise: true
        )

        UIColor.whiteColor().setFill()
        centerCirclePath.fill()


    }

}

任何关于这方面的建议都会很好。谢谢

在两个图形之间放置图层是不可能的,因为您的图形绘制在同一图层中,更具体地说是在视图的主图层中。您应该做的是在单个图层上分离每个图形,然后在两个图层之间放置一个图层是完全可能的

override func drawRect(rect: CGRect) {

    // backLayer drawing 
    let backLayer = CAShapeLayer()
    backLayer.frame = self.bounds
    backLayer.fillColor = circleBgColor.CGColor
    backLayer.path = UIBezierPath(ovalInRect: rect).CGPath
    self.layer.addSublayer(backLayer)

    // middleLayer drawing
    self.layer.addSublayer(timeLeftLayer)

    // frontLayer drawing
    let frontLayer = CAShapeLayer()
    frontLayer.frame = self.bounds
    frontLayer.fillColor = UIColor.whiteColor().CGColor
    frontLayer.path = UIBezierPath(arcCenter: CGPoint(x: rect.size.width/2, y: rect.size.height/2), radius: rect.size.height*0.4, startAngle: 0, endAngle: CGFloat(M_PI*2), clockwise: true
    ).CGPath
    self.layer.addSublayer(frontLayer)
}

在两个图形之间放置图层是不可能的,因为您的图形绘制在同一图层中,更具体地说是在视图的主图层中。您应该做的是在单个图层上分离每个图形,然后在两个图层之间放置一个图层是完全可能的

override func drawRect(rect: CGRect) {

    // backLayer drawing 
    let backLayer = CAShapeLayer()
    backLayer.frame = self.bounds
    backLayer.fillColor = circleBgColor.CGColor
    backLayer.path = UIBezierPath(ovalInRect: rect).CGPath
    self.layer.addSublayer(backLayer)

    // middleLayer drawing
    self.layer.addSublayer(timeLeftLayer)

    // frontLayer drawing
    let frontLayer = CAShapeLayer()
    frontLayer.frame = self.bounds
    frontLayer.fillColor = UIColor.whiteColor().CGColor
    frontLayer.path = UIBezierPath(arcCenter: CGPoint(x: rect.size.width/2, y: rect.size.height/2), radius: rect.size.height*0.4, startAngle: 0, endAngle: CGFloat(M_PI*2), clockwise: true
    ).CGPath
    self.layer.addSublayer(frontLayer)
}

您可以在“drawRect”上绘制所有内容。添加子层位于错误的位置。您可以在“drawRect”上绘制所有内容。添加子层位于错误的位置。