Added animated controls and switches

Example/Podfile.lock

@@ -9,7 +9,7 @@ EXTERNAL SOURCES:
  :path: "../"
 
 SPEC CHECKSUMS:
- lottie-ios: 601c75ad9b5f27857f6221c5e7f4a12d23f5e779
+ lottie-ios: fdc7c231af7840661e673c31531ed4bae497d400
 
 PODFILE CHECKSUM: fdbd59f361db8744871f0e9a0b3f94e0b7b8ca6b
 

Example/Tests/Switch.json

@@ -0,0 +1 @@
+{"assets":[],"layers":[{"ddd":0,"ind":0,"ty":4,"nm":"Checkmark Outlines 2","parent":3,"ks":{"o":{"k":100},"r":{"k":0},"p":{"k":[14.403,24.469,0]},"a":{"k":[17,13,0]},"s":{"k":[100,100,100]}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ks":{"k":{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[12,-8],[-4.001,8],[-12,0]],"c":false}},"nm":"Path 1","mn":"ADBE Vector Shape - Group"},{"ty":"tm","s":{"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.167],"y":[0]},"n":["0_1_0p167_0"],"t":94,"s":[100],"e":[0]},{"t":121}],"ix":1},"e":{"k":[{"i":{"x":[0],"y":[0]},"o":{"x":[0.167],"y":[0.167]},"n":["0_0_0p167_0p167"],"t":94,"s":[100],"e":[100]},{"t":121}],"ix":2},"o":{"k":0,"ix":3},"m":1,"ix":2,"nm":"Trim Paths 1","mn":"ADBE Vector Filter - Trim"},{"ty":"st","fillEnabled":true,"c":{"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":94,"s":[0.76,0.76,0.76,1],"e":[0,0.65,0.6,1]},{"t":121}]},"o":{"k":100},"w":{"k":3},"lc":2,"lj":2,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke"},{"ty":"tr","p":{"k":[17,13],"ix":2},"a":{"k":[0,0],"ix":1},"s":{"k":[100,100],"ix":3},"r":{"k":0,"ix":6},"o":{"k":100,"ix":7},"sk":{"k":0,"ix":4},"sa":{"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":3,"mn":"ADBE Vector Group"}],"ip":94,"op":151,"st":1,"bm":0,"sr":1},{"ddd":0,"ind":1,"ty":4,"nm":"X Outlines","parent":3,"ks":{"o":{"k":100},"r":{"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.52],"y":[0]},"n":["0_1_0p52_0"],"t":15,"s":[0],"e":[-90]},{"t":56}]},"p":{"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.5,"y":0},"n":"0p833_0p833_0p5_0","t":88,"s":[15.346,24.665,0],"e":[2.449,24.665,0],"to":[0,0,0],"ti":[0,0,0]},{"t":94}]},"a":{"k":[11.313,11.759,0]},"s":{"k":[100,100,100]}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ks":{"k":{"i":[[0,0],[0,0]],"o":[[0,0],[0,0]],"v":[[7.391,7.84],[-7.493,-7.049]],"c":false}},"nm":"Path 1","mn":"ADBE Vector Shape - Group"},{"ty":"st","fillEnabled":true,"c":{"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":22,"s":[0,0.65,0.6,1],"e":[0.76,0.76,0.76,1]},{"t":36}]},"o":{"k":100},"w":{"k":3},"lc":2,"lj":1,"ml":10,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke"},{"ty":"tr","p":{"k":[11.364,11.364],"ix":2},"a":{"k":[0,0],"ix":1},"s":{"k":[100,100],"ix":3},"r":{"k":0,"ix":6},"o":{"k":100,"ix":7},"sk":{"k":0,"ix":4},"sa":{"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":2,"mn":"ADBE Vector Group"},{"ty":"tm","s":{"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.167],"y":[0.167]},"n":["0_1_0p167_0p167"],"t":25,"s":[50],"e":[0]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":46,"s":[0],"e":[0]},{"i":{"x":[0.801],"y":[0.738]},"o":{"x":[0.5],"y":[0]},"n":["0p801_0p738_0p5_0"],"t":86,"s":[0],"e":[43.795]},{"i":{"x":[0.708],"y":[0.786]},"o":{"x":[0.376],"y":[0.437]},"n":["0p708_0p786_0p376_0p437"],"t":94,"s":[43.795],"e":[50]},{"t":95}],"ix":1},"e":{"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.167],"y":[0.167]},"n":["0_1_0p167_0p167"],"t":25,"s":[50],"e":[100]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":46,"s":[100],"e":[100]},{"i":{"x":[0.801],"y":[0.743]},"o":{"x":[0.5],"y":[0]},"n":["0p801_0p743_0p5_0"],"t":86,"s":[100],"e":[55.405]},{"i":{"x":[0.708],"y":[0.755]},"o":{"x":[0.376],"y":[0.501]},"n":["0p708_0p755_0p376_0p501"],"t":94,"s":[55.405],"e":[50]},{"t":95}],"ix":2},"o":{"k":0,"ix":3},"m":1,"ix":2,"nm":"Trim Paths 1","mn":"ADBE Vector Filter - Trim"}],"ip":0,"op":95,"st":0,"bm":0,"sr":1},{"ddd":0,"ind":2,"ty":4,"nm":"Checkmark Outlines","parent":1,"ks":{"o":{"k":100},"r":{"k":0},"p":{"k":[10.359,11.571,0]},"a":{"k":[17,13,0]},"s":{"k":[100,100,100]}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ks":{"k":[{"i":{"x":0,"y":1},"o":{"x":0.52,"y":0},"n":"0_1_0p52_0","t":19,"s":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[12,-8],[-4.001,8],[-12,0]],"c":false}],"e":[{"i":[[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0]],"v":[[9.332,-8],[-6.669,8],[-14.668,0]],"c":false}]},{"t":35}]},"nm":"Path 1","mn":"ADBE Vector Shape - Group"},{"ty":"tm","s":{"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.52],"y":[0]},"n":["0_1_0p52_0"],"t":19,"s":[0],"e":[3.4]},{"i":{"x":[0],"y":[0]},"o":{"x":[0.167],"y":[0.167]},"n":["0_0_0p167_0p167"],"t":35,"s":[3.4],"e":[3.4]},{"i":{"x":[0.731],"y":[0.776]},"o":{"x":[0.5],"y":[0]},"n":["0p731_0p776_0p5_0"],"t":86,"s":[3.4],"e":[31.013]},{"i":{"x":[0.756],"y":[-0.33]},"o":{"x":[0.414],"y":[2.535]},"n":["0p756_-0p33_0p414_2p535"],"t":94,"s":[31.013],"e":[31.482]},{"t":95}],"ix":1},"e":{"k":[{"i":{"x":[0],"y":[1]},"o":{"x":[0.52],"y":[0]},"n":["0_1_0p52_0"],"t":19,"s":[100],"e":[65.2]},{"i":{"x":[0],"y":[0]},"o":{"x":[0.167],"y":[0.167]},"n":["0_0_0p167_0p167"],"t":35,"s":[65.2],"e":[65.2]},{"i":{"x":[0.731],"y":[0.794]},"o":{"x":[0.5],"y":[0]},"n":["0p731_0p794_0p5_0"],"t":88,"s":[65.2],"e":[38.107]},{"i":{"x":[0.756],"y":[0.887]},"o":{"x":[0.414],"y":[0.216]},"n":["0p756_0p887_0p414_0p216"],"t":94,"s":[38.107],"e":[31.482]},{"t":95}],"ix":2},"o":{"k":0,"ix":3},"m":1,"ix":2,"nm":"Trim Paths 1","mn":"ADBE Vector Filter - Trim"},{"ty":"st","fillEnabled":true,"c":{"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":22,"s":[0,0.65,0.6,1],"e":[0.76,0.76,0.76,1]},{"t":36}]},"o":{"k":100},"w":{"k":3},"lc":2,"lj":2,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke"},{"ty":"tr","p":{"k":[17,13],"ix":2},"a":{"k":[0,0],"ix":1},"s":{"k":[100,100],"ix":3},"r":{"k":0,"ix":6},"o":{"k":100,"ix":7},"sk":{"k":0,"ix":4},"sa":{"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":3,"mn":"ADBE Vector Group"}],"ip":0,"op":95,"st":0,"bm":0,"sr":1},{"ddd":0,"ind":3,"ty":4,"nm":"White BG Outlines","ks":{"o":{"k":100},"r":{"k":0},"p":{"k":[{"i":{"x":0,"y":1},"o":{"x":0.52,"y":0},"n":"0_1_0p52_0","t":15,"s":[70.347,49.429,0],"e":[49.428,49.429,0],"to":[0,0,0],"ti":[0,0,0]},{"i":{"x":0,"y":0},"o":{"x":0.167,"y":0.167},"n":"0_0_0p167_0p167","t":56,"s":[49.428,49.429,0],"e":[49.428,49.429,0],"to":[0,0,0],"ti":[0,0,0]},{"i":{"x":0.18,"y":1},"o":{"x":0.5,"y":0},"n":"0p18_1_0p5_0","t":86,"s":[49.428,49.429,0],"e":[70.347,49.429,0],"to":[0,0,0],"ti":[0,0,0]},{"t":106}]},"a":{"k":[24.25,24.25,0]},"s":{"k":[99.867,99.925,100]}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ks":{"k":{"i":[[-17.673,0],[0,17.673],[17.673,0],[0,-17.673]],"o":[[17.673,0],[0,-17.673],[-17.673,0],[0,17.673]],"v":[[8.544,32.018],[40.544,0.018],[8.544,-31.982],[-23.456,0.018]],"c":true}},"nm":"Path 1","mn":"ADBE Vector Shape - Group"},{"ty":"fl","fillEnabled":true,"c":{"k":[1,1,1,1]},"o":{"k":100},"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill"},{"ty":"tr","p":{"k":[7.125,24.25],"ix":2},"a":{"k":[0,0],"ix":1},"s":{"k":[93,93],"ix":3},"r":{"k":0,"ix":6},"o":{"k":100,"ix":7},"sk":{"k":0,"ix":4},"sa":{"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":2,"mn":"ADBE Vector Group"}],"ip":0,"op":150,"st":0,"bm":0,"sr":1},{"ddd":0,"ind":4,"ty":4,"nm":"Switch Outline Outlines","ks":{"o":{"k":100},"r":{"k":0},"p":{"k":[58.858,49.696,0]},"a":{"k":[42,34,0]},"s":{"k":[99.867,99.925,100]}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ks":{"k":{"i":[[0,17.677],[-17.652,0],[0,0],[0,-17.677],[17.652,0],[0,0]],"o":[[0,-17.673],[0,0],[17.671,0],[0,17.673],[0,0],[-17.671,0]],"v":[[-50.46,-0.154],[-18.463,-32.154],[1.544,-32.154],[33.54,-0.154],[1.544,31.846],[-18.463,31.846]],"c":true}},"nm":"Path 1","mn":"ADBE Vector Shape - Group"},{"ty":"tr","p":{"k":[42,34],"ix":2},"a":{"k":[0,0],"ix":1},"s":{"k":[100,100],"ix":3},"r":{"k":0,"ix":6},"o":{"k":100,"ix":7},"sk":{"k":0,"ix":4},"sa":{"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":1,"mn":"ADBE Vector Group"},{"ty":"fl","fillEnabled":true,"c":{"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":22,"s":[0,0.65,0.6,1],"e":[0.76,0.76,0.76,1]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":36,"s":[0.76,0.76,0.76,1],"e":[0.76,0.76,0.76,1]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":93,"s":[0.76,0.76,0.76,1],"e":[0,0.65,0.6,1]},{"t":106}]},"o":{"k":100},"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill"}],"ip":0,"op":150,"st":0,"bm":0,"sr":1}],"v":"4.5.0","ddd":0,"ip":0,"op":150,"fr":60,"w":100,"h":100}

