在运行时更改网格的背景

Question

我的网格设置为浅灰色背景，我想知道当鼠标悬停在特定网格上时如何更改网格的背景。如果我将目标类型从边框更改为网格，目前我的屏幕会完全变黑：

我得到了什么

我想要的只是所有的浅灰色都变成黄色

XAML

<DataTemplate x:Key="PropertyNodeTemplate">
        <Grid VerticalAlignment="Top" HorizontalAlignment="Center" Background="LightGray">
            <Grid.RowDefinitions>
                <RowDefinition Height="50"/>
                <RowDefinition Height="50"/>
                <RowDefinition Height="50"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <Border VerticalAlignment="Center" Grid.Row="0">
                <Border.Style>
                    <Style TargetType="Border">
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding IsHighlighted}" Value="True">
                                <Setter Property="Background" Value="Yellow"></Setter>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Border.Style>
                <Label Name="PropertyTitle" Content="Property Shnarf" VerticalAlignment="Top" HorizontalAlignment="Center">
                </Label>
            </Border>
            <Button Name="AddScenario" Click="AddScenarioButton_OnClick" Grid.Row="3" BorderThickness="0">
                <Button.Style>
                    <Style TargetType="Button">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="Button">
                                    <Border BorderThickness="0">
                                        <ContentPresenter/>
                                    </Border>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding IsHighlighted}" Value="True">
                                <Setter Property="Visibility" Value="Visible"></Setter>
                            </DataTrigger>
                            <DataTrigger Binding="{Binding IsHighlighted}" Value="False">
                                <Setter Property="Visibility" Value="Hidden"></Setter>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Button.Style>
                <Border BorderThickness="1,1,1,1" VerticalAlignment="Center" Background="LightGray">
                    <Border.BorderBrush>
                        <DrawingBrush Viewport="8,8,8,8" ViewportUnits="Absolute" TileMode="Tile">
                            <DrawingBrush.Drawing>
                                <DrawingGroup>
                                    <GeometryDrawing Brush="LightGray">
                                        <GeometryDrawing.Geometry>
                                            <GeometryGroup>
                                                <RectangleGeometry Rect="0,0,50,50" />
                                                <RectangleGeometry Rect="50,50,50,50" />
                                            </GeometryGroup>
                                        </GeometryDrawing.Geometry>
                                    </GeometryDrawing>
                                </DrawingGroup>
                            </DrawingBrush.Drawing>
                        </DrawingBrush>
                    </Border.BorderBrush>
                    <StackPanel Margin="2" Width="120" Orientation="Horizontal" Tag="{Binding RelativeSource={RelativeSource AncestorType={x:Type syncfusion:Node}}}">
                        <Image Source="{StaticResource ImageBkgPlus}" Width="16" Height="16" Margin="5"/>
                        <Label Width="70" FontSize="10" VerticalAlignment="Center" Content="Add Scenario">
                        </Label>
                    </StackPanel>
                </Border>
            </Button>
        </Grid>
    </DataTemplate>

Answer 1

您的Border 仅位于网格的第 0 行，因此这是唯一响应您的DataTrigger 的部分。为什么不使用Grid.Style 而不是Border.Style：

<DataTemplate x:Key="PropertyNodeTemplate">
    <Grid VerticalAlignment="Top" HorizontalAlignment="Center">
        <Grid.RowDefinitions>
            <RowDefinition Height="50"/>
            <RowDefinition Height="50"/>
            <RowDefinition Height="50"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <Grid.Style>
          <Style TargetType="Grid">
            <Setter 
               Property="BackGround"
               Value="LightGray" />
            <Style.Triggers>
              <DataTrigger 
                Binding="{Binding IsHighlighted}" 
                value="True">
                <Setter 
                   Property="Background" 
                   Value="Yellow" />
              </DataTrigger>
            </Style.Triggers>
          </Style>
        </Border.Style>
      ...
    </Grid>
</DataTemplate>

您可以使用 IsMouseover，而不是 DataTrigger，这取决于您想要什么：WPF Grid IsMouseOver Property。