I need the Expand / Collapse for RowDetailsTemplate
Check this ...
OR
XAML :
<DataGrid Name="dg1" AutoGenerateColumns="False" SelectionMode="Single" CanUserAddRows="false" CanUserDeleteRows="False" SelectionUnit="FullRow" > <DataGrid.CellStyle> <Style TargetType="DataGridCell"> <Setter Property="BorderThickness" Value="0"/> </Style> </DataGrid.CellStyle> <DataGrid.RowHeaderTemplate> <DataTemplate> <Expander Expanded="Expander_Expanded" Collapsed="Expander_Collapsed"> </Expander> </DataTemplate> </DataGrid.RowHeaderTemplate> <DataGrid.Columns> <DataGridTextColumn Header="Name" IsReadOnly="True" Width="100" Binding="{Binding Name}" /> <DataGridTextColumn Header="Title" IsReadOnly="True" Width="100" Binding="{Binding Title}" /> <DataGridTextColumn Header="Job" IsReadOnly="True" Width="100" Binding="{Binding Job}" /> </DataGrid.Columns> <DataGrid.RowDetailsTemplate> <DataTemplate> <TextBlock Text="{Binding Isi, Converter={StaticResource ResourceKey=isiTextConverter}}" Margin="10,5,0,0" /> </DataTemplate> </DataGrid.RowDetailsTemplate></DataGrid>
MainWindow.xaml.cs
private void Expander_Expanded(object sender, RoutedEventArgs e){ for (var vis = sender as Visual; vis != null; vis = VisualTreeHelper.GetParent(vis) as Visual) if (vis is DataGridRow) { var row = (DataGridRow)vis; row.DetailsVisibility = row.DetailsVisibility == Visibility.Visible ? Visibility.Collapsed : Visibility.Visible; break; }}private void Expander_Collapsed(object sender, RoutedEventArgs e){ for (var vis = sender as Visual; vis != null; vis = VisualTreeHelper.GetParent(vis) as Visual) if (vis is DataGridRow) { var row = (DataGridRow)vis; row.DetailsVisibility = row.DetailsVisibility == Visibility.Visible ? Visibility.Collapsed : Visibility.Visible; break; }}
Output
Include Collapsed and expanded events as below
<Custom:DataGridTemplateColumn> <Custom:DataGridTemplateColumn.CellTemplate> <DataTemplate> <Expander Collapsed="exp_Collapsed" Expanded="exp_Expanded"/> </DataTemplate> </Custom:DataGridTemplateColumn.CellTemplate> </Custom:DataGridTemplateColumn>
In the code behind
private void exp_Collapsed(object sender, RoutedEventArgs e) { this.dataGrid1.RowDetailsVisibilityMode = DataGridRowDetailsVisibilityMode.Collapsed; } private void exp_Expanded(object sender, RoutedEventArgs e) { this.dataGrid1.RowDetailsVisibilityMode = DataGridRowDetailsVisibilityMode.VisibleWhenSelected; }
I have improved the previous answer :
Instead of using DataGrid.RowHeaderTemplate use DataGridTemplateColumn as below:
<DataGridTemplateColumn> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <Expander Expanded="Expander_OnExpanded" Collapsed="Expander_OnCollapsed"> </Expander> </DataTemplate> </DataGridTemplateColumn.CellTemplate></DataGridTemplateColumn>
Benifit is you need not to re position your mouse after clicking expander button.