我使用名为ImageButton
的自定义控件来显示包含不同图像的按钮。 ImageButton
包含依赖项属性:
public ImageSource DisabledImageSource
{
get { return (ImageSource)GetValue(DisabledImageSourceProperty); }
set { SetValue(DisabledImageSourceProperty, value); }
}
public ImageSource NormalImageSource
{
get { return (ImageSource)GetValue(NormalImageSourceProperty); }
set { SetValue(NormalImageSourceProperty, value); }
}
public ImageSource HoverImageSource
{
get { return (ImageSource)GetValue(HoverImageSourceProperty); }
set { SetValue(HoverImageSourceProperty, value); }
}
public ImageSource PushedImageSource
{
get { return (ImageSource)GetValue(PushedImageSourceProperty); }
set { SetValue(PushedImageSourceProperty, value); }
}
public static readonly DependencyProperty DisabledImageSourceProperty =
DependencyProperty.Register("DisabledImageSource", typeof(ImageSource), typeof(ImageButton), new UIPropertyMetadata());
public static readonly DependencyProperty NormalImageSourceProperty =
DependencyProperty.Register("NormalImageSource", typeof(ImageSource), typeof(ImageButton), new UIPropertyMetadata());
public static readonly DependencyProperty HoverImageSourceProperty =
DependencyProperty.Register("HoverImageSource", typeof(ImageSource), typeof(ImageButton), new UIPropertyMetadata());
public static readonly DependencyProperty PushedImageSourceProperty =
DependencyProperty.Register("PushedImageSource", typeof(ImageSource), typeof(ImageButton), new UIPropertyMetadata());
它的风格定义如下:
<Style TargetType="{x:Type local:ImageButton}">
<Setter Property="HorizontalAlignment" Value="Left"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Image Name="image" Source="{Binding NormalImageSource, RelativeSource={RelativeSource TemplatedParent}}" Stretch="None" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="image" Property="Source" Value="{Binding DisabledImageSource, RelativeSource={RelativeSource TemplatedParent}}"/>
</Trigger>
<Trigger Property="Button.IsPressed" Value="True">
<Setter TargetName="image" Property="Source" Value="{Binding PushedImageSource, RelativeSource={RelativeSource TemplatedParent}}"/>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True" />
</MultiTrigger.Conditions>
<Setter TargetName="image" Property="Source" Value="{Binding HoverImageSource, RelativeSource={RelativeSource TemplatedParent}}"/>
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
除了IsPressed
之外,每件事都可以正常工作。我永远看不到我在PushedImageSource
中设置的图像,我无法弄清楚原因。
任何帮助都会受到关注:)
这是测试它的xaml代码
<Window x:Class="SMEClient.WPF.Tester.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:is="clr-namespace:Project1.SearchBox;assembly=Project1"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/Project1;component/SearchBox/ImageButton.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Grid>
<StackPanel>
<is:ImageButton NormalImageSource="C:\Users\Public\Pictures\Sample Pictures\Koala.jpg"
PushedImageSource="C:\Users\Public\Pictures\Sample Pictures\Chrysanthemum.jpg"
HoverImageSource="C:\Users\Public\Pictures\Sample Pictures\Jellyfish.jpg"/>
</StackPanel>
</Grid>
</Window>
答案 0 :(得分:12)
您的触发器不是互斥的,在这种情况下,触发器添加到Triggers
集合的顺序开始起作用。在IsMouseOver
触发器设置正确的图像后,您的上一次触发Source
会覆盖IsPressed
属性,因为只有在鼠标结束时(当然使用鼠标时)才按下按钮。
尝试在IsPressed
集合中设置最后Triggers
触发器,即使IsPressed
也为真,也会应用IsMouseOver
触发器。
答案 1 :(得分:1)
好的,所以我找到了一种有点难看的解决方法,但它有效
<Style TargetType="{x:Type local:ImageButton}">
<Setter Property="HorizontalAlignment" Value="Left"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid>
<Image Name="Normal" Source="{Binding NormalImageSource, RelativeSource={RelativeSource TemplatedParent}}" Stretch="None" Visibility="Visible" />
<Image Name="Hover" Source="{Binding HoverImageSource, RelativeSource={RelativeSource TemplatedParent}}" Stretch="None" Visibility="Hidden"/>
<Image Name="Clicked" Source="{Binding PushedImageSource, RelativeSource={RelativeSource TemplatedParent}}" Stretch="None" Visibility="Hidden"/>
<Image Name="Disabled" Source="{Binding DisabledImageSource, RelativeSource={RelativeSource TemplatedParent}}" Stretch="None" Visibility="Hidden"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="Normal" Property="Visibility" Value="Hidden"/>
<Setter TargetName="Hover" Property="Visibility" Value="Visible"/>
<Setter TargetName="Clicked" Property="Visibility" Value="Hidden"/>
<Setter TargetName="Disabled" Property="Visibility" Value="Hidden"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="Normal" Property="Visibility" Value="Hidden"/>
<Setter TargetName="Hover" Property="Visibility" Value="Hidden"/>
<Setter TargetName="Clicked" Property="Visibility" Value="Visible"/>
<Setter TargetName="Disabled" Property="Visibility" Value="Hidden"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="Normal" Property="Visibility" Value="Hidden"/>
<Setter TargetName="Hover" Property="Visibility" Value="Hidden"/>
<Setter TargetName="Clicked" Property="Visibility" Value="Hidden"/>
<Setter TargetName="Disabled" Property="Visibility" Value="Visible"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>