Example/lottie-ios.xcodeproj/project.pbxproj

@@ -64,6 +64,8 @@
  622F77091F2BE63100269858 /* X.json in Resources */ = {isa = PBXBuildFile; fileRef = 622F76EB1F2BE63100269858 /* X.json */; };
  622F770A1F2BE63100269858 /* Y.json in Resources */ = {isa = PBXBuildFile; fileRef = 622F76EC1F2BE63100269858 /* Y.json */; };
  622F770B1F2BE63100269858 /* Z.json in Resources */ = {isa = PBXBuildFile; fileRef = 622F76ED1F2BE63100269858 /* Z.json */; };
+ 629EC57F1F54BFF1005B2C59 /* LAControlsViewController.m in Sources */ = {isa = PBXBuildFile; fileRef = 629EC57E1F54BFF1005B2C59 /* LAControlsViewController.m */; };
+ 629EC5811F54C00B005B2C59 /* Switch.json in Resources */ = {isa = PBXBuildFile; fileRef = 629EC5801F54C00B005B2C59 /* Switch.json */; };
  62B2546A1E3A8D310035A842 /* LottieRootViewController.m in Sources */ = {isa = PBXBuildFile; fileRef = 62B254631E3A8D310035A842 /* LottieRootViewController.m */; };
  62B2546B1E3A8D310035A842 /* AnimationExplorerViewController.m in Sources */ = {isa = PBXBuildFile; fileRef = 62B254651E3A8D310035A842 /* AnimationExplorerViewController.m */; };
  62B2546C1E3A8D310035A842 /* AnimationTransitionViewController.m in Sources */ = {isa = PBXBuildFile; fileRef = 62B254671E3A8D310035A842 /* AnimationTransitionViewController.m */; };
