Question

因此，我决定尝试为按钮提供自定义样式。但是，当我为它分配样式时，它将不使用它，为什么呢？

我也尝试创建一个带有文本框，图像和带有标签的椭圆的按钮。我希望将鼠标悬停在按钮上时更改按钮的颜色，但是它会使我的按钮消失。

窗口资源

<Window.Resources>
    <Style x:Key="MenuButton" TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <ControlTemplate.Triggers>
                        <Trigger Property="Background" Value="#272727">
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Foreground" Value="Gray"></Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

然后是按钮

<Button Background="Transparent"
                        Style="{StaticResource MenuButton}"
                        Height="25"
                        BorderThickness="0">
                    <StackPanel Orientation="Horizontal">
                        <Image Source="Resources/earth-globe.png"
                               Height="20"
                               Width="20"
                               HorizontalAlignment="Left"
                               Margin="0,0,5,0"
                               UseLayoutRounding="True"
                               RenderOptions.BitmapScalingMode="Fant"/>
                        <Label Content="Websites"
                               Foreground="White"
                               VerticalAlignment="Center"

                               Width="100"
                               Height="24"/>

                        <Grid HorizontalAlignment="Right" Height="20" Width="20">
                            <Ellipse Width="20"
                                     Height="20"
                                     Fill="#555555"
                                     Margin="0,0,0,0">
                            </Ellipse>
                            <TextBlock Text="10"
                                       HorizontalAlignment="Center" 
                                       VerticalAlignment="Center"
                                       FontSize="12"
                                       TextAlignment="Center"
                                       Foreground="White"/>
                        </Grid>

                    </StackPanel>
                </Button>

Answer 1

您不希望将该样式放在样式的模板部分中，因为模板用于自定义完整控件外观（即，将按钮变成一个圆圈），并且使开发人员在样式上更具灵活性。您可以做的是将样式应用于按钮。而是尝试以下方法：

<Window.Resources>
    <Style x:Key="MenuButton" TargetType="{x:Type Button}">
        <Setter Property="Background" Value="#272727" />
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Foreground" Value="Gray" />
            </Trigger>
        </Style.Triggers>
    </Style>
</Window.Resources>

但是，如果确实要修改模板属性，则还需要添加<ContentPresenter />的有效方法。请参见以下示例：

<Window.Resources>
    <Style x:Key="MenuButton" TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <ContentPresenter />
                    <ControlTemplate.Triggers>
                        <Trigger Property="Background" Value="#272727">
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Foreground" Value="Gray"></Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

但是，使用最小的样式修改模板似乎是一个很差的用例，我建议使用第一种方法。

Answer 2

将丢失的ContentPresenter添加到您的DataTemplate。

<Style x:Key="MenuButton" TargetType="{x:Type Button}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <ContentPresenter /> <!--This thing was missing-->
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="RED" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

为什么我的按钮不使用我创建的样式？

2 个答案: