0

我用谷歌搜索了很多，但我对这种情况一无所知。

我有几个Button不同Background颜色的 flat ，但是它们的悬停颜色都是相同的！我希望每个Button都有自己的基于其背景的悬停颜色，例如变亮一点。

我尝试过制作自定义样式并减少了OpacityinIsMouseOver触发器，但这不是我想要的，因为它还会影响按钮的内容，而不仅仅是背景颜色！

Win32 C# 应用程序有一个 Flat Appearance 属性，可以自动完成这项工作。当您为按钮选择颜色BackColor并将按钮设置为平面时，它会处理所有状态颜色（悬停颜色，禁用颜色，...），但是我不知道如何在 WPF 中执行此操作。

先感谢您

4

2 回答 2

4 
the hover color is the same for all of them!

这可能是因为在你Button的风格中，你只有一把 Background刷子。IsMouseOverTrue

because it also affects the content of the button and not only the background color

这可能是因为当Border您正在制作动画的面板（可能是 a ）也是内容控件（例如ContentPresenter, ContentControl）的父级时，因此Opaciy该内容控件的 也受到影响。

要解决这些问题，您只需要在与您的内容控件相同的级别创建一些视觉元素（例如Rectangles，Borders），并根据激活的触发器对其进行动画处理。

这是一个简单的例子。

<Window.Resources>
    <Style x:Key="FocusVisual">
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate>
                    <Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <SolidColorBrush x:Key="Button.Static.Background" Color="#FFDDDDDD"/>
    <SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/>
    <SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FFBEE6FD"/>
    <SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FF3C7FB1"/>
    <SolidColorBrush x:Key="Button.Pressed.Background" Color="#FF737B7F"/>
    <SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/>
    <SolidColorBrush x:Key="Button.Disabled.Background" Color="#FFF4F4F4"/>
    <SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/>
    <SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/>
    <Style x:Key="MyButtonStyle" TargetType="{x:Type Button}">
        <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
        <Setter Property="Background" Value="{StaticResource Button.Static.Background}"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Padding" Value="4"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Grid SnapsToDevicePixels="true">
                        <Rectangle x:Name="BackgroundVisual" Fill="{TemplateBinding Background}"/>
                        <Rectangle x:Name="PressedVisual" Fill="{DynamicResource Button.Pressed.Background}" Opacity="0"/>
                        <Rectangle x:Name="DisabledVisual" Fill="{DynamicResource Button.Disabled.Background}" Opacity="0"/>
                        <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsDefaulted" Value="true"/>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter Property="Opacity" TargetName="BackgroundVisual" Value="0.6"/>
                        </Trigger>
                        <Trigger Property="IsPressed" Value="true">
                            <Setter Property="Opacity" TargetName="PressedVisual" Value="1"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground}"/>
                            <Setter Property="Opacity" TargetName="DisabledVisual" Value="1"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="BorderThickness" Value="0"/>
    </Style>
</Window.Resources>

这是样式的外观。

在此处输入图像描述

希望这可以帮助！:)

于 2013-11-09T12:38:28.057 回答
0

看一下这个 ：

http://learnwpf.com/post/2006/03/06/How-do-I-change-an-items-appearance-on-mouseover-in-WPF.aspx

对于背景，您可以简单地设置“背景”属性，而不是设置“位图效果”属性。

希望这可以帮助

问候

于 2013-11-09T05:50:55.683 回答