Comment faire une animation native «effet d'impulsion» sur un UIButton

89

Je voudrais avoir une sorte d'animation d'impulsion (boucle infinie "scale in - scale out") sur un UIButton afin qu'il attire immédiatement l'attention des utilisateurs.

J'ai vu ce lien Comment créer un effet d'impulsion en utilisant -webkit-animation - sonne vers l'extérieur mais je me demandais s'il y avait un moyen de le faire uniquement en utilisant le framework natif?

— Johann
source

198

CABasicAnimation *theAnimation;

theAnimation=[CABasicAnimation animationWithKeyPath:@"opacity"];
theAnimation.duration=1.0;
theAnimation.repeatCount=HUGE_VALF;
theAnimation.autoreverses=YES;
theAnimation.fromValue=[NSNumber numberWithFloat:1.0];
theAnimation.toValue=[NSNumber numberWithFloat:0.0];
[theLayer addAnimation:theAnimation forKey:@"animateOpacity"]; //myButton.layer instead of

Rapide

let pulseAnimation = CABasicAnimation(keyPath: #keyPath(CALayer.opacity))
pulseAnimation.duration = 1
pulseAnimation.fromValue = 0
pulseAnimation.toValue = 1
pulseAnimation.timingFunction = CAMediaTimingFunction(name: CAMediaTimingFunctionName.easeInEaseOut)
pulseAnimation.autoreverses = true
pulseAnimation.repeatCount = .greatestFiniteMagnitude
view.layer.add(pulseAnimation, forKey: "animateOpacity")

Voir l'article "Animation du contenu du calque"

— béryllium
source

1

Merci pour votre réponse! Je dois dire que je suis un peu coincé. Je ne connais pas du tout CALayer et je ne sais pas comment le lier à mon UIButton. De plus, votre code semble changer d'opacité, pas d'échelle.

— Johann

8

d'accord). «Animation par impulsions» est un terme généralement appliqué à l'effet de scintillement - comme indiqué dans l'exemple de ce lien. Maintenant, je relis votre question et je comprends ce que vous voulez. Au début, chaque vue a son propre calque. Si le framework QartzCore est ajouté au projet, tapez simplement myView.layerpour y accéder. Vous pouvez animer des couches avec Core Animation. Pour la transformation d'échelle, vous pouvez utiliser cette approche: Prise en charge du chemin clé pour les champs de structure

— béryllium

7

Fantastique! Utiliser @ "transform.scale" au lieu de @ "opacity" fonctionne comme un charme. Merci beaucoup!

— Johann

2

Si vous ne l'avez pas déjà, vous devez l'ajouter #import <QuartzCore/QuartzCore.h>afin d'obtenir toutes les définitions des CALayers.

— programme du

POUAH! Ne modifiez pas les réponses datant de 3 ans qui sont obsolètes, sauf si vous mettez à jour la réponse réelle avec la version moderne correcte. L'ajout d'espaces ne le met pas à jour. Surtout pour ne pas le ressusciter après 3 ans.

— Fogmeister

30

Voici le code swift pour cela;)

let pulseAnimation:CABasicAnimation = CABasicAnimation(keyPath: "transform.scale")
pulseAnimation.duration = 1.0
pulseAnimation.toValue = NSNumber(value: 1.0)
pulseAnimation.timingFunction = CAMediaTimingFunction(name: CAMediaTimingFunctionName.easeInEaseOut)
pulseAnimation.autoreverses = true
pulseAnimation.repeatCount = .greatestFiniteMagnitude
self.view.layer.add(pulseAnimation, forKey: nil)

— Ravi Sharma
source

2

Quoi de neuf avec tous les points-virgules? ;)

— Christian

@Christian le point-virgule définit le type de la constante pulseAnimation. Il n'est pas nécessaire de l'utiliser, mais cela a tendance à augmenter la clarté du code lorsque le côté droit d'une affectation ne permet pas de déterminer le type à attribuer.

— Scott Chow

@ScottChow Je suppose que vous parlez du colon. Mon commentaire était une blague à la réponse originale, car il n'y a pas besoin de points-virgules avec Swift. Je suppose que ce n'était pas si évident maintenant que la réponse a été beaucoup modifiée :)

— Christian

9

Il manque un code swift fromValue, j'ai dû l'ajouter pour le faire fonctionner.

pulseAnimation.fromValue = NSNumber(float: 0.0)

Devrait également forKeyêtre défini, sinon removeAnimationne fonctionne pas.

self.view.layer.addAnimation(pulseAnimation, forKey: "layerAnimation")

— Bassebus
source

3

func animationScaleEffect(view:UIView,animationTime:Float)
{
    UIView.animateWithDuration(NSTimeInterval(animationTime), animations: {

        view.transform = CGAffineTransformMakeScale(0.6, 0.6)

        },completion:{completion in
            UIView.animateWithDuration(NSTimeInterval(animationTime), animations: { () -> Void in

                view.transform = CGAffineTransformMakeScale(1, 1)
            })
    })

}


@IBOutlet weak var perform: UIButton!

@IBAction func prefo(sender: AnyObject) {
    self.animationScaleEffect(perform, animationTime: 0.7)
}

— Ahmad ELkhwaga
source

Comment faire une animation native «effet d'impulsion» sur un UIButton - iOS