WPF：圖像按鈕的可重用模板？

Question

我的WPF項目使用了很多圖像按鈕，但由於我還沒有找到一種正確的方法（我每次必須編寫相同的觸發器和樣式，只有差異是圖像源），我的資源字典變得很長徒勞無功。 有沒有更好的方法呢？

這是我用於按鈕的樣式示例：

<Style x:Key="ButtonStyle" TargetType="{x:Type Button}">
    <!-- Some setters -->
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Grid>
                    <Image Source="Images.png" Stretch="Fill"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <!-- Some triggers ( IsFocused, IsMouseOver, etc.) -->
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

謝謝 ：）

Answer 1

最簡單的方法是使用Image屬性創建特定控件：

public class ImageButton : Button
{
    static ImageButton()
    {
        DefaultStyleKeyProperty.OverrideMetadata(typeof (ImageButton),
            new FrameworkPropertyMetadata(typeof (ImageButton)));
    }


    public ImageSource Image
    {
        get { return (ImageSource)GetValue(ImageProperty); }
        set { SetValue(ImageProperty, value); }
    }

    public static readonly DependencyProperty ImageProperty =
        DependencyProperty.Register("Image", typeof(ImageSource), typeof(ImageButton), new PropertyMetadata(default(ImageSource)));

}

然后，您只需在generic.xaml中為它創建一個樣式，並綁定到Image屬性，而不是顯式設置圖像：

<Style x:Key="{x:Type my:ImageButton}" TargetType="{x:Type my:ImageButton}">
    <!-- Some setters -->
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type my:ImageButton}">
                <Grid>
                    <Image Source="{TemplateBinding Image}" Stretch="Fill"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <!-- Some triggers ( IsFocused, IsMouseOver, etc.) -->
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

然后你可以像這樣使用它：

<my:ImageButton Image="Image.png" />

如果需要更多圖像用於按鈕的不同狀態，則可以向控件添加更多依賴項屬性。

另一種可能的方法是使用我稱之為“參數化樣式”的方法，以避免創建特定的控件; 有關詳細信息，請參閱此博文 。

Answer 2

您可以嘗試創建從Button繼承的自定義控件，並將其用作模板中的TargetType。 然后，您可以在圖像源中使用TemplateBinding。

<Image Source="{TemplateBinding ImageSource}" Stretch="Fill"/>

您需要在自定義控件中創建ImageSource屬性。 這樣您就可以在xaml中設置源代碼，但只需要一個資源模板。

Answer 3

您可以像這樣使用BasedOn屬性：

<Style x:Key="BlueHighlightedButtonStyle"  BasedOn="{StaticResource ButtonStyle}" TargetType="Button">
    <Setter Property="Background" Value="DeepSkyBlue"/>
</Style>

這將使Button Style具有與ButtonStyle相同的屬性，但具有DeepSkyBlue背景。