@@ -166,6 +168,9 @@
  622F76EC1F2BE63100269858 /* Y.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = Y.json; sourceTree = "<group>"; };
  622F76ED1F2BE63100269858 /* Z.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = Z.json; sourceTree = "<group>"; };
  62569CB2461B12ABC97FCB96 /* lottie-ios.podspec */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text; name = "lottie-ios.podspec"; path = "../lottie-ios.podspec"; sourceTree = "<group>"; };
+ 629EC57D1F54BFF1005B2C59 /* LAControlsViewController.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = LAControlsViewController.h; sourceTree = "<group>"; };
+ 629EC57E1F54BFF1005B2C59 /* LAControlsViewController.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = LAControlsViewController.m; sourceTree = "<group>"; };
+ 629EC5801F54C00B005B2C59 /* Switch.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = Switch.json; sourceTree = "<group>"; };
  62B254621E3A8D310035A842 /* LottieRootViewController.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = LottieRootViewController.h; sourceTree = "<group>"; };
  62B254631E3A8D310035A842 /* LottieRootViewController.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = LottieRootViewController.m; sourceTree = "<group>"; };
  62B254641E3A8D310035A842 /* AnimationExplorerViewController.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = AnimationExplorerViewController.h; sourceTree = "<group>"; };
@@ -301,6 +306,8 @@
  873B8AEA1B1F5CCA007FD442 /* Main.storyboard */,
  62B254621E3A8D310035A842 /* LottieRootViewController.h */,
  62B254631E3A8D310035A842 /* LottieRootViewController.m */,
