【问题标题】:How to change tile background on mouse over in WPF?如何在WPF中更改鼠标悬停的平铺背景?
【发布时间】:2016-04-17 09:51:11
【问题描述】:

使用本文提供的代码:

lighten background color on button click per binding with converter

我编写了以下代码来更改 MouseOver 上 MahApps Tile 的背景:

<local:ColorLightConverter x:Key="colorLightConverter" />
    <Style x:Key="aaa" TargetType="mah:Tile">
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="{Binding Path=Background.Color, RelativeSource={RelativeSource TemplatedParent}, Mode=OneTime, Converter={StaticResource colorLightConverter}}" />
            </Trigger>
        </Style.Triggers>
    </Style>

色光转换器与上述帖子中所写的相同,并且在 Mahapps Metro Tile 上使用了该样式。该代码不起作用,因为鼠标悬停上的磁贴闪烁。另外,在转换器内放置一个断点,我看到它没有到达。

我做错了什么?

【问题讨论】:

  • 您设置了样式的键。您是否还使用该键将样式设置为瓷砖?你是如何设置风格的?
  • @Siderite Zackwehdex 样式设置如下:
  • 为什么是OneTime绑定模式?
  • @Siderite Zackwehdex 根据我提到的帖子,据我了解,这种模式应该会停止闪烁。所有模式我都试过了,即使没有设置任何模式,它仍然会闪烁。

标签: wpf xaml tile mahapps.metro


【解决方案1】:

我可以用 Tile 控件重现该问题。它从不进入转换器代码,因为 TemplatedParent 为空。当我将 RelativeSource 更改为 AncestorType={x:Type StackPanel} 时,闪烁消失了,并且到达了转换器中的断点。您可以通过添加到绑定FallbackValue=Red 来检查您是否属于这种情况,在这种情况下,鼠标悬停时的颜色将为红色,表示绑定错误。

这是我的工作 XAML:

<Window.Resources>
        <local:ColorLightConverter x:Key="colorLightConverter" />
        <Style x:Key="aaa" TargetType="{x:Type Control}">
            <Setter Property="Background" Value="White"/>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="{Binding Path=Background.Color, RelativeSource={RelativeSource AncestorType={x:Type StackPanel}}, Converter={StaticResource colorLightConverter},FallbackValue=Red}" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <StackPanel Background="DarkGoldenrod">
        <mah:Tile Title="Hello!" Style="{StaticResource aaa}" 
                    TiltFactor="2"
                    Width="100" Height="100" 
                    Count="1" x:Name="tile">
        </mah:Tile>
        <TextBox Width="100" Height="100" Style="{StaticResource aaa}">Test</TextBox>
    </StackPanel>

【讨论】:

  • 添加 FallbackValue=Red 后,确实在 MouseOver 上磁贴变为红色。那么问题与瓷砖有关吗?有什么解决办法吗?
  • 不,问题与绑定有关。对相对源使用另一种方式,它将起作用。什么类型的控件承载 Tiles?它与 Tiles 相关只是因为如果绑定失败,TextBox 不会闪烁,但绑定没有找到背景值的事实是问题。
  • 我明白了。磁贴由 StackPanel 托管。我正在使用此代码:Value="{Binding Path=Background.Color, RelativeSource={RelativeSource AncestorType={x:Type StackPanel}}, Mode=OneTime, FallbackValue=red, Converter={StaticResource colorLightConverter}}",但是我仍然得到红色背景并且没有达到断点(绑定问题)。如果我删除后备值,闪烁仍然存在。
  • StackPanel 是否设置了背景颜色?还有,去掉绑定模式,比较混乱。
  • 如果您知道要从中获取颜色的控件的名称,也可以在绑定中使用 ElementName。
【解决方案2】:

好的。所以这是 MainWindow.xaml:

<mah:MetroWindow 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:NQR_GUI_WPF"
    xmlns:prop="clr-namespace:NQR_GUI_WPF.Properties"
    xmlns:Custom="http://metro.mahapps.com/winfx/xaml/controls" 
    x:Class="NQR_GUI_WPF.MainWindow"
    xmlns:mah="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
    mc:Ignorable="d" Height="600" Width="800" ResizeMode="CanResizeWithGrip" WindowStartupLocation="CenterScreen" TitlebarHeight="28"
    GlowBrush="{DynamicResource AccentColorBrush}" ShowIconOnTitleBar="False" Icon="Pictures/icon.ico"
>
<Window.Resources>
    <local:ColorLightConverter x:Key="colorLightConverter" />
    <Style x:Key="aaa" TargetType="{x:Type Control}">
        <Setter Property="Background" Value="White"/>
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="{Binding Path=Background.Color, Mode=OneTime, RelativeSource={RelativeSource AncestorType={x:Type StackPanel}}, Converter={StaticResource colorLightConverter}}" />
            </Trigger>
        </Style.Triggers>
    </Style>
</Window.Resources>
<StackPanel Background="DarkGoldenrod">
    <mah:Tile Title="Hello!" Style="{StaticResource aaa}"
                TiltFactor="2"
                Width="100" Height="100" 
                Count="1" x:Name="tile">
    </mah:Tile>
    <TextBox Width="100" Height="100" Style="{StaticResource aaa}">Test</TextBox>
</StackPanel>

这是 App.xaml

<Application x:Class="NQR_GUI_WPF.App"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:local="clr-namespace:NQR_GUI_WPF"
         xmlns:mah="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
         StartupUri="MainWindow.xaml">
<Application.Resources>
    <ResourceDictionary>
        <BitmapImage x:Key="settingsIcon" UriSource="Pictures/settings1_unpressed.png" />
        <ResourceDictionary.MergedDictionaries>
            <!-- MahApps.Metro resource dictionaries. Make sure that all file names are Case Sensitive! -->
            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
            <!-- Accent and AppTheme setting -->
            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Blue.xaml" />
            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

这是颜色转换器代码:

public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
     {
         Color color = (Color)value;
         System.Drawing.Color darkColor = System.Windows.Forms.ControlPaint.Dark(System.Drawing.Color.FromArgb(color.A, color.R, color.G, color.B), 0.1f);
         return System.Drawing.Color.FromArgb(darkColor.A, darkColor.R, darkColor.G, darkColor.B);
     }

我正在使用 MahApps 1.2.4.0。

【讨论】:

  • 您的转换器错误。它返回 System.Drawing.Color,而不是 System.Windows.Media.Brush。将最后一行替换为:return new SolidColorBrush(Color.FromArgb(color.A, color.R, color.G, color.B));
  • @Siderite Zackwehdex 此解决方案在 MouseOver 上用主机控件(在本例中为 StackPanel)的颜色替换磁贴的颜色。是否可以用较暗的颜色替换初始平铺颜色(这是颜色转换器的目的)?
  • 当然,只需在样式的初始设置器中添加绑定,就像在触发器的设置器中一样。
  • @Siderite Zackwehdex 我不知道如何正确编写绑定。基本上,我希望能够:在设计器视图中设置磁贴的背景,然后将此样式应用于磁贴,并在运行时在 MouseOver 上查看其背景变暗(突出显示磁贴)并在鼠标存在磁贴(宿主控件的背景不应影响此逻辑)。这是我的代码(不起作用): 我做错了什么?
  • 这是问题的一部分。这不是一个答案。请将整个问题放在问题中,而不是答案中。谢谢。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-01-14
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-10-16
相关资源
最近更新 更多