ホーム > Expression Blend > 0からはじめるExpression Blend再入門

その44:Behaviorで変更する値の間を補完する

0からはじめるExpression Blend再入門
蜜葉 優@Silverlight Square & Windows Phone Arch[著], わにちゃん@ExpressionTech.jp[編集]
2013年1月26日 from Atelier:Mitsuba

はじめに

Twitterで、Blendで値を変更したら自動でその間を補完するビハインドの有無についての質問がありました。

f:id:c-mitsuba:20130126215708p:image

これはとっても簡単で、ビヘイビアの基本機能で実現できます。

操作方法

プロパティの値を変えるには、このブログで何度も扱ったChangePropertyActionがありますね。

Rectangleのwidthを500pxの変えるビヘイビアをボタンがクリックしたら実行するようにしました。

ボタンをおすとー

f:id:c-mitsuba:20130126215518p:image

一瞬で変わってしまいます。

f:id:c-mitsuba:20130126215517p:image

そこでビヘイビアのAnimationプロパティを使います。

Animationタブを開いて任意の時間をhh:mm:ssの形式で手入力します。

Storyboardで利用できるイージングも適用できます。

今回は0:0:10でやってみました。

実行すると、10秒かけてだんだん値が変わっていきます

f:id:c-mitsuba:20130126215516p:image

f:id:c-mitsuba:20130126215515p:image

ちなみにxamlでかくとこんなかんじ。

<Button Content="実行" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="55,114,0,0" Height="45">
	<i:Interaction.Triggers>
		<i:EventTrigger EventName="Click">
			<ei:ChangePropertyAction TargetName="rectangle" PropertyName="Width" Value="500" Duration="0:0:10"/>
		</i:EventTrigger>
	</i:Interaction.Triggers>
</Button>

ねっ、簡単でしょう!

次の記事

0からはじめるExpression Blend再入門』最新記事

コメント

▲このページのトップへ