Tweening function

JazzHandsDemo/JazzHandsDemo/IFTTTJazzHandsViewController.m

@@ -129,8 +129,17 @@ - (void)configureAnimation
     [self.animator addAnimation:wordmarkFrameAnimation];
 
     [wordmarkFrameAnimation addKeyFrames:@[
-        [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(1) andFrame:CGRectOffset(self.wordmark.frame, 200, 0)],
-        [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(2) andFrame:self.wordmark.frame],
+        ({
+            IFTTTAnimationKeyFrame *keyFrame = [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(1) andFrame:CGRectOffset(self.wordmark.frame, 200, 0)];
+            keyFrame.tweeningFunction = IFTTTTweeningFunctionFrameOriginQuadCurve(CGRectOffset(self.wordmark.frame, 0, 400).origin);
+            keyFrame;
+        }),
+        ({
+            IFTTTAnimationKeyFrame *keyFrame = [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(2) andFrame:self.wordmark.frame];
+            keyFrame.tweeningFunction = IFTTTTweeningFunctionFrameOriginCurve(CGRectOffset(self.wordmark.frame, -self.view.frame.size.width / 2,     dy / 3).origin,
+                                                                              CGRectOffset(self.wordmark.frame,  self.view.frame.size.width * 2, 2 * dy / 3).origin);
+            keyFrame;
+        }),
         [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(3) andFrame:CGRectOffset(self.wordmark.frame, self.view.frame.size.width, dy)],
         [IFTTTAnimationKeyFrame keyFrameWithTime:timeForPage(4) andFrame:CGRectOffset(self.wordmark.frame, 0, dy)],
     ]];

src/IFTTTAnimation.h

@@ -26,6 +26,9 @@
 - (void)addKeyFrame:(IFTTTAnimationKeyFrame *)keyFrame;
 
 - (IFTTTAnimationFrame *)animationFrameForTime:(NSInteger)time;
+- (IFTTTAnimationFrame *)frameForTime:(NSInteger)time
+                        startKeyFrame:(IFTTTAnimationKeyFrame *)startKeyFrame
+                          endKeyFrame:(IFTTTAnimationKeyFrame *)endKeyFrame;
 - (CGFloat)tweenValueForStartTime:(NSInteger)startTime
                           endTime:(NSInteger)endTime
                        startValue:(CGFloat)startValue

src/IFTTTAnimation.m

@@ -74,11 +74,10 @@ - (void)addKeyFrame:(IFTTTAnimationKeyFrame *)keyFrame
     for (NSUInteger i = 0; i < self.keyFrames.count - 1; i++) {
         IFTTTAnimationKeyFrame *currentKeyFrame = self.keyFrames[i];
         IFTTTAnimationKeyFrame *nextKeyFrame = self.keyFrames[i+1];
+        IFTTTTweeningFunction tweeningFunction = currentKeyFrame.tweeningFunction;
 
         for (NSInteger j = currentKeyFrame.time + (i == 0 ? 0 : 1); j <= nextKeyFrame.time; j++) {
-            [self.timeline addObject:[self frameForTime:j
-                                          startKeyFrame:currentKeyFrame
-                                            endKeyFrame:nextKeyFrame]];
+            [self.timeline addObject:tweeningFunction(self, j, currentKeyFrame, nextKeyFrame)];
         }
     }
 

src/IFTTTAnimationKeyFrame.h

@@ -7,6 +7,7 @@
 //
 
 #import "IFTTTAnimationFrame.h"
+#import "IFTTTTweeningFunction.h"
 
 @interface IFTTTAnimationKeyFrame : IFTTTAnimationFrame
 
@@ -48,4 +49,6 @@
 
 @property (assign, nonatomic) NSInteger time;
 
+@property (copy, nonatomic) IFTTTTweeningFunction tweeningFunction;
+
 @end

src/IFTTTAnimationKeyFrame.m

@@ -284,6 +284,8 @@ - (id)initWithTime:(NSInteger)time
 
     if (self) {
         self.time = time;
+
+        self.tweeningFunction = IFTTTTweeningFunctionDefault;
     }
 
     return self;

src/IFTTTTweeningFunction.h

@@ -0,0 +1,18 @@
+//
+//  IFTTTTweeningFunction.h
+//  JazzHands
+//
+//  Created by Felix Jendrusch on 1/9/15.
+//
+//
+
+#import "IFTTTAnimation.h"
+
+@class IFTTTAnimationKeyFrame;
+
+typedef IFTTTAnimationFrame * (^IFTTTTweeningFunction)(IFTTTAnimation *animation, NSInteger time, IFTTTAnimationKeyFrame *startKeyFrame, IFTTTAnimationKeyFrame *endKeyFrame);
+
+extern IFTTTTweeningFunction const IFTTTTweeningFunctionDefault;
+
+extern IFTTTTweeningFunction IFTTTTweeningFunctionFrameOriginQuadCurve(CGPoint cp);
+extern IFTTTTweeningFunction IFTTTTweeningFunctionFrameOriginCurve(CGPoint cp1, CGPoint cp2);

src/IFTTTTweeningFunction.m

