Question

我想用多个按钮创建一个应用程序。所以我想在我的应用程序中创建一个样式来定义按钮。按钮应包含图像，当慕斯结束时，图像应该会改变。

我为图片创建了资源：

<Image x:Key="Open-active" Source="Images/Open-active.png"/>
<Image x:Key="Open-over" Source="Images/Open-over.png"/>
<Image x:Key="Printer-active" Source="Images/Printer-active.png"/>
<Image x:Key="Printer-over" Source="Images/Printer-over.png"/>

我创建了一个Style（但不适用于资源类型Image）：

<Style x:Key="ButtonMain" TargetType="Button"
       BasedOn="{StaticResource {x:Static ToolBar.ButtonStyleKey}}">
    <Setter Property="Height" Value="{StaticResource MainButtonHeight}"/>
    <Setter Property="Width" Value="{StaticResource MainButtonWidth}"/>
    <Setter Property="Margin" Value="5"/>
    <Setter Property="Foreground" Value="Transparent"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="Background">
    <Setter.Value>
        <ImageBrush ImageSource="???"/>
    </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background">
                <Setter.Value>
                    <ImageBrush ImageSource="???"/>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
</Style>

如何正确创建我的Style以及如何使用它？

我想用这样的东西：

<Button Style="{StaticResource ButtonMain}"
    ImageActive="{StaticResource Open-active}"
    ImageOver="{StaticResource Open-over}"">

感谢您的帮助

Answer 1

您可以使用样式继承来实现您尝试做的事情：

你的主要风格是：

<Style x:Key="ButtonMain" TargetType="Button"
       BasedOn="{StaticResource {x:Static ToolBar.ButtonStyleKey}}">
    <Setter Property="Height" Value="{StaticResource MainButtonHeight}"/>
    <Setter Property="Width" Value="{StaticResource MainButtonWidth}"/>
    <Setter Property="Margin" Value="5"/>
    <Setter Property="Foreground" Value="Transparent"/>
    <Setter Property="BorderThickness" Value="0"/>
</Style>

一种只定义图像的样式如下：

<Style x:Key="ButtonImage1" TargetType="Button"
       BasedOn="{StaticResource ButtonMain">
 <Setter Property="Background">
    <Setter.Value>
        <ImageBrush ImageSource="???"/>
    </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background">
                <Setter.Value>
                    <ImageBrush ImageSource="???"/>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
</Style>

您只需使用按钮上的样式

关于图像，它不是你想要使用的类型，IIRC，ImageBrush源可以是图像文件的路径（检查MSDN，他们应该有一个很好的例子）

Answer 2

通过正确的绑定解决您的ImageSource问题：

<ImageBrush ImageSource="{Binding Source, Source={StaticResource Open-active}}"/>

对于您自己的媒体资源ImageActive和ImageOver，请构建您自己的自定义控件：
```
public class MyButton:Button
{ ... }
```

根据您的Binding要求，这些属性可以是简单的DependencyProperties。

如何正确创建带图像的按钮

2 个答案: