IFTTT/JazzHands

Rotate and scale together?

Closed this issue · 3 comments

It appears that I can't rotate and scale a view together.

Here's my code:

'''
-(void)configAnimations
{

IFTTTFrameAnimation *moneyanimation=[IFTTTFrameAnimation animationWithView:image];
[self.animator addAnimation:moneyanimation];
[moneyanimation addKeyFrames:@[
                               [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(1) andFrame:image.frame],
                               [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(1.5) andFrame:CGRectOffset(image.frame, self.view.frame.size.width/2, 0)],
                               [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(2) andFrame:CGRectOffset(image.frame, self.view.frame.size.width, 0)],
                               [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(2.5) andFrame:CGRectOffset(image.frame, 1.5*self.view.frame.size.width, 0)],
                               [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(3) andFrame:image2.frame]
                               ]];
IFTTTScaleAnimation *moneyScale=[IFTTTScaleAnimation animationWithView:image];
[moneyScale addKeyFrames:@[
                           [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(1) andScale:1],
                           [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(1.5) andScale:0.75],
                           [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(2) andScale:0.5],
                           [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(2.5) andScale:0.75],
                           [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(3) andScale:1],
                           ]];
[self.animator addAnimation:moneyScale];
IFTTTAngleAnimation *moneyRotate=[IFTTTAngleAnimation animationWithView:image];
[moneyRotate addKeyFrames:@[
                            [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(1) andAngle:0],
                            [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(1.5) andAngle:M_PI/4],
                            [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(2) andAngle:M_PI_2],
                            [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(2.5) andAngle:M_PI_4*3],
                            [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(3) andAngle:M_PI],
                            ]];
[self.animator addAnimation:moneyRotate];

}

'''

It only rotates the view named '''image'''

PS: I did try an alternative method that involved changing the frame to one with a scaled height and width, and that does work. Though I was hoping for a more elegant solution.

qfish commented

Try IFTTTTransform3DAnimation.

@codeOfRobin I just released JazzHands 2.0, which allows IFTTTScaleAnimation, IFTTTRotationAnimation (which replaces IFTTTAngleAnimation and uses degrees instead of radians), and IFTTTTranslationAnimation to operate on the same view without conflicting.

I also added a unit test that makes sure for the future that all of our animations can work on the same view at the same time.