+ 629EC57D1F54BFF1005B2C59 /* LAControlsViewController.h */,
+ 629EC57E1F54BFF1005B2C59 /* LAControlsViewController.m */,
  62B254741E3A8D400035A842 /* Animation Explorer */,
  62B254751E3A8D500035A842 /* Transition Demo */,
  62B254761E3A8D620035A842 /* Typing Animation Demo */,
@@ -338,6 +345,7 @@
  children = (
  622F76CF1F2BE63100269858 /* TypeFace */,
  622F76B51F2BE58100269858 /* 9squares-AlBoardman.json */,
+ 629EC5801F54C00B005B2C59 /* Switch.json */,
  622F76B61F2BE58100269858 /* HamburgerArrow.json */,
  622F76B71F2BE58100269858 /* IconTransitions.json */,
  622F76B81F2BE58100269858 /* LottieLogo1_masked.json */,
@@ -596,6 +604,7 @@
  622F76C61F2BE58100269858 /* LottieLogo1.json in Resources */,
  622F77051F2BE63100269858 /* T.json in Resources */,
  622F77021F2BE63100269858 /* Q.json in Resources */,
+ 629EC5811F54C00B005B2C59 /* Switch.json in Resources */,
  622F76FB1F2BE63100269858 /* J.json in Resources */,
  622F77081F2BE63100269858 /* W.json in Resources */,
  622F76F61F2BE63100269858 /* E.json in Resources */,
@@ -796,6 +805,7 @@
  62B254731E3A8D3B0035A842 /* AnimatedTextField.m in Sources */,
  62B2546C1E3A8D310035A842 /* AnimationTransitionViewController.m in Sources */,
  6003F59A195388D20070C39A /* main.m in Sources */,
+ 629EC57F1F54BFF1005B2C59 /* LAControlsViewController.m in Sources */,
  BC7BF4841F37DA7300FB702C /* LottieFilesURL.m in Sources */,
  622F76451F2AAA6500269858 /* LAQRScannerViewController.m in Sources */,
  );

