Effet clignotant sur UILabel
J'ai un UILabel avec une couleur de fond en gris.
Je veux un effet clignotant sur cette étiquette, comme cela devrait devenir un peu blanc puis gris et cela devrait continuer jusqu'à ce que je l'éteigne par programmation.
Une idée comment y parvenir?
Utilisez NSTimer
NSTimer *timer = [NSTimer
scheduledTimerWithTimeInterval:(NSTimeInterval)(1.0)
target:self
selector:@selector(blink)
userInfo:nil
repeats:TRUE];
BOOL blinkStatus = NO;
dans votre fonction de clignotement
-(void)blink{
if(blinkStatus == NO){
yourLabel.backgroundColor = [UIColor whiteColor];
blinkStatus = YES;
}else {
yourLabel.backgroundColor = [UIColor grayColor];
blinkStatus = NO;
}
}
Vous pouvez le faire dans un bloc:
self.yourLabel.alpha = 1;
[UIView animateWithDuration:1.5 delay:0.5 options:UIViewAnimationOptionRepeat | UIViewAnimationOptionAutoreverse animations:^{
self.yourLabel.alpha = 0;
} completion:nil];
Donc, vous n'avez pas besoin d'une seconde méthode.
Swift 3
extension UILabel {
func startBlink() {
UIView.animate(withDuration: 0.8,
delay:0.0,
options:[.allowUserInteraction, .curveEaseInOut, .autoreverse, .repeat],
animations: { self.alpha = 0 },
completion: nil)
}
func stopBlink() {
layer.removeAllAnimations()
alpha = 1
}
}
Vous pouvez simplement créer une extension de la classe UILabel qui prend en charge l’effet clignotant . Je ne pense pas que l'utilisation d'une minuterie soit une bonne approche car vous n'aurez aucun effet de fondu.
Voici le Swift moyen de le faire:
extension UILabel {
func blink() {
self.alpha = 0.0;
UIView.animateWithDuration(0.8, //Time duration you want,
delay: 0.0,
options: [.CurveEaseInOut, .Autoreverse, .Repeat],
animations: { [weak self] in self?.alpha = 1.0 },
completion: { [weak self] _ in self?.alpha = 0.0 })
}
}
Swift 3:
extension UILabel {
func blink() {
self.alpha = 0.0;
UIView.animate(withDuration: 0.8, //Time duration you want,
delay: 0.0,
options: [.curveEaseInOut, .autoreverse, .repeat],
animations: { [weak self] in self?.alpha = 1.0 },
completion: { [weak self] _ in self?.alpha = 0.0 })
}
}
EDIT Swift 3: Fonctionne pour presque toutes les vues
extension UIView {
func blink() {
self.alpha = 0.0;
UIView.animate(withDuration: 0.8, //Time duration you want,
delay: 0.0,
options: [.curveEaseInOut, .autoreverse, .repeat],
animations: { [weak self] in self?.alpha = 1.0 },
completion: { [weak self] _ in self?.alpha = 0.0 })
}
}
Utilisez plutôt les animations de vue. Cela le rend très simple et facile à contrôler. Essaye ça:
self.yourLabel.alpha = 1.0f;
[UIView animateWithDuration:0.12
delay:0.0
options:UIViewAnimationOptionCurveEaseInOut |
UIViewAnimationOptionRepeat |
UIViewAnimationOptionAutoreverse |
UIViewAnimationOptionAllowUserInteraction
animations:^{
self.yourLabel.alpha = 0.0f;
}
completion:^(BOOL finished){
// Do nothing
}];
Vous pouvez modifier les valeurs pour obtenir différents effets, par exemple, en modifiant animateWithDuration pour définir la vitesse de clignotement. En outre, vous pouvez l’utiliser sur tout ce qui hérite d’UIView, par exemple un bouton, une étiquette, une vue personnalisée, etc.
Vous êtes bloqué lorsque vous essayez avec Swift et que vous utilisez plusieurs options, mais cela semble bien fonctionner:
self.cursorLabel.alpha = 1
UIView.animateWithDuration(0.7, delay: 0.0, options: [.Repeat, .Autoreverse, .CurveEaseInOut], animations:
{
self.cursorLabel.alpha = 0
}, completion: nil)
Une approche différente mais qui fonctionne. Clignotant seulement pendant 3 secondes
extension UIView {
func blink() {
let animation = CABasicAnimation(keyPath: "opacity")
animation.isRemovedOnCompletion = false
animation.fromValue = 1
animation.toValue = 0
animation.duration = 0.8
animation.autoreverses = true
animation.repeatCount = 3
animation.beginTime = CACurrentMediaTime() + 0.5
self.layer.add(animation, forKey: nil)
}
}
-(void) startBlinkingLabel:(UILabel *)label
{
label.alpha =1.0f;
[UIView animateWithDuration:0.32
delay:0.0
options: UIViewAnimationOptionAutoreverse |UIViewAnimationOptionRepeat | UIViewAnimationOptionCurveEaseInOut | UIViewAnimationOptionAllowUserInteraction |UIViewAnimationOptionBeginFromCurrentState
animations:^{
label.alpha = 0.0f;
}
completion:^(BOOL finished){
if (finished) {
}
}];
}
-(void) stopBlinkingLabel:(UILabel *)label
{
// REMOVE ANIMATION
[label.layer removeAnimationForKey:@"opacity"];
label.alpha = 1.0f;
}
Modification de Krishnabhadra Réponse pour un meilleur effet de clignotement
Déclarer une variable de classe bool blinkStatus;
Et coller le code donné ci-dessous
NSTimer *yourtimer = [NSTimer scheduledTimerWithTimeInterval:(NSTimeInterval)(10.0 / 60.0) target:self selector:@selector(blink) userInfo:nil repeats:TRUE];
blinkStatus = FALSE;
-(void)blink{
if(blinkStatus == FALSE){
yourLabel.hidden=NO;
blinkStatus = TRUE;
}else {
yourLabel.hidden=YES;
blinkStatus = FALSE;
}
}
Ma version de Swift basée sur Flex Elektro Deimling's answer :
private func startTimeBlinkAnimation(start: Bool) {
if start {
timeContainerView.alpha = 1
UIView.animateWithDuration(0.6, delay: 0.3, options:[.Repeat, .Autoreverse], animations: { _ in
self.timeContainerView.alpha = 0
}, completion: nil)
}
else {
timeContainerView.alpha = 1
timeContainerView.layer.removeAllAnimations()
}
}
Voilà comment cela a fonctionné pour moi. J'ai adapté la réponse de @flex_elektro_deimling
Le premier paramètre UIView.animateWithDuration est la durée totale de l'animation (dans mon cas, je l'ai définie sur 0,5), vous pouvez définir différentes valeurs sur le premier et le second (délai) pour modifier la vitesse de clignotement.
self.YOURLABEL.alpha = 0;
UIView.animateWithDuration(
0.5,
delay: 0.2,
options: UIViewAnimationOptions.Repeat | UIViewAnimationOptions.Autoreverse, animations: {
self.YOURLABEL.alpha = 1
},
completion:nil)
Voici ma solution dans Swift 4.0 avec extension pour tout UIVIew
extension UIView{
func blink() {
self.alpha = 0.2
UIView.animate(withDuration: 1,
delay: 0.0,
options: [.curveLinear,
.repeat,
.autoreverse],
animations: { self.alpha = 1.0 },
completion: nil)
}
}
int count;
NSTimer *timer;
timer= [NSTimer
scheduledTimerWithTimeInterval:(NSTimeInterval)(0.5)
target:self
selector:@selector(animationStart)
userInfo:nil
repeats:TRUE];
-(void)animationStart{
switch (count) {
case 0:
//205 198 115
count++;
lbl.textColor=[UIColor colorWithRed:205.0f/255.0f green:198.0f/255.0f blue:115.0f/255.0f alpha:1];
break;
case 1:
count++;
//205 198 115 56 142 142
lbl.textColor=[UIColor colorWithRed:56.0f/255.0f green:142.0f/255.0f blue:142.0f/255.0f alpha:1];
break;
case 2:
count++;
//205 198 115
lbl.textColor=[UIColor colorWithRed:205.0f/255.0f green:205.0f/255.0f blue:0.0f/255.0f alpha:1];
break;
case 3:
count++;
//205 198 115 84 255 159
lbl.textColor=[UIColor colorWithRed:84.0f/255.0f green:255.0f/255.0f blue:159.0f/255.0f alpha:1];
break;
case 4:
count++;
//205 198 115 255 193 37
lbl.textColor=[UIColor colorWithRed:255.0f/255.0f green:193.0f/255.0f blue:37.0f/255.0f alpha:1];
break;
case 5:
count++;
//205 198 115 205 200 177
lbl.textColor=[UIColor colorWithRed:205.0f/255.0f green:200.0f/255.0f blue:117.0f/255.0f alpha:1];
break;
case 6:
count++;
//205 198 115 255 228 181
lbl.textColor=[UIColor colorWithRed:255.0f/255.0f green:228.0f/255.0f blue:181.0f/255.0f alpha:1];
break;
case 7:
count++;
//205 198 115 233 150 122
lbl.textColor=[UIColor colorWithRed:233.0f/255.0f green:150.0f/255.0f blue:122.0f/255.0f alpha:1];
break;
case 8:
count++;
//205 198 115 233 150 122
lbl.textColor=[UIColor colorWithRed:255.0f/255.0f green:200.0f/255.0f blue:200.0f/255.0f alpha:1];
break;
case 9:
count=0;
//205 198 115 255 99 71 255 48 48
lbl.textColor=[UIColor colorWithRed:255.0f/255.0f green:48.0f/255.0f blue:48.0f/255.0f alpha:1];
break;
default:
break;
}
}