Problème avec l'animation de mise à l'échelle de CAShapeLayer [duplicate]

Nov 23 2020

J'ai créé un chemin simple pour l'info-bulle d'un curseur. Je voulais qu'il s'anime tel qu'il apparaît pour qu'un utilisateur sache qu'il peut le faire glisser.

Mais ça n'anime pas:

let upperToolTipPath: CAShapeLayer = CAShapeLayer()
            var path = UIBezierPath(roundedRect: CGRect(x: 0,y: 0, width: 65, height: 30), cornerRadius: 3)
            path.stroke()
            path.move(to: CGPoint(x: 50, y: 10))
            path.addLine(to: CGPoint(x: 40, y: 30))
            path.addLine(to: CGPoint(x: 15, y: 10))
            upperToolTipPath.path = path.cgPath
            self.layer.insertSublayer(upperToolTipPath, at: 0)
UIView.animate( 
                withDuration: 5,
                delay: 3,
                options: [.repeat, .autoreverse, .curveEaseIn],
                animations: {
                    self.upperToolTipPath.transform = CATransform3DMakeScale(2, 2, 1)
                    })

Pourriez-vous m'aider avec l'animation?

Réponses

3 matt Nov 23 2020 at 22:39

UIView.animateest pour l' animation de vue . Mais upperToolTipPathest une couche ; ce n'est pas le calque principal d'une vue, il ne peut donc être animé qu'avec une animation de calque . Cela signifie Core Animation, c'est-à-dire CABasicAnimation.

Donc, pour créer l'animation que vous souhaitez créer, vous devrez utiliser Core Animation.

Vous pouvez également créer une vue qui héberge la couche de forme en tant que couche principale. Ensuite, vous pourrez utiliser l'animation de vue.

Mais je pense qu'il vaut mieux dans ce cas utiliser Core Animation. Voici un exemple du genre de chose que je pense que vous essayez de faire:

let upperToolTipPath = CAShapeLayer()
upperToolTipPath.frame = CGRect(x: 0,y: 0, width: 65, height: 30)
let path = UIBezierPath(roundedRect: CGRect(x: 0,y: 0, width: 65, height: 30), 
    cornerRadius: 3)
upperToolTipPath.fillColor = UIColor.clear.cgColor
upperToolTipPath.strokeColor = UIColor.black.cgColor
upperToolTipPath.path = path.cgPath
self.layer.insertSublayer(upperToolTipPath, at: 0)
let b = CABasicAnimation(keyPath: #keyPath(CALayer.transform))
b.duration = 5
b.beginTime = CACurrentMediaTime() + 3
b.toValue = CATransform3DMakeScale(2, 2, 1)
b.repeatCount = .greatestFiniteMagnitude
b.autoreverses = true
upperToolTipPath.add(b, forKey:nil)