Swift Изменить цвет круглой границы с анимацией - PullRequest
Новая
       9

Swift Изменить цвет круглой границы с анимацией

0 голосов
/ 21 мая 2018

Я создал круглую кнопку, используя swift, я пытаюсь изменить цвет рамки с помощью анимации

Я использовал следующий код: 

let color = CABasicAnimation(keyPath: "borderColor")
color.fromValue = UIColor.black.cgColor
color.toValue = UIColor.red.cgColor
color.duration = 1
color.repeatCount = 1
sender.layer.add(color, forKey: "color and width")

Цвет рамки меняетсяно это не дает эффекта желания, это меняет цвет границы все сразу.В качестве эффекта я хотел бы, чтобы вы рисовали поверх старого цвета, чтобы он был простым ==> как индикатор выполнения, где вы видите, как старый цвет исчезает, и его заменяет новый цвет.

Есть ли способ сделать это?

Спасибо за помощь.

Обновление кода 

var storkeLayer = CAShapeLayer()

@IBOutlet weak var Mybut: UIButton!
override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.

    storkeLayer.fillColor = UIColor.clear.cgColor
    storkeLayer.strokeColor = UIColor.black.cgColor
    storkeLayer.lineWidth = 2

    // Create a rounded rect path using button's bounds.

    storkeLayer.path = CGPath.init(roundedRect: Mybut.bounds, cornerWidth: Mybut.frame.width / 2 , cornerHeight: Mybut.frame.height / 2, transform: nil)


    // Add layer to the button
    Mybut.layer.addSublayer(storkeLayer)
}


 @IBAction func bytton(_ sender: UIButton) {

    storkeLayer.fillColor = UIColor.clear.cgColor
    storkeLayer.strokeColor = UIColor.red.cgColor
    storkeLayer.lineWidth = 2

    // Create a rounded rect path using button's bounds.

    storkeLayer.path = CGPath.init(roundedRect: Mybut.bounds, cornerWidth: Mybut.frame.width / 2 , cornerHeight: Mybut.frame.height / 2, transform: nil)


    // Add layer to the button
    sender.layer.addSublayer(storkeLayer)

    // Create animation layer and add it to the stroke layer.
    let animation = CABasicAnimation(keyPath: "strokeEnd")
    animation.fromValue = CGFloat(0.0)
    animation.toValue = CGFloat(1.0)
    animation.duration = 1
   animation.fillMode = kCAFillModeForwards

   // animation.fillMode = kCAFillModeBackwards
    animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
    storkeLayer.add(animation, forKey: "circleAnimation")



}

1 Ответ

0 голосов
/ 21 мая 2018

Вы можете обводить путь кнопки, используя следующий фрагмент кода. 

@IBAction func buttonTapped(_ sender: UIButton) {
    let storkeLayer = CAShapeLayer()
    storkeLayer.fillColor = UIColor.clear.cgColor
    storkeLayer.strokeColor = UIColor.red.cgColor
    storkeLayer.lineWidth = 2

    // Create a rounded rect path using button's bounds.
    storkeLayer.path = CGPath.init(roundedRect: sender.bounds, cornerWidth: 5, cornerHeight: 5, transform: nil) // same path like the empty one ...
    // Add layer to the button
    sender.layer.addSublayer(storkeLayer)

    // Create animation layer and add it to the stroke layer.
    let animation = CABasicAnimation(keyPath: "strokeEnd")
    animation.fromValue = CGFloat(0.0)
    animation.toValue = CGFloat(1.0)
    animation.duration = 1
    animation.fillMode = kCAFillModeForwards
    animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
    storkeLayer.add(animation, forKey: "circleAnimation")
}

Этот фрагмент создает что-то вроде этого:

enter image description here

...