#13 文字をパス化してモーフィングしてみたーC4のパスであそぶ(2)
この記事は「一人アドベントカレンダー2013〜Lonely Advent Calender 2013〜」の14日目の記事です。
前回は矩形から楕円へのパスデータを使ったアニメーションを試してみました。今回はその流れで文字をパス化してモーフィングする例を見ていきます。
文字のパス化
C4にはすでに文字データをパス化するメソッドが用意されています。
setup内でC4Fontをつかって文字をC4Shapeオブジェクトとして初期化します。
-(void)setup { //setup up the initial shape C4Font *font = [C4Font fontWithName:@"ArialRoundedMTBold" size:90.0f]; theShape = [C4Shape shapeFromString:@"C4" withFont:font]; theShape.center = self.canvas.center; [self.canvas addShape:theShape];
アニメーションの設定は前回と同様に下記のように
theShape.animationDuration = 1.0f; }
変化させる文字
「Hello」という文字と「World!」という文字を交互に変化させていくモーフィングアニメーションをつくるためにhello
とWorld!
というメソッドを用意します。
-(void)hello { C4Font *font = [C4Font fontWithName:@"ArialRoundedMTBold" size:90.0f]; [theShape shapeFromString:@"Hello" withFont:font]; theShape.center = self.canvas.center; [self runMethod:@"world" afterDelay:2.0f]; } -(void)world { C4Font *font = [C4Font fontWithName:@"ArialRoundedMTBold" size:90.0f]; [theShape shapeFromString:@"World!" withFont:font]; theShape.center = self.canvas.center; [self runMethod:@"hello" afterDelay:2.0f]; }
それぞれ、最初に作ったtheShape
というオブジェクトに指定した文字の形を当てはめています。
最後にsetup内でhello
メソッドを呼びます。
-(void)setup { (略) [self runMethod:@"hello" afterDelay:2.0f]; }
これで文字のモーフィングもできました。 もうちょっとアニメーションがスムーズになるといいのですが… しかし簡単ですね。