トップページへ

「ソフト関連Trial−Ｎｏ．108」記載の AnimationClock を使用した方法で作成した動画を紹介します。
なお、いずれの動画も、まず AVIファイルとして作成し、これを MP4ファイルに変換して掲載しています。

No1．DoubleAnimationUsingKeyFrames を使用したアニメーション（２Ｄ）
以下のサイトに記載されているアニメーションを動画にしたものです。
　　http://msdn.microsoft.com/ja-jp/library/ms742524(v=vs.90).aspx

左右に移動する正方形のアニメーションですが、通常の DoubleAnimation では記述しきれないので、キーフレームアニメーションを使います。
この動画の作成方法は、AnimationClockを使ってアニメーション動画を作る（1） で紹介しています。

　　　　　　　

No2．Transformを使った円のアニメーション（２Ｄ）
円 を回転させながら右下方向へ移動させ、この移動中に円のサイズを 2 倍に拡大するアニメーションです。
この例では、円の各種変換（Transform）に対して DoubleAnimation を適用します。

この動画の作成方法は、AnimationClockを使ってアニメーション動画を作る（2） で紹介しています。

　　　　　　　

No3．指定された経路上で 円 を運動させるアニメーション（２Ｄ）　
PathGeometry で規定された経路上で、円 を運動させるアニメーションです。
このアニメーションでは、PointAnimationUsingPath を使用します。

この動画の作成方法は、AnimationClockを使ってアニメーション動画を作る（3） で紹介しています。

　　　　　　　

No4．TileMode で描画された画像のアニメーション（２Ｄ）
TileMode で描画した 50 個の円の、色と半径を変えるアニメーションです。
ColorAnimation と DoubleAnimation を使用します。

この動画の作成方法は、AnimationClockを使ってアニメーション動画を作る（4） で紹介しています。

　　　　　　　

No5．自公転する立方体のアニメーション（３Ｄ）
自公転する立方体の３Ｄアニメーションです。
自転は DoubleAnimation で、公転は DoubleAnimationUsingPath で記述します。

この動画の作成方法は、AnimationClockを使ってアニメーション動画を作る（5） で紹介しています。

　　　　　　　

No6．立方体の表示にタイムラグを設けるアニメーション（３Ｄ）
自転する立方体を 3 個 配置して、タイムラグを設けて表示を行います。
自転は DoubleAnimation で、表示のタイムラグの設定は ObjectAnimationUsingKeyFrames で行います。
また、1 個の立方体は縦方向に 3 倍、別の 1 個の立方体は縦方向に 2 倍 伸長されるように、DoubleAnimation を設定します。

この動画の作成方法は、AnimationClockを使ってアニメーション動画を作る（6） で紹介しています。

　　　　　　　

No7．ClockGroup を使ったアニメーション−基本編（２Ｄ）
時間差をつけて 4 個の Rectangle を左右に動かすアニメーションです。
左右移動のアニメーションは DoubleAnimation で作成し、その BeginTime プロパティで移動開始時間を設定します。
このアニメーションの実行に ClockGroup を使用します。

この動画の作成方法は、AnimationClockを使ってアニメーション動画を作る（7） で紹介しています。

　　　　　　　

No8．ClockGroup を使ったアニメーション−応用編（２Ｄ）
ClockGroup の応用編として、ジグソーパズル的なアニメーションを紹介します。
No7 の横方向移動のアニメーションに、縦方向の移動と回転のアニメーションを加えて、パズルらしい構成にしたものです。

この動画の作成方法は、AnimationClockを使ってアニメーション動画を作る（8） で紹介しています。

　　　　　　　

No9．残像を形成するアニメーション（２Ｄ）
残像を形成しながら 円 を左右に移動させるアニメーションです。

この動画の作成方法は、AnimationClockを使ってアニメーション動画を作る（9） で紹介しています。

　　　　　　　

ご質問、ご意見、ご感想、バグ等のご連絡は、 こちらへ

トップページへ