wpf - 如何在WPF中创建通用的IconButton

Question

这是我的案例， 创建一个通用的图标按钮，可以在任何地方与不同的图标一起使用。

这是我的步骤:

1).创建一个派生自 Button 的自定义 IconButton，它具有 DefaultImageSource 依赖属性。这里是:

public class IconButton : Button
{
    public static readonly DependencyProperty DefaultImageSourceProperty =
       DependencyProperty.Register("DefaultImageSource", typeof(ImageSource), typeof(IconButton), new FrameworkPropertyMetadata(null));//, new FrameworkPropertyMetadata(OnImageSourceChanged));

    public ImageSource DefaultImageSource
    {
        get { return (ImageSource)GetValue(DefaultImageSourceProperty); }
        set { SetValue(DefaultImageSourceProperty, value); }
    }
}

2).在项目资源中为 IconButton 创建一个样式，假设使用此样式的 IconButton，

        <Style x:Key="IconButtonTemplate" TargetType="{x:Type WpfApplication3:IconButton}">                
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type WpfApplication3:IconButton}">
                        <Grid>
                            <Image Source="{Binding RelativeSource={RelativeSource Self}, Path=DefaultImageSource}"  Stretch="Uniform" Width="Auto" Height="Auto" x:Name="imageArt"/>
                            <Ellipse x:Name="focusEllipse" Fill="Transparent"/>
                        </Grid>
                        <ControlTemplate.Triggers>                                
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="focusEllipse" Property="Fill" Value="#AAFFFFFF"/>
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter TargetName="focusEllipse" Property="Fill" Value="#AA808080"/>
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="focusEllipse" Property="Fill" Value="#80808080"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

3).在我的WPF窗口中创建多个IconButton，并将它们绑定(bind)到不同的图标，但没有运气；打开此窗口时不显示图标，

<Grid>

    <DockPanel>

        <WpfApplication3:IconButton Width="30" Height="30" DefaultImageSource="{DynamicResource RefreshIcon}" Style="{DynamicResource IconButtonTemplate}"></WpfApplication3:IconButton>

        <WpfApplication3:IconButton Width="30" Height="30" DefaultImageSource="{DynamicResource RunIcon}" Style="{DynamicResource IconButtonTemplate}"></WpfApplication3:IconButton>
    </DockPanel>
</Grid>

可能是图片资源绑定(bind)错误的问题，但多次尝试都无法解决。有什么建议吗？谢谢。

Answer 1

我可以在 Binding 中看到问题。使用

 <Image Source="{Binding RelativeSource={RelativeSource Self}, Path=DefaultImageSource}"  Stretch="Uniform" Width="Auto" Height="Auto" x:Name="imageArt"/>

使用Self模式，您尝试将Source绑定(bind)到Image控件的DefaultImageSource属性。而 Image 没有任何这样的属性，所以很爆炸。

试试这个

 <Image Source="{TemplateBinding DefaultImageSource}"  Stretch="Uniform" Width="Auto" Height="Auto" x:Name="imageArt"/>

这将尝试将Image的Source绑定(bind)到Button的DefaultImageSource属性。

我希望这会有所帮助。