如何将样式应用于 WPF 中的按钮？答案

【问题标题】：How to apply a style to button in WPF?如何将样式应用于 WPF 中的按钮？
【发布时间】：2014-05-24 03:41:33
【问题描述】：

我正在尝试将样式应用于按钮我们如何实现这一点？

下面是我的示例 XAML，但它不起作用

  <Grid>
    <Button Width="150" Height="50">
        <Button.Template>
            <ControlTemplate>
                <Label Content="Helllo"/>
            </ControlTemplate>
        </Button.Template>

        <Button.Style>
            <Style TargetType="Button">
                <Setter Property="Background" Value="Green"/>  
                <Style.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="AliceBlue"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </Button.Style>

    </Button>
</Grid>

【问题讨论】：

你试过搜索吗？参考：stackoverflow.com/a/12388141/3660930
将 button.style 中的所有内容移到按钮外的 grid.resources 中

标签： c# .net wpf

【解决方案1】：

您的样式放置没有问题。

ControlTemplate 已被覆盖，因此您需要将 Label 的背景属性与按钮的背景属性进行模板绑定。

这就是你的做法：

<ControlTemplate>
    <Label Content="Helllo" Background="{TemplateBinding Background}"/>
</ControlTemplate>

【讨论】：

【解决方案2】：

使用 ContentTemplate 代替 ControlTemplate 它将使您的按钮事件保持其样式。参考请参阅Difference between ContentTemplate and Template

 <Button Width="150" Height="50">
    <Button.ContentTemplate>
            <DataTemplate>
               <Label Content="Helllo"/>
            </DataTemplate>
        </Button.ContentTemplate>

    <Button.Style>
        <Style TargetType="Button">
            <Setter Property="Background" Value="Green"/>  
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="AliceBlue"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Button.Style>

</Button>

【讨论】：

【解决方案3】：

当您覆盖控件模板时，您需要为该控件实现整个默认控件模板。这是链接：http://msdn.microsoft.com/en-us/library/ms753328%28v=vs.110%29.aspx

我正在提供对我来说可以正常工作的示例代码：

<Grid>
    <Grid.Resources>
        <SolidColorBrush x:Key="ControlBackground_MouseOver" Color="AliceBlue"/>
    </Grid.Resources>
        <Button Width="150" Height="50" Content="Hello" >
        <Button.Template>

                    <ControlTemplate  TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="MouseOver">

                                        <Storyboard>

                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="Background" Duration="0:0:0">
                                            <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{StaticResource ControlBackground_MouseOver}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>

                                </VisualStateGroup>

                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="Border"
                BorderThickness="{TemplateBinding BorderThickness}"
                BorderBrush="{TemplateBinding BorderBrush}"
                Background="{TemplateBinding Background}"
                />
                            <ContentControl x:Name="ContentElement"
                IsTabStop="False"
                Content="{TemplateBinding Content}"
                ContentTemplate="{TemplateBinding ContentTemplate}"
                Foreground="{TemplateBinding Foreground}"
                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                Margin="{TemplateBinding Padding}"
                VerticalAlignment="{TemplateBinding VerticalContentAlignment}">

                            </ContentControl>
                            <Border
                BorderThickness="1"

                Opacity="0"
                x:Name="FocusState"
                />
                        </Grid>
                    </ControlTemplate>

        </Button.Template>

        <Button.Style>
            <Style TargetType="Button">
                <Setter Property="Background" Value="Green"/>

            </Style>
        </Button.Style>

    </Button>

</Grid>

如果你只想在按钮上显示文本，你可以使用按钮的内容属性。请让我知道这是否是您要找的。谢谢。

【讨论】：