@@ -0,0 +1,101 @@
+//
+//  IFTTTTweeningFunction.m
+//  JazzHands
+//
+//  Created by Felix Jendrusch on 1/9/15.
+//
+//
+
+#import "IFTTTFrameAnimation.h"
+#import "IFTTTAnimationKeyFrame.h"
+#import "IFTTTTweeningFunction.h"
+
+#if CGFLOAT_IS_DOUBLE
+#define POW(X, Y) pow(X, Y)
+#else
+#define POW(X, Y) powf(X, Y)
+#endif
+
+IFTTTTweeningFunction const IFTTTTweeningFunctionDefault = ^(IFTTTAnimation *animation, NSInteger time, IFTTTAnimationKeyFrame *startKeyFrame, IFTTTAnimationKeyFrame *endKeyFrame) {
+    return [animation frameForTime:time startKeyFrame:startKeyFrame endKeyFrame:endKeyFrame];
+};
+
+extern IFTTTTweeningFunction IFTTTTweeningFunctionFrameOriginQuadCurve(CGPoint cp) {
+    return ^(IFTTTAnimation *animation, NSInteger time, IFTTTAnimationKeyFrame *startKeyFrame, IFTTTAnimationKeyFrame *endKeyFrame) {
+        NSCParameterAssert([animation isKindOfClass:[IFTTTFrameAnimation class]]);
+
+        NSInteger startTime = startKeyFrame.time;
+        NSInteger endTime = endKeyFrame.time;
+        NSInteger duration = endTime - startTime;
+
+        CGFloat t = ((CGFloat)time - (CGFloat)startTime) / (CGFloat)duration;
+
+        CGRect startFrame = startKeyFrame.frame;
+        CGRect endFrame = endKeyFrame.frame;
+
+        CGRect frame = animation.view.frame;
+        // B(t) = (1 - t) ^ 2 * s + 2 * (1 - t) * t * cp + t ^ 2 * e
+        frame.origin.x =     POW(1 - t, 2)             * CGRectGetMinX(startFrame)
+                       + 2 *    (1 - t)    *     t     * cp.x
+                       +                     POW(t, 2) * CGRectGetMinX(endFrame);
+        frame.origin.y =     POW(1 - t, 2)             * CGRectGetMinY(startFrame)
+                       + 2 *    (1 - t)    *     t     * cp.y
+                       +                     POW(t, 2) * CGRectGetMinY(endFrame);
+        frame.size.width = [animation tweenValueForStartTime:startTime
+                                                     endTime:endTime
+                                                  startValue:CGRectGetWidth(startFrame)
+                                                    endValue:CGRectGetWidth(endFrame)
+                                                      atTime:time] ? : 0;
+        frame.size.height = [animation tweenValueForStartTime:startTime
+                                                      endTime:endTime
+                                                   startValue:CGRectGetHeight(startFrame)
+                                                     endValue:CGRectGetHeight(endFrame)
+                                                       atTime:time] ? : 0;
+
+        IFTTTAnimationFrame *animationFrame = [IFTTTAnimationFrame new];
+        animationFrame.frame = frame;
+
+        return animationFrame;
+    };
+}
+
+extern IFTTTTweeningFunction IFTTTTweeningFunctionFrameOriginCurve(CGPoint cp1, CGPoint cp2) {
+    return ^(IFTTTAnimation *animation, NSInteger time, IFTTTAnimationKeyFrame *startKeyFrame, IFTTTAnimationKeyFrame *endKeyFrame) {
+        NSCParameterAssert([animation isKindOfClass:[IFTTTFrameAnimation class]]);
+
+        NSInteger startTime = startKeyFrame.time;
+        NSInteger endTime = endKeyFrame.time;
+        NSInteger duration = endTime - startTime;
+
+        CGFloat t = ((CGFloat)time - (CGFloat)startTime) / (CGFloat)duration;
+
+        CGRect startFrame = startKeyFrame.frame;
+        CGRect endFrame = endKeyFrame.frame;
+
+        CGRect frame = animation.view.frame;
+        // B(t) = (1 - t) ^ 3 * s + 3 * (1 - t) ^ 2 * t * cp1 + 3 * (1 - t) * t ^ 2 * cp2 + t ^ 3 * e
+        frame.origin.x =     POW(1 - t, 3)             * CGRectGetMinX(startFrame)
+                       + 3 * POW(1 - t, 2) *     t     * cp1.x
+                       + 3 *    (1 - t)    * POW(t, 2) * cp2.x
+                       +                     POW(t, 3) * CGRectGetMinX(endFrame);
+        frame.origin.y =     POW(1 - t, 3)             * CGRectGetMinY(startFrame)
+                       + 3 * POW(1 - t, 2) *     t     * cp1.y
+                       + 3 *    (1 - t)    * POW(t, 2) * cp2.y
+                       +                     POW(t, 3) * CGRectGetMinY(endFrame);
+        frame.size.width = [animation tweenValueForStartTime:startTime
+                                                     endTime:endTime
+                                                  startValue:CGRectGetWidth(startFrame)
+                                                    endValue:CGRectGetWidth(endFrame)
+                                                      atTime:time] ? : 0;
+        frame.size.height = [animation tweenValueForStartTime:startTime
+                                                      endTime:endTime
+                                                   startValue:CGRectGetHeight(startFrame)
+                                                     endValue:CGRectGetHeight(endFrame)
+                                                       atTime:time] ? : 0;
+
+        IFTTTAnimationFrame *animationFrame = [IFTTTAnimationFrame new];
+        animationFrame.frame = frame;
+
+        return animationFrame;
+    };
+}