あなたはブレンドを使用しているので、あなたがVisualStateManager
ためのブレンドのサポートを活用する必要があります。 MouseOver
とNormal
のようなさまざまな状態でオブジェクトがどのように見えるか、およびさまざまな状態間の遷移がどれくらいの時間であるかを説明するだけで済みます。また、ビジュアル状態マネージャは状態間の遷移方法を理解します。
画像には視覚的な状態はありませんが、Button
テンプレートを編集して内容をイメージにして、ボタンの状態を編集することができます。
<Grid>
<Grid.Resources>
<Style x:Key="ButtonStyle1" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Image x:Name="image" Height="100" Width="Auto" Source="http://thecybershadow.net/misc/stackoverflow.png" Margin="0,0,-25,0">
<Image.Effect>
<DropShadowEffect ShadowDepth="0"/>
</Image.Effect>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualStateGroup.Transitions>
<VisualTransition GeneratedDuration="0:0:0.5"/>
</VisualStateGroup.Transitions>
<VisualState x:Name="Normal"/>
<VisualState x:Name="MouseOver">
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Effect).(DropShadowEffect.ShadowDepth)" Storyboard.TargetName="image">
<EasingDoubleKeyFrame KeyTime="0" Value="15"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed"/>
<VisualState x:Name="Disabled"/>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Image>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Grid.Resources>
<Button Style="{StaticResource ButtonStyle1}"/>
</Grid>
注ブレンドがあなたのためにすべてこれを行いますが、XAMLを理解することに役立つこと:私は技術を証明するためにこれを行っおよびXAMLをクリーンアップしました。ここでブレンド指向のチュートリアルです:
私はExpression Blendのを使用していないが、しかし、多分あなたは、直接XAML上で動作するようにしたいですか?ストーリーボードを別のイベントで元に戻すには、新しいストーリーボードを逆の順序で作成し、そのイベントにタグ付けすることです。 –
私はそれについて考えていましたが、別のストーリーボードを作成しないようにしていました。入力いただきありがとうございます。 –
これまでのところ、1回のイベントで「do-and-reverse」がトリガされた場合は簡単に実行できますが、urの場合は2つの別々のイベントです。 xamlだけで便利な方法を知ることに興味があります。 –