GLDTween is a powerful animation library for iOS. It enables you to write complex animation with simple coding.
GLDTweenはiOS用のハンディなアニメーション用ライブラリです。高度なアニメーションを、シンプルかつパワフルに記述できます。
iOSでは「手触り」が重要視されながらも、アニメーションに関するプログラミング資産は不足していました。UIAnimationはAppleの要求するアニメーション品質を実現するにはあまりに貧弱です。一方でCoreAnimationは強力なものの複雑でした。結局のところ、どちらも直感的に表現をコーディングするには向きません。
GLDTweenはこの問題を解決するために開発されました。アニメーションの表現と技術で多くの蓄積があったFlashのノウハウをベースに、ActionScriptの伝説的アニメーションエンジンTweenerをベースに設計されました。シンプルなAPIでパワフルな表現を実現します。
大抵のアニメーションを1行で記述できます。型変換はライブラリが自動で行うので、CGPointやCATransform3Dなど様々な型を横断する必要がありません。
たとえばオブジェクトをアニメーション中に、さらに別のアニメーションを行った場合、GLDTweenは自動で同じプロパティのマージや上書きを行い競合や衝突を防ぎます。
GLDTweenのサポートする一般的な数値型であれば、あらゆるプロパティがアニメーション可能です。数値型でさえあれば音楽のボリュームや、ビデオの再生位置すらアニメーション可能です!
プラグイン方式を採用しているため、ライブラリそのものに手をいれずに独自のカスタマイズができます。アニメーション関数や、特殊な計算を行うプロパティを自分追加できます。
数個〜数十個のUI要素や画面遷移を行うためのライブラリです。パーティクルのような万単位で同時に動かすアニメには向いていません。
CocoaPodsを使っている場合、以下をPodfileに追加します。
pod 'GLDTween', '~> 0.0.1'
通常通りダウンロードやPushでインストールしてください。 ライブラリの依存性としてはQuartzCore.frameworkが必要となります。
例えば、viewの移動をする場合、以下のように1行で書けます。
GLDTweenでは任意のNSObjectに対し、NSDictionaryでプロパティのアニメーションを指定します。 NSValueを用いてラップをすることで、CGPoint、CGSize、CGRect、CGAffineTransformなどのプロパティも指定可能です。
UIViewを座標(200, 300)に2秒で移動させます。
[GLDTween addTween:myView
params:@{@"duration": @2.0, // 時間
@"delay": @0.0,
@"easing": GLDEasingInOutExpo, // 任意のアニメーションカーブ
@"center": [NSValue valueWithCGPoint:CGPointMake(200, 300)]
}];
あるいは標準プラグインの力で、CGPointのかわりにcenterX、centerYでも指定できます。
[GLDTween addTween:myView
params:@{@"duration": @2.0, // 時間
@"delay": @0.0,
@"easing": GLDEasingInOutExpo, // 任意のアニメーションカーブ
@"centerX": @200, // center.xのショートカット
@"centerY": @300, // center.yのショートカット
}];
実行中の任意のNSObjectのアニメーションを削除します。
[GLDTween removeTween:myView];
あるいは特定のプロパティのアニメーションだけ削除することも可能です。
[GLDTween removeTween:myView params:@[@"x", @"width"]];
[GLDTween removeAllTweens];
実行中のアニメーションを一時停止します。
[GLDTween pauseTween:myView];
[GLDTween resumeTween:myView];
[GLDTween pauseAllTweens];
[GLDTween resumeAllTweens];
[GLDTween addTween:myView
params:@{@"duration": @2.0, // 時間
@"delay": @0.0,
@"easing": GLDEasingInOutExpo, // 任意のアニメーションカーブ
@"width": @100,
@"height": @100,
@"centerX": @200,
@"centerY": @300,
@"alpha": @0.0
}];
パラメータの辞書を再利用することで、同じアニメーションを複数のNSObjectに適用できます。
[GLDTween addTween:myView0 params:myDict];
[GLDTween addTween:myView1 params:myDict];
[GLDTween addTween:myView2 params:myDict];
右に1秒移動してから下に1秒移動する。 2つのアニメーションと、delayのパラメータ指定で連続的なアニメーションも記述できる。
// 右に移動
[GLDTween addTween:myView
params:@{@"duration": @1.0, // 時間
@"delay": @0.0,
@"easing": GLDEasingInOutExpo,
@"centerX": @200,
}];
// 下に移動
[GLDTween addTween:myView
params:@{@"duration": @1.0, // 時間
@"delay": @1.0, // 1.0秒遅延させて実行
@"easing": GLDEasingInOutExpo,
@"centerY": @300,
}];
同じ時間帯にアニメーションが競合する場合、2つ目のアニメーションへ自動で上書きされます。 下記の2つのアニメーションではXが競合するので、Xのみ2番目のアニメーションが優先されます。
[GLDTween addTween:myView
params:@{@"duration": @3.0, // 時間
@"delay": @0.0,
@"easing": GLDEasingInOutExpo,
@"x": @200,
@"y": @100,
}];
[GLDTween addTween:myView
params:@{@"duration": @1.5, // 時間
@"delay": @1.0,
@"easing": GLDEasingInOutExpo,
@"x": @300,
}];
ブロックあるいはセレクターで、イベントハンドリングが可能。ただしNSDictionaryに格納するためにGLDTweenBlockあるいは、GLDTweenSelectorでラップする必要がある。
__weak id s = self;
[GLDTween addTween:myView
params:@{@"duration": @1.0, // 時間
@"delay": @0.0,
@"easing": GLDEasingInOutExpo,
@"startBlock": [GLDTweenBlock block:^(void){
[s animationDidStart:nil]; // ブロック
}],
@"completionBlock": [GLDTweenBlock block:^(void){
[s animationDidComplete:nil]; // ブロック
}]
}];
[GLDTween addTween:myView
params:@{@"duration": @1.0, // 時間
@"delay": @0.0,
@"easing": GLDEasingInOutExpo,
@"startSelector": [GLDTweenSelector selector:@selector(animationDidStart:) withTarget:self],
@"completionSelector": [GLDTweenSelector selector:@selector(animationDidComplete:) withTarget:self]
}];
locksInteraction、unlocksInteractionパラメータで、アニメーション中のユーザー操作をロックできます。
[GLDTween addTween:myView
params:@{@"duration": @1.0, // 時間
@"delay": @0.0,
@"easing": GLDEasingInOutExpo,
@"locksInteraction": @YES, // 追加時に操作系をロック
@"unlocksInteraction": @YES // 完了 or 削除時に操作系をアンロック
}];
アニメーションのパラメータは、GLDTween.addTweenの第2引数で指定します。第2引数はNSDictionaryで、あらゆるデータ型を内包可能です。
アニメーション対象として指定したNSObjectサブクラスから、valueForKeyで取得できる下記型のプロパティに対応しています。またNSObjectを拡張した場合、これらの型の値を返す全てのGetter/Setterもアニメーション可能です。
いわゆるRobert Pennerによる主要アニメーションカーブは全てサポートしています。
GLDTweenでは以下の2種類のプラグインを作成可能です。 プラグインの作成方法は後述します。