如何在WPF中將樣式應用於按鈕？

Question

我正在嘗試將樣式應用於按鈕，我們如何實現這一目標？

下面是我的示例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>

Answer 1

你的風格定位沒有錯。

重寫ControlTemplate，因此您需要使用按鈕的background屬性將Label的背景屬性綁定到模板 。

這是你如何做到的：

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

Answer 2

使用ContentTemplate代替ControlTemplate它會使你的按鈕事件保持其風格。參考參見ContentTemplate和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>

Answer 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>

如果只想在按鈕上顯示文本，可以只使用按鈕的內容屬性。 如果這是你想要的，請告訴我。 謝謝。