选择 DataGridRow 时如何仅显示 RowDetails（而不是行）？答案

【问题标题】：How to show only RowDetails (not the row) when a DataGridRow is selected?选择 DataGridRow 时如何仅显示 RowDetails（而不是行）？
【发布时间】：2020-06-30 16:01:51
【问题描述】：

我收到了以下DataGrid：

<DataGrid ItemsSource="{Binding MyList}" AutoGenerateColumns="False" SelectionUnit="FullRow">
    <DataGrid.Columns>
        <DataGridTextColumn Header="Header" Binding="{Binding MainText}"/>
    </DataGrid.Columns>
    <DataGrid.RowDetailsTemplate>
        <DataTemplate DataType="{x:Type local:MyViewModel}">
            <TextBlock Text="{Binding DetailText}"/>
        </DataTemplate>
    </DataGrid.RowDetailsTemplate>
</DataGrid>

假设MyList 是MyViewModel 对象的集合：

public class MyViewModel {
    public string MainText { get; set; }
    public string DetailText { get; set; }
}

当用户单击行时，行的详细信息可见。是否有可能隐藏该行并仅显示选择的详细信息？

【问题讨论】：

"隐藏行，只显示选择的细节" -> 你的意思是用DataGrid.RowDetailsTemplate替换选定的行常规模板吗？
我认为是的。我只想查看选择的行详细信息。不是当前行本身与所有其他列。只是在“SecondTextInList”上绑定的 TextBlock

标签： c# wpf xaml datagrid rowdetailstemplate

【解决方案1】：

您可以编辑每个DataGridRow 的ControlTemplate 以在选中时隐藏其主要内容。

例如，您可以使用 MSDN 提供的 here 提供的 Style。这是一个很大的风格，所以我只会在这里粘贴重要的部分：

<Style TargetType="{x:Type DataGridRow}">
  <!-- ...some setters... -->
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type DataGridRow}">
        <Border x:Name="DGR_Border"
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}"
                SnapsToDevicePixels="True">
          <Border.Background>
              <!-- ... -->
          </Border.Background>
          <VisualStateManager.VisualStateGroups>
            <!-- ...some states... -->
          </VisualStateManager.VisualStateGroups>
          <SelectiveScrollingGrid>
            <SelectiveScrollingGrid.ColumnDefinitions>
              <ColumnDefinition Width="Auto" />
              <ColumnDefinition Width="*" />
            </SelectiveScrollingGrid.ColumnDefinitions>
            <SelectiveScrollingGrid.RowDefinitions>
              <RowDefinition Height="*" />
              <RowDefinition Height="Auto" />
            </SelectiveScrollingGrid.RowDefinitions>
            <DataGridCellsPresenter Grid.Column="1"
                                    ItemsPanel="{TemplateBinding ItemsPanel}"
                                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
            <DataGridDetailsPresenter Grid.Column="1"
                                      Grid.Row="1"
                                      Visibility="{TemplateBinding DetailsVisibility}"
                                      SelectiveScrollingGrid.SelectiveScrollingOrientation="{Binding AreRowDetailsFrozen, 
                                                    ConverterParameter={x:Static SelectiveScrollingOrientation.Vertical},
                                                    Converter={x:Static DataGrid.RowDetailsScrollingConverter}, 
                                                    RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}"/>
            <DataGridRowHeader Grid.RowSpan="2"
                               SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical"
                               Visibility="{Binding HeadersVisibility, 
                                            ConverterParameter={x:Static DataGridHeadersVisibility.Row}, 
                                            Converter={x:Static DataGrid.HeadersVisibilityConverter}, 
                                            RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" />
          </SelectiveScrollingGrid>
        </Border>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

关键是当DataGridRow被选中时，将DataGridCellsPresenter的Visibility改为Visibility.Collapsed。您可以通过在模板中添加以下 <DataGridCellsPresenter.Style> 标记来实现：

<DataGridCellsPresenter Grid.Column="1"
                        ItemsPanel="{TemplateBinding ItemsPanel}"
                        SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
    <DataGridCellsPresenter.Style>
        <Style TargetType="DataGridCellsPresenter">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=DataGridRow}}" Value="True">
                    <Setter Property="Visibility" Value="Collapsed" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </DataGridCellsPresenter.Style>
</DataGridCellsPresenter>

如果您再次测试应用程序，这将折叠所选行上的主要内容，因此仅显示详细信息行。

【讨论】：