CABasicAnimationのtoValue / fromValueを更新して、変更したときにスムーズになるようにするにはどうすればよいですか?

モハマドエリアスアルフサイン

CAShapeLayerに2つのアニメーションを適用しました(名前を付けましょうpulseLayer)。次のコードを使用します。

let scaledAnimation = CABasicAnimation(keyPath: "transform.scale.xy")
scaledAnimation.duration       = 0.75
scaledAnimation.repeatCount    = Float.infinity
scaledAnimation.autoreverses   = true
scaledAnimation.fromValue      = 4
scaledAnimation.toValue        = 4
scaledAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseIn)

let heartBeatAnimation = CABasicAnimation(keyPath: "transform.scale.xy")
heartBeatAnimation.duration       = 0.75
heartBeatAnimation.repeatCount    = Float.infinity
heartBeatAnimation.autoreverses   = true
heartBeatAnimation.fromValue      = 1.0
heartBeatAnimation.toValue        = 1.2
heartBeatAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseIn)

pulseLayer.add(heartBeatAnimation, forKey: "heartBeatAnimation")

heartBeatAnimationオンのある時点で、ハートビートアニメーションを削除し、次のコードでスケーリングされたアニメーションを追加する必要があります。

pulseLayer.add(self.scaledAnimation, forKey: "scaledAnimation")
pulseLayer.opacity = 0.55
pulseLayer.removeAnimation(forKey: "heartBeatAnimation")

しかし、この2つのアニメーションの間では、 UIView.animate()

だから私は1つのアニメーションだけにとどまり、このコードと同じ値にheartBeatAnimation変更しようとしましたtoValue fromValuescaledAnimation

heartBeatAnimation.toValue = 4
heartBeatAnimation.fromValue = 4

アニメーションが終了した後、アニメーションが拍動している間は何も起こらず、ユーザーがアニメーションを開始するためにジェスチャーを実行すると、スケーリングされた安定したアニメーションが得られました...!

したがって、これらの値を更新してスケーリングされたアニメーションをよりスムーズにする方法についてのアイデアはありますか?

クルナル

これを試して見てください。両方の間の完全なアニメーションと切り替えがあるに依存duration, count, fromValue and toValueしてCABasicAnimationの特性UIView.animate閉鎖

@IBOutlet var vwAnimation: UIView!
    let initialScale: CGFloat = 1.0
    let animatingScale: CGFloat = 2.0
    let finalScale: CGFloat = 3.0

    override func viewDidLoad() {
        super.viewDidLoad()
        addAnimation()
    }


    func addAnimation(){

        heartBeatAnimation()
        self.perform(#selector(self.switchAnimation), with: nil, afterDelay: 3.0)
    }

    @objc func switchAnimation(){

        UIView.animate(withDuration: 0.25, animations: {
            self.vwAnimation.layer.removeAnimation(forKey: "heartBeatAnimation")
            self.scaledAnimation()
            self.vwAnimation.layoutIfNeeded()
        }) { (isCompleted) in

        }
    }


    func scaledAnimation() -> Void {

        let scaledAnimation = CABasicAnimation(keyPath: "transform.scale.xy")
        scaledAnimation.duration       = 0.5
        scaledAnimation.repeatCount    = 0.5
        scaledAnimation.autoreverses   = true
        scaledAnimation.fromValue      = initialScale
        scaledAnimation.toValue        = finalScale
        scaledAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseIn)
        vwAnimation.layer.add(scaledAnimation, forKey: "scaledAnimation")

        self.perform(#selector(self.adjustScale), with: nil, afterDelay: 0.5)
    }

    @objc func adjustScale(){
        self.vwAnimation.layer.removeAnimation(forKey: "scaledAnimation")
        let scaleTransform = CGAffineTransform(scaleX: finalScale, y: finalScale)
        vwAnimation.transform = scaleTransform
    }


    func heartBeatAnimation() -> Void {

        let heartBeatAnimation = CABasicAnimation(keyPath: "transform.scale.xy")
        heartBeatAnimation.duration       = 0.5
        heartBeatAnimation.repeatCount    = Float.infinity
        heartBeatAnimation.autoreverses   = true
        heartBeatAnimation.fromValue      = initialScale
        heartBeatAnimation.toValue        = animatingScale
        heartBeatAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseIn)
        vwAnimation.layer.add(heartBeatAnimation, forKey: "heartBeatAnimation")

    }

上記のコードの結果を次に示します。この結果に変更が必要な場合はお知らせください。

ここに画像の説明を入力してください

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

Related 関連記事

ホットタグ

アーカイブ