Question

我正在尝试设置按钮的样式，但是当我应用自定义样式时，它最终没有显示，只有其内容（按钮的文本）可见。这是我宣布我的风格的方式：

    <Color x:Key="NormalColor" A="255" R="60" G ="158" B="184"/>
    <Color x:Key="HoverColor" A="255" R="74" G ="177" B="204"/>
    <Color x:Key="PressedColor" A="255" R="26" G ="115" B="138"/>

    <SolidColorBrush x:Key="NormalBrush" Color="{StaticResource NormalColor}" />
    <SolidColorBrush x:Key="HoverBrush" Color="{StaticResource HoverColor}" />
    <SolidColorBrush x:Key="PressedBrush" Color="{StaticResource PressedColor}" />

    <Style x:Key="FlatButton" TargetType="Button">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="FontFamily" Value="Segoe UI"/>
        <Setter Property="Background" Value="{StaticResource NormalBrush}"/>
        <Setter Property="Foreground" Value="#000000"/>

        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">

                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Name="Content"/>

                    <ControlTemplate.Triggers>

                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Background"  Value="{StaticResource HoverBrush}" />
                            <Setter Property="Foreground" Value="#000000" />
                        </Trigger>

                        <Trigger Property="IsPressed" Value="True">
                            <Setter Property="Background" Value="{StaticResource PressedBrush}" />
                            <Setter Property="Foreground" Value="#000000" />
                        </Trigger>

                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Background" Value="{StaticResource NormalBrush}" />
                            <Setter Property="Foreground" Value="#000000" />
                            <Setter Property="Opacity" Value="0.5" />                                
                        </Trigger>

                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</Window.Resources>

以下是我如何使用它：

<Button Content="Connect" Command="model:GlobalCommands.ConnectToDBCommand" Style="{StaticResource FlatButton}"/>

谁能告诉我哪里出错了？谢谢！

Answer 1

ControlTemplate中没有任何内容会使用Background。将ContentPresenter置于Border内（例如）并使用TemplateBinding绑定其Background

<Border Background="{TemplateBinding Background}">
    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Name="Content"/>
</Border>

Answer 2

添加到@ dkozl的答案，您应该将TemplateBinding添加到您可能想要在Button.ControlTemplate之外设置的Button.ControlTemplate中的任何属性：

<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding
    BorderThickness}" Background="{TemplateBinding Background}">
    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>

然后你可以这样做：

<Button Content="Connect" Command="model:GlobalCommands.ConnectToDBCommand" 
    Style="{StaticResource FlatButton}" BorderBrush="Blue" BordeThickness="5" />

自定义按钮样式不起作用？

2 个答案: