Question

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.

This is my popup in 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 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.

Does anyone know how to do this in XAML?

Answer 1

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…

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

   <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,