1. Qiita
  2. 投稿
  3. Mac

Objective-C で Tween とイージング

  • 21
    いいね
  • 0
    コメント
この記事は最終更新日から1年以上が経過しています。

iOS SDK でアニメーションする場合は UIView animation 系メソッドを使うとか、
Mac でも CALayer を使うとか、色々選択肢があると思います。

始まりの値と終わりの値から途中の値を自動的に算出する Tween を使ってみませんか?
1/60 秒ごとに一回呼び出されるコールバックで、その時その時の値を取り出し、UIView.frame に代入したり、 CATransform に使ったり、alpha にしたり、NSString へ変換してスロットっぽい演出に使ったり、3D 座標空間での値の計算に使ったり、何にでも使えます。

というわけで Flasher にはおなじみの Tween 系ライブラリです。

イージングも一通り用意してあります。

普段使っているオレオレ Tween ライブラリを、
Objective-C プログラマーの皆様へクリスマスプレゼントにしようと思います。

github にプロジェクト一式をアップしました。

ただ書き方がイマイチスマートじゃなくて、
NSInvocation とか使ったらもっとコードを綺麗にと出来ないかなとかありますね。
PushRequest とか頂けたらと思います。(それが僕へのクリスマスプレゼント!)

P.S. 個人ブログにもこのライブラリについての内容を書きました。
こことは違うことを書いていますのでよろしければご覧下さい。
feb19.jp blog - Objective-C で Tween ライブラリ作ったよ!

使い方

1. ご自身のプロジェクトに QuartzCore.framework をリンクしてください。

2. ご自身のプロジェクトに Tween.h/.m TweenObject.h/m をコピーしてください。

3. Tween を実行するクラスに Tween.h と TweenObject.h をインポートしてください。

#import "Tween.h"
#import "TweenObject.h"

4. Tween を実行するタイミングで以下のメソッドを叩いてください。

[Tween addTween:self tweenId:0  startValue:10 endValue:290 time:2 delay:0 easing:@"easeNone" startSEL:nil updateSEL:@selector(update:) endSEL:@selector(end:)];

startValue が開始時の値、endValue が終了時の値、time が Tween にかかる時間、delay が Tween が始まるまでの待機時間です。
easing の部分を @"easeInOutQuint"@"easeOutBack" とかに変えると楽しいかもしれません。
Tween が開始されると、それぞれセレクターが呼び出され、開始時は startSEL、実行中は updateSEL、終了時は endSEL が呼び出されます。

5. コールバックを実装してください。

4 と同じ書き方であれば、update:(TweenObject *)tween や、end:(TweenObject *)tween が呼び出されるので、そこで tween.currentValue を拾って何か値にしてやってください。

self.view.frame  = CGRectMake(tween.currentValue,  0,20,20);

4 で tweenId を指定していれば、コールバックで Tween を見分けることが出来ます。詳しくは github の ViewController.m をご覧ください。

Merry Christmas!

あまりにも些細ですが・・・こんなクリスマスプレゼントはいかがでしょうか。w
メリークリスマス!