Example/lottie-ios/LAControlsViewController.h

@@ -0,0 +1,13 @@
+//
+// LAControlsViewController.h
+// lottie-ios
+//
+// Created by brandon_withrow on 8/28/17.
+// Copyright © 2017 Brandon Withrow. All rights reserved.
+//
+
+#import <UIKit/UIKit.h>
+
+@interface LAControlsViewController : UIViewController
+
+@end

Example/lottie-ios/LAControlsViewController.m

@@ -0,0 +1,62 @@
+//
+// LAControlsViewController.m
+// lottie-ios
+//
+// Created by brandon_withrow on 8/28/17.
+// Copyright © 2017 Brandon Withrow. All rights reserved.
+//
+
+#import "LAControlsViewController.h"
+#import <Lottie/Lottie.h>
+
+@interface LAControlsViewController ()
+
+@end
+
+@implementation LAControlsViewController
+
+- (void)viewDidLoad {
+ [super viewDidLoad];
+
+ self.view.backgroundColor = [UIColor whiteColor];
+
+ UIButton *closeButton_ = [UIButton buttonWithType:UIButtonTypeSystem];
+ [closeButton_ setTitle:@"Close" forState:UIControlStateNormal];
+ [closeButton_ addTarget:self action:@selector(close) forControlEvents:UIControlEventTouchUpInside];
+ [self.view addSubview:closeButton_];
+ CGSize buttonSize = [closeButton_ sizeThatFits:self.view.bounds.size];
+ closeButton_.frame = CGRectMake(10, 30, buttonSize.width, 50);
+
+ /// An animated toggle with different ON and OFF animations.
+
+ LOTAnimatedSwitch *toggle1 = [LOTAnimatedSwitch switchNamed:@"Switch"];
+
+ /// Off animation is 0 to 0.5 progress.
+ /// On animation is 0.5 to 1 progress.
+ [toggle1 setProgressRangeForOnState:0.5 toProgress:1];
+ [toggle1 setProgressRangeForOffState:0 toProgress:0.5];
+
+ [toggle1 addTarget:self action:@selector(switchToggled:) forControlEvents:UIControlEventValueChanged];
+ toggle1.center = CGPointMake(CGRectGetMidX(self.view.bounds), 90);
+ [self.view addSubview:toggle1];
+
+ /// An animated 'like' or 'heart' button.
+ /// Clicking toggles the Like or Heart state.
+ /// The animation runs from 0-1, progress 0 is off, progress 1 is on
+ LOTAnimatedSwitch *heartIcon = [LOTAnimatedSwitch switchNamed:@"TwitterHeart"];
+ heartIcon.bounds = CGRectMake(0, 0, 200, 200);
+ heartIcon.center = CGPointMake(CGRectGetMidX(self.view.bounds), CGRectGetMaxY(toggle1.frame) + (heartIcon.bounds.size.height * 0.5));
+ [heartIcon addTarget:self action:@selector(switchToggled:) forControlEvents:UIControlEventValueChanged];
+ [self.view addSubview:heartIcon];
+
+}
+
+- (void)switchToggled:(LOTAnimatedSwitch *)animatedSwitch {
+ NSLog(@"The switch is %@", (animatedSwitch.on ? @"ON" : @"OFF"));
+}
+
+- (void)close {
+ [self.presentingViewController dismissViewControllerAnimated:YES completion:NULL];
+}
+
+@end

Example/lottie-ios/LottieRootViewController.m

@@ -66,7 +66,9 @@ - (void)_buildDataSource {
  @{@"name" : @"Animated Keyboard",
  @"vc" : @"TypingDemoViewController"},
  @{@"name" : @"Animated Transitions Demo",
- @"vc" : @"AnimationTransitionViewController"}];
+ @"vc" : @"AnimationTransitionViewController"},
+ @{@"name" : @"Animated UIControls Demo",
+ @"vc" : @"LAControlsViewController"}];
 }
 
 - (void)_playLottieAnimation {