鼠标悬停事件时，Grid Control的子按钮并不总是出现

Question

我正在使用DevExpress WPF控件，但这个问题似乎更多是在直接WPF的背景下进行的。

我使用的是DevExpress GridControl，其中一列包含WPF网格（ VendorMainGrid ），并带有ComboBoxEdit和SimpleButton（ MainButton ）作为子控件，每个在它自己的网格列中。

此外，ComboBoxEdit的下拉列表还具有由网格（ VendorItemGrid ）和TextBlock和SimpleButton（ ItemButton ）作为子控件的网格组成的每个项目。 ，每个都在自己的网格列中。

两个SimpleButton都使用DataTrigger来检查父网格的“ IsMouseOver ”属性的值，如果该值为True，则SimpleButton的可见性设置为 Visible < / strong>。

我正在尝试创建以下行为：在父网格（ VendorMainGrid或VendorItemGrid ）的 ANY 部分的MouseOver事件上，网格子SimpleButton变得可见。 >

但是，我看到的行为是，仅当光标位于TextBlock或ComboBoxEdit上方时，SimpleButton才可见。 SimpleButton是其父Grid的子级，考虑到DataTrigger，我不明白为什么当光标在其上方时，SimpleButton不可见。

定义此列的DataTemplate如下所示：

        <DataTemplate x:Key="VendorComboColumnTemplate">
        <ContentControl>
            <dxg:GridColumn 
                Binding="{Binding RowData.Row.SelectedVendor, Mode=TwoWay}"
                Header="{Binding Path=(dxci:DependencyObjectExtensions.DataContext).Header, RelativeSource={RelativeSource Self}}" 
                Width="{Binding Path=(dxci:DependencyObjectExtensions.DataContext).Width, RelativeSource={RelativeSource Self}}">
                <dxg:GridColumn.CellTemplate>
                    <DataTemplate>
                        <Grid Name="VendorMainGrid" HorizontalAlignment="Stretch">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>

                            <!--The VendorMainGrid ComboBox-->
                            <dxe:ComboBoxEdit
                                Grid.Column="0"
                                IsTextEditable="False"
                                SelectedItem="{Binding RowData.Row.SelectedVendor, Mode=TwoWay}"
                                ItemsSource="{Binding RowData.Row.VendorList, Mode=TwoWay}"
                                >
                                <dxe:ComboBoxEdit.ItemContainerStyle>
                                    <Style TargetType="dxe:ComboBoxEditItem">
                                        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                                    </Style>
                                </dxe:ComboBoxEdit.ItemContainerStyle>

                                <!--The dropdown list item template-->
                                <dxe:ComboBoxEdit.ItemTemplate>
                                    <DataTemplate>
                                        <Grid Name="VendorItemGrid" HorizontalAlignment="Stretch">
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="*"/>
                                                <ColumnDefinition Width="Auto"/>
                                            </Grid.ColumnDefinitions>

                                            <TextBlock Grid.Column="0" HorizontalAlignment="Left" Text="{Binding}" />

                                            <dx:SimpleButton Grid.Column="1" Padding="0" Width="20" Height="20"
                                                Name="ItemButton"
                                                Command="{Binding Path=(dxe:BaseEdit.OwnerEdit).DataContext.RowData.Row.DeleteVendorCommand, RelativeSource={RelativeSource Self}}"
                                                CommandParameter="{Binding}"
                                                >
                                                <dx:SimpleButton.Content>
                                                    <Image Source="{dx:DXImage Image=Delete_16x16.png}"/>
                                                </dx:SimpleButton.Content>

                                                <dx:SimpleButton.Style>
                                                    <Style TargetType="dx:SimpleButton">
                                                        <Setter Property="Visibility" Value="Hidden"/>
                                                        <Style.Triggers>
                                                            <DataTrigger Binding="{Binding ElementName=VendorItemGrid,Path=IsMouseOver}" Value="True">
                                                                <Setter Property="Visibility" Value="Visible" />
                                                            </DataTrigger>
                                                        </Style.Triggers>
                                                    </Style>
                                                </dx:SimpleButton.Style>
                                            </dx:SimpleButton>

                                        </Grid>
                                    </DataTemplate>
                                </dxe:ComboBoxEdit.ItemTemplate>
                            </dxe:ComboBoxEdit>

                            <!--The VendorMainGrid Button-->
                            <dx:SimpleButton Grid.Column="1" Padding="0" Width="20" Height="20"
                                Name="MainButton"
                                Command="{Binding RowData.Row.AddVendorCommand}"
                                >
                                <dx:SimpleButton.Content>
                                    <Image Source="{dx:DXImage Image=Add_16x16.png}"/>
                                </dx:SimpleButton.Content>

                                <dx:SimpleButton.Style>
                                    <Style TargetType="dx:SimpleButton">
                                        <Setter Property="Visibility" Value="Hidden"/>
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding ElementName=VendorMainGrid,
                                                   Path=IsMouseOver}" Value="True">
                                                <Setter Property="Visibility" Value="Visible" />
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </dx:SimpleButton.Style>

                            </dx:SimpleButton>
                        </Grid>
                    </DataTemplate>
                </dxg:GridColumn.CellTemplate>
            </dxg:GridColumn>
        </ContentControl>
    </DataTemplate>

有人可以指出为什么我会看到此行为，以及如何更改DataTemplate以便获得所需的行为。

非常感谢您的帮助！

Answer 1

我刚刚发现，鼠标悬停无法按我希望的方式工作的原因是，我没有为父网格声明背景值。默认情况下，没有任何背景的控件的Background属性设置为“ null”，这使得无法进行测试。

要解决此问题，我只需要在父网格控件上声明Background =“ Transparent”，这将使点击测试有效并检测鼠标悬停。