Question

Hi have around 10 UIButtons that I am animating around the screen. When a user taps one, the button is scaled up, then moved and scaled down to a certain point on the screen.

I'm using a single method to manage the animate. I pass the index number of the UIButton to the method, so that the method can perform its animation on that button. The animations work fine, but when I tap a second button before the Scale down and move animation of the previous button tapped has finished. The Scale down animation of the previous button tapped is halted, but its move animation completes.

Here's my code.

-(void)HidingAnimation:(int)BubbleIndex{

//Obtain Bubble to hide using index number passed to method
UIButton *BubbleToHide = [Bubbles objectAtIndex:BubbleIndex - 1];
NSLog(@"BubbletoHide = %@", BubbleToHide);

[self.view bringSubviewToFront:BubbleToHide];

//Remove animations that are happening on the bubble
[BubbleToHide.layer removeAllAnimations];

//Set the position of the bubble to the current presentation layer position
CALayer *currentLayer = [BubbleToHide.layer presentationLayer];
BubbleToHide.layer.position = currentLayer.position;

//Remove the background image of the bubble
UIImage *buttonImage = [UIImage imageNamed:NULL];
[BubbleToHide setBackgroundImage:buttonImage forState:UIControlStateNormal];

//Find the position of the previously hidden bubble
UIButton *PreviousHiddenBubble = [BubblesArray objectAtIndex:BubbleIndex - 2];
CALayer *PreviousBubble = PreviousHiddenBubble.layer.presentationLayer;
PreviousHiddenBubble.layer.transform = PreviousBubble.transform;

//Calculate scaledown and position of bubble depending on game mode
CGFloat XTranslation, YTranslation, ScaleDownX, ScaleDownY;
if ([[[NSUserDefaults standardUserDefaults]valueForKey:@"Mode"]isEqualToString:@"game"]) {
    XTranslation = 44 + ((PreviousHiddenBubble.bounds.size.width/2) * (BubbleIndex -1))-10; //PreviousHiddenBubble.center.x + PreviousHiddenBubble.bounds.size.width*.35;
    YTranslation = 702;
    ScaleDownX = 0.5;
    ScaleDownY = 0.5;
}


[UIView animateWithDuration:0.2
                      delay:0
                    options:UIViewAnimationCurveLinear|UIViewAnimationOptionBeginFromCurrentState|UIViewAnimationOptionAllowAnimatedContent
                 animations:^{
                     BubbleToHide.layer.transform = CATransform3DMakeScale(4, 4, 1);
                 }
                 completion:^(BOOL finished) {
                     NSLog(@"Scale Up Animation Complete");
                     [UIView animateWithDuration:1.2
                                           delay:0
                                         options:UIViewAnimationCurveLinear|UIViewAnimationOptionOverrideInheritedDuration
                                      animations:^{
                                          BubbleToHide.transform = CGAffineTransformMakeScale(ScaleDownX, ScaleDownY);//CATransform3DMakeScale
                                          BubbleToHide.center = CGPointMake(XTranslation, YTranslation);
                                      }
                                      completion:^(BOOL finished){
                                          NSLog(@"Scale down and Transform Complete");
                                      }];
                     }];

}

I put the ScaleDown and move animation in the completion of the scale up animation.

The BubbleToHide variable should be holding separate references to each UIButton that is retrieved from the Bubbles array using the index passed.

I can confirm that with the NSLog near the top of the code, but whenever a second UIButton is tapped and the scaleDown hasn't completed on the previous tapped button. The previous buttons scaleDown is canceled. However the move animation completes, so instead of getting a nice row of buttons. I have a button that is at the correct position, frozen in size between the scaleUp factor and the scaleDown factor. Depending on how quick the next button was tapped.

Any ideas why this happens? or fixes?

Thanks.

Was it helpful?

Solution

I solved it.

In the end it was nothing to do with the block animation. it was the code

CALayer *PreviousBubble = PreviousHiddenBubble.layer.presentationLayer;
PreviousHiddenBubble.layer.transform = PreviousBubble.transform;

This was taking the current position of the previous animations presentation layer, then setting its transform, to the current transform of the presentation layer. Because the scale animation was still in progress. It froze the scale animation at that point.

I was using it to try and figure out a way to evenly layout the buttons depending on their width. I'll have to search for another way of doing that.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top