WPF在DataGrid单元格MouseOver上显示弹出窗口

时间:2022-08-24 11:34:06

I would like the following functionality: I have a datagrid, and when I go with my mouse pointer over a cell, I would my program to show a popup screen with information. When my mouse leaves the cell, obviously I want the popup to disappear. I hope I can do this only in XAML code.

我想要以下功能:我有一个数据网格,当我用鼠标指针移动到一个单元格时,我会让我的程序显示一个包含信息的弹出屏幕。当我的鼠标离开细胞时,显然我希望弹出窗口消失。我希望我只能在XAML代码中执行此操作。

This is my popup in XAML:

这是我在XAML中的弹出窗口:

<Popup x:Name="_popup_agreementDetails" Placement="Center" AllowsTransparency="True"
               HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="2" Margin="46,333,102,172" Grid.Row="2" IsOpen="{Binding IsChecked, ElementName=button}">
    <my:UC1001_AgreementDetails_View Background="#FFF" Opacity="0.88" />
</Popup>

As you can see, the popup shows a user control I made. This is my datagrid:

如您所见,弹出窗口显示了我制作的用户控件。这是我的datagrid:

 <DataGrid x:Name="employeeGrid" Height="250" Margin="25,0,10,0" ColumnHeaderStyle="{DynamicResource CustomColumnHeader}">
     <DataGrid.Columns>
         <DataGridTextColumn Header="Naam" Width="150"/>
         <DataGridTextColumn Header="Januari" Width="*"/>
         <DataGridTextColumn Header="Februari" Width="*"/>
         <DataGridTextColumn Header="Maart" Width="*"/>
         <DataGridTextColumn Header="April" Width="*"/>
         <DataGridTextColumn Header="Mei" Width="*"/>
         <DataGridTextColumn Header="Juni" Width="*"/>
         <DataGridTextColumn Header="Juli" Width="*"/>
         <DataGridTextColumn Header="Augustus" Width="*"/>
         <DataGridTextColumn Header="September" Width="*"/>
         <DataGridTextColumn Header="Oktober" Width="*"/>
         <DataGridTextColumn Header="November" Width="*"/>
         <DataGridTextColumn Header="December" Width="*"/>
     </DataGrid.Columns>
 </DataGrid>

I read some stuff about triggers and stuff to show the popup, but I don't know how to implement it on a datagrid cell. The popup should show on every cell. The information shown on the popup depends on the hovered cell.

我读了一些关于触发器和东西的东西来显示弹出窗口,但我不知道如何在datagrid单元格上实现它。弹出窗口应显示在每个单元格上。弹出窗口上显示的信息取决于悬停的单元格。

Does anyone know how to do this in XAML?

有谁知道如何在XAML中执行此操作?

1 个解决方案

#1


7  

You said ....

你说 ....

when I go with my mouse pointer over a cell, I would my program to show a popup screen with information. When my mouse leaves the cell, obviously I want the popup to disappear.

当我用鼠标指针移动到一个单元格上时,我会在程序中显示一个包含信息的弹出屏幕。当我的鼠标离开细胞时,显然我希望弹出窗口消失。

I guess even a DataGridCell.ToolTip should suffice too in that case. Tooltips can show any type of content .... See this fancy tooltip tutorial...

我想在这种情况下,即使是DataGridCell.ToolTip也应该足够了。工具提示可以显示任何类型的内容....查看这个花哨的工具提示教程...

And for setting tooltip to all datagrid cells... use this code...

并将工具提示设置为所有datagrid单元格...使用此代码...

   <DataGrid ... >
       <DataGrid.CellStyle>
          <Style>
             <Setter Property="DataGridCell.ToolTip">
                <Setter.Value>
                   <my:UC1001_AgreementDetails_View
                           Background="#FFF"
                           Opacity="0.88" />
                </Setter.Value>
              </Setter>
            </Style>
       </DataGrid.CellStyle>
       ...
    </DataGrid> 

Hope that helps,

希望有所帮助,

#1


7  

You said ....

你说 ....

when I go with my mouse pointer over a cell, I would my program to show a popup screen with information. When my mouse leaves the cell, obviously I want the popup to disappear.

当我用鼠标指针移动到一个单元格上时,我会在程序中显示一个包含信息的弹出屏幕。当我的鼠标离开细胞时,显然我希望弹出窗口消失。

I guess even a DataGridCell.ToolTip should suffice too in that case. Tooltips can show any type of content .... See this fancy tooltip tutorial...

我想在这种情况下,即使是DataGridCell.ToolTip也应该足够了。工具提示可以显示任何类型的内容....查看这个花哨的工具提示教程...

And for setting tooltip to all datagrid cells... use this code...

并将工具提示设置为所有datagrid单元格...使用此代码...

   <DataGrid ... >
       <DataGrid.CellStyle>
          <Style>
             <Setter Property="DataGridCell.ToolTip">
                <Setter.Value>
                   <my:UC1001_AgreementDetails_View
                           Background="#FFF"
                           Opacity="0.88" />
                </Setter.Value>
              </Setter>
            </Style>
       </DataGrid.CellStyle>
       ...
    </DataGrid> 

Hope that helps,

希望有所帮助,