iOS - Flip animation only for specific view iOS - Flip animation only for specific view ios ios

iOS - Flip animation only for specific view


The following code might help with your problem. I think it is cleaner than using a transparent button.

- (void)viewDidLoad {    [super viewDidLoad];    flipped = NO;    UITapGestureRecognizer *tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleTap:)];    [flipContainerView addGestureRecognizer:tapGesture];    [tapGesture release];}- (void)handleTap:(UITapGestureRecognizer *)sender {    if (sender.state == UIGestureRecognizerStateEnded) {        [UIView transitionWithView:flipContainerView                          duration:1                           options:UIViewAnimationOptionTransitionFlipFromLeft                        animations:^{            if (!flipped) {                [frontCard setHidden:YES];                [flipContainerView addSubview:backCard.view]; //or unhide it.                flipped = YES;            } else {                [frontCard setHidden:NO];                [backCard removeFromSuperview]; //or hide it.            }        } completion:nil];    }}


I had the same problem. After searching different posts on the internet I was able to come up with an elegant and easy solution. I have the cards as custom UIButtons. In the custom UIButton class I added the method which changes the background image with a flip animation:

-(void) flipCard{    [UIView transitionWithView:self                      duration:0.3f                       options:UIViewAnimationOptionTransitionFlipFromRight|UIViewAnimationOptionCurveEaseInOut                    animations:^{                        if (self.isFlipped) {                            [self setBackgroundImage:[UIImage imageNamed:@"card_back_2.png"] forState:UIControlStateNormal];                        }else{                            [self setBackgroundImage:[UIImage imageNamed:self.cardName] forState:UIControlStateNormal];                        }                    } completion:NULL];    self.isFlipped = !self.isFlipped;}

Hope this helps someone else as the first answer has been already accepted

UPDATE

If you are on the view containing this sub-view the code is:

-(void)flipCard:(APCard*)card{    [UIView transitionWithView:card                      duration:kFlipTime                       options:UIViewAnimationOptionTransitionFlipFromRight|UIViewAnimationOptionCurveEaseInOut                    animations:^{                        if (card.isFlipped) {                            [card setBackgroundImage:[UIImage imageNamed:@"card_back_2.png"] forState:UIControlStateNormal];                        }else{                            [card setBackgroundImage:[UIImage imageNamed:card.cardName] forState:UIControlStateNormal];                        }                    completion:^(BOOL finished) {                         if (finished) {                             //DO Stuff                         }                     }    ];    card.isFlipped = !card.isFlipped;}


My use case in Swift 4:

@IBAction func flipCard() {                let transitionOptions: UIView.AnimationOptions = [.transitionFlipFromRight, .showHideTransitionViews]        UIView.transition(with: letterView, duration: 1.0, options: transitionOptions, animations: {            if self.showingBack == true {                self.letterImage.image = UIImage.init(named: self.letterImageName + ".png")                self.letterNameLabel.text = self.regularWord                self.showingBack = false            } else {                self.letterImage.image = UIImage.init(named: self.letterImageName + "C.png")                self.letterNameLabel.text = self.cursiveWord                self.showingBack = true            }        })    }