前回の記事でStoryboardの基本的な使い方を説明しました。
今回はDoubleAnimationのToとByプロパティについてです。
DoubleAnimationではFromにアニメーションの開始時の値、Toにアニメーション終了時の値を指定することは、前回説明した通りです。
現在値からアニメーションを開始したい
Fromを設定すると、アニメーションは必ずその値から開始を行います。このため、現在値からと大きくかけ離れた値でアニメーションが開始されてしまう場合があります。
もし、現在値からアニメーションを開始したい場合には、単純にFromを取り除けばOKです。
前回のコードでFromを削除すると以下のようになります。
<Page.Resources> <Storyboard x:Name="Storyboard1"> <DoubleAnimation Storyboard.TargetName="txtMessage" Storyboard.TargetProperty="FontSize" EnableDependentAnimation="True" To="200" Duration="0:0:5" /> </Storyboard> </Page.Resources>
上記のように記述すると、フォントサイズは現在表示されているサイズから200になるようにアニメーションが行われます。
アニメーションを行うたびに現在値を使うには
アニメーションの開始時に現在値を使う方法がわかりました。
しかし、Toを指定すると、今度はアニメーション終了時のサイズが固定となってしまいます。
これでは次回アニメーションを開始するときに、前回終了時の値から開始することができません。
このような場合には、FromプロパティとToプロパティを使用せずにByプロパティを使用します。
Byプロパティにはアニメーションの再生時間に変化する量を指定します。
たとえば、5秒間の間で20だけ変化させたい場合、XAMLは以下のようになります。
<Page.Resources> <Storyboard x:Name="Storyboard1"> <DoubleAnimation Storyboard.TargetName="txtMessage" Storyboard.TargetProperty="FontSize" EnableDependentAnimation="True" By="20" Duration="0:0:5" /> </Storyboard> </Page.Resources>
仮に、スタート時のフォントサイズが10だったとしましょう。
アニメーションが開始されると5秒間かけて20増加するので、終了時にはフォントサイズが30になります。
次回アニメーションを行うと、前回終了した値である30から20増加して、アニメーション終了時には50になるというわけです。
ここまでのまとめ
目的 | プロパティ |
---|---|
アニメーション開始時の値を指定したい場合 | From |
アニメーション終了時の値を指定したい場合 | To |
アニメーションごとに値を変化させたい場合 | By |
コメント