Farbverlauf in Kreis

Question

Ich muss einen Kreis mit Animation erstellen, ich habe es erstellt und alles funktioniert gut. Mein Problem ist, Farbverlauf hinzuzufügen. Siehe Screenshot

angebracht

Unten ist mein Code Kreis mit Animation für die Erstellung von:

 let lineWidth: CGFloat = 20 

     dispatch_async(dispatch_get_main_queue()) {() -> Void in 

     let startAngle = -90.0 
     let endAngle = -90.01 

     let circlePath = UIBezierPath(arcCenter: CGPoint(x: self.frame.width/2,y: self.frame.height/2), radius: CGFloat(self.frame.width/2 - (self.lineWidth/2)), startAngle: CGFloat(((startAngle)/180.0 * M_PI)), endAngle:CGFloat(((endAngle)/180.0 * M_PI)), clockwise: true) 

     // Circle layer 
     let circleLayer = CAShapeLayer() 
     circleLayer.path = circlePath.CGPath 
     circleLayer.fillColor = UIColor.clearColor().CGColor 
     circleLayer.strokeColor = UIColor.greenColor().CGColor 
     circleLayer.strokeEnd = 94/100 
     circleLayer.lineWidth = self.lineWidth 
     circleLayer.zPosition = 1 

     // Background circle layer 
     let circleBackgroundLayer = CAShapeLayer() 
     circleBackgroundLayer.path = circlePath.CGPath 
     circleBackgroundLayer.fillColor = UIColor.clearColor().CGColor 
     circleBackgroundLayer.strokeColor = UIColor.lightgrayColor().CGColor 
     circleBackgroundLayer.strokeEnd = 1.0 
     circleBackgroundLayer.lineWidth = self.lineWidth 
     circleBackgroundLayer.zPosition = -1 

     self.layer.addSublayer(circleLayer) 
     self.layer.addSublayer(circleBackgroundLayer) 

     // Add Animation 
     let pathAnimation = CABasicAnimation(keyPath: "strokeEnd") 
     pathAnimation.duration = 0.55 
     pathAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionLinear) 
     pathAnimation.fromValue = 0 
     pathAnimation.toValue = 94/100 

     circleLayer.addAnimation(pathAnimation, forKey: "strokeEnd") 

    } 

Meine Frage ist in dem obigen Code, wo soll ich CAGradientLayer hinzufügen Gradient Farbe hinzufügen.

Die folgenden Zeilen Code ist Gradienten Farbe hinzuzufügen:

 let gradient: CAGradientLayer = CAGradientLayer() 
     gradient.frame = CGRectMake(0, 0, 170, 170) 
     gradient.colors = [UIColor(hexString: "#27C68A")().CGColor, UIColor(hexString: "#86EA26")().CGColor] 
     gradient.cornerRadius = gradient.frame.width/2 
     gradient.startPoint = CGPoint(x: 0,y: 1) 
     gradient.endPoint = CGPoint(x: 1, y: 0) 
     self.layer.insertSublayer(gradient, atIndex: 0) 

Answer 1

Wenn Sie eine echte Simulation der Farbverlauf möchten, können Sie this SO answer .Es Check basiert auf einem Kreuz, das in 4 Portionen Ihre rechteckigen Ansicht geteilt, Verschieben Sie dann die Farben für jeden Abschnitt, um einen regelmäßigen Farbverlauf für die Ebenenmaske zu erhalten.