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

Posted 2023-04-12

【中文标题】选择 DataGridRow 时如何仅显示 RowDetails（而不是行）？

【英文标题】：How to show only RowDetails (not the row) when a DataGridRow is selected?

【发布时间】：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

【参考方案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>

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