これはスタイルの例です:
<Style TargetType="Button">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="Disabled"/>
<VisualState x:Name="MouseOver">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="mouseOverBackgroundImage" Storyboard.TargetProperty="Opacity" Duration="0:0:0.1" To="1"/>
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="pressedBackgroundImage" Storyboard.TargetProperty="Opacity" Duration="0:0:0.1" To="1"/>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Image Name="normalBackgroundImage" Source="{TemplateBinding local:BackgroundImages.NormalBackgroundImage}"/>
<Image Name="mouseOverBackgroundImage" Source="{TemplateBinding local:BackgroundImages.MouseOverBackgroundImage}" Opacity="0"/>
<Image Name="pressedBackgroundImage" Source="{TemplateBinding local:BackgroundImages.PressedBackgroundImage}" Opacity="0"/>
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
プロパティが設定されたボタンで使用されます。
<Button local:BackgroundImages.NormalBackgroundImage="C:\Users\Public\Pictures\Sample Pictures\Tulips.jpg"
local:BackgroundImages.MouseOverBackgroundImage="C:\Users\Public\Pictures\Sample Pictures\Desert.jpg"
local:BackgroundImages.PressedBackgroundImage="C:\Users\Public\Pictures\Sample Pictures\Penguins.jpg"
Content="Hello"/>
そして最後に、これらの添付プロパティの定義:
public static class BackgroundImages
{
public static readonly DependencyProperty NormalBackgroundImageProperty =
DependencyProperty.RegisterAttached("NormalBackgroundImage", typeof(ImageSource), typeof(BackgroundImages));
public static readonly DependencyProperty MouseOverBackgroundImageProperty =
DependencyProperty.RegisterAttached("MouseOverBackgroundImage", typeof(ImageSource), typeof(BackgroundImages));
public static readonly DependencyProperty PressedBackgroundImageProperty =
DependencyProperty.RegisterAttached("PressedBackgroundImage", typeof(ImageSource), typeof(BackgroundImages));
public static ImageSource GetNormalBackgroundImage(DependencyObject obj)
{
return (ImageSource)obj.GetValue(NormalBackgroundImageProperty);
}
public static void SetNormalBackgroundImage(DependencyObject obj, ImageSource value)
{
obj.SetValue(NormalBackgroundImageProperty, value);
}
public static ImageSource GetMouseOverBackgroundImage(DependencyObject obj)
{
return (ImageSource)obj.GetValue(MouseOverBackgroundImageProperty);
}
public static void SetMouseOverBackgroundImage(DependencyObject obj, ImageSource value)
{
obj.SetValue(MouseOverBackgroundImageProperty, value);
}
public static ImageSource GetPressedBackgroundImage(DependencyObject obj)
{
return (ImageSource)obj.GetValue(PressedBackgroundImageProperty);
}
public static void SetPressedBackgroundImage(DependencyObject obj, ImageSource value)
{
obj.SetValue(PressedBackgroundImageProperty, value);
}
}
トリガーについては、次のようなものを試してください。これはよくわかりません: (画像をプロジェクトの /Images フォルダーに追加するだけです)
<ControlTemplate TargetType="Button">
<Border Name="border" BorderThickness="0"
Background="Transparent">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background">
<Setter.Value>
<ImageBrush ImageSource="/MyProjectName;component/Images/MyImage.jpg" />
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
Normal、MouseOver、Pressed (およびそれ以上) の状態の背景画像の添付プロパティを定義できます。コントロール テンプレート内の個別の Image コントロールの Sourceproperty にこれらの添付プロパティを使用し、VisualState が変更されたときに Image の不透明度などを変更します。