web-dev-qa-db-fra.com

Animer le changement d'état de UIButton

J'utilise un UIButton avec des images pour les états normaux et en surbrillance. Ils fonctionnent comme prévu mais je veux avoir une transition de fondu/fusion et pas seulement un échange soudain.

Comment puis je faire ça?

iphoneobjective-cuibutton
46
Johnny Everson

Cela peut être fait en utilisant l'animation de transition d'un UIView. Peu importe, la propriété isHighlighted n'est pas animable, car elle transite la vue entière.

Swift 3

UIView.transition(with: button,
                  duration: 4.0,
                  options: .transitionCrossDissolve,
                  animations: { button.isHighlighted = true },
                  completion: nil)

Objectif c

[UIView transitionWithView:button
                  duration:4.0
                   options:UIViewAnimationOptionTransitionCrossDissolve
                animations:^{ button.highlighted = YES; }
                completion:nil];
115
Marián Černý

Pour ce faire, j'ai étendu UIButton. a ajouté une nouvelle propriété appelée hilightedImage avec le code suivant:

- (void)setHilightImage:(UIImageView *)_hilightImage
{
    if (hilightImage != _hilightImage) {
        [hilightImage release];
        hilightImage = [_hilightImage retain];
    }
    [hilightImage setAlpha:0];
    [self addSubview:hilightImage];
}

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:0.14];
    if(hilightImage){
        [hilightImage setAlpha:1];
    }
    [UIView commitAnimations];
    [super touchesBegan:touches withEvent:event];
}

- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {

    self.highlighted = FALSE;
    [UIView beginAnimations:nil context:NULL];
    [UIView setAnimationDuration:0.14];
    if(hilightImage){
        [hilightImage setAlpha:0];
    }

    [UIView commitAnimations];
    [super touchesEnded:touches withEvent:event];
}
3
Johnny Everson

@ marián-Černý réponse Swift:

UIView.transitionWithView(button, 
                          duration: 4.0, 
                          options: .TransitionCrossDissolve, 
                          animations: { button.highlighted = true },
                          completion: nil)
2
Federico Zanetello

Voici une solution autonome qui prend également en charge un indicateur booléen animated.

- (void)setEnabled:(BOOL)enabled animated:(BOOL)animated
{
  if (_button.enabled == enabled) {
    return;
  }

  void (^transitionBlock)(void) = ^void(void) {
    _button.enabled = enabled;
  };

  if (animated) {
    [UIView transitionWithView:_button
                      duration:0.15
                       options:UIViewAnimationOptionTransitionCrossDissolve
                    animations:^{
                      transitionBlock();
                    }
                    completion:nil];
  } else {
    transitionBlock();
  }
}
2
Zorayr

UIButton hérite de UIView

Alors vous obtenez sa vue et appelez beginAnimations:context:

Ensuite, toutes les méthodes setAnimation appropriées à partir de là.

Les propriétés suivantes de la classe UIView sont animables:

  • cadre @property
  • @property bounds
  • @property center
  • @property transform
  • @property alpha
  • @property backgroundColor
  • @property contentStretch

Réf: Référence de classe UIView

1
Arvin