更改 WPF 数据网格中滚动条的位置

Question

我的 C# WPF 应用程序中的数据网格存在布局问题。如果由于行太多而无法在数据网格中显示我的数据网格的内容，则会显示滚动查看器（和滚动条）。这是正确的方法，我对此感到高兴。

问题是，滚动查看器在我的数据网格中的位置是错误的。滚动查看器从标题行开始，但滚动条显示在我的内容的第一行中。标题中有一个白色的矩形。这是因为我的数据网格的背景是白色的。但我的标题背景是灰色的。

我上传了一张带有红色箭头的图片来澄清我的问题。白色矩形看起来真的很难看，所以在我看来，这是更改滚动查看器位置的更好方法，因此它从内容的第一行开始。也许还有另一种可能来解决问题？

“Datagrid with Scrollviewer”-图像：

感谢您的任何提示，这将帮助我解决问题！

此致， 闪光器

Answer 1

你可以为你的数据网格创建自己的样式，这是一个用 Blend 制作的样式，有两个更改，

看看

PART_VerticalScrollBar 的这两个更改 -> Grid.Row="0" 和 Grid.RowSpan="2"
对于包含 PART_Horizo​​ntalScrollBar 的网格 -> Grid.ColumnSpan="2"

这是完整的样式

<Style x:Key="myGridStyle"
        TargetType="{x:Type Controls:DataGrid}">
  <Setter Property="Background"
          Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" />
  <Setter Property="Foreground"
          Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
  <Setter Property="BorderBrush"
          Value="#FF688CAF" />
  <Setter Property="BorderThickness"
          Value="1" />
  <Setter Property="RowDetailsVisibilityMode"
          Value="VisibleWhenSelected" />
  <Setter Property="ScrollViewer.CanContentScroll"
          Value="True" />
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="{x:Type Controls:DataGrid}">
        <Border SnapsToDevicePixels="True"
                Background="{TemplateBinding Background}"
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}"
                Padding="{TemplateBinding Padding}">
          <ScrollViewer x:Name="DG_ScrollViewer"
                        Focusable="False">
            <ScrollViewer.Template>
              <ControlTemplate TargetType="{x:Type ScrollViewer}">
                <Grid>
                  <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="*" />
                    <RowDefinition Height="Auto" />
                  </Grid.RowDefinitions>
                  <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                  </Grid.ColumnDefinitions>
                  <Button Width="{Binding CellsPanelHorizontalOffset, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type Controls:DataGrid}}}"
                          Focusable="False">
                    <Button.Visibility>
                      <Binding Path="HeadersVisibility"
                                RelativeSource="{RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type Controls:DataGrid}}">
                        <Binding.ConverterParameter>
                          <Controls:DataGridHeadersVisibility>All</Controls:DataGridHeadersVisibility>
                        </Binding.ConverterParameter>
                      </Binding>
                    </Button.Visibility>
                    <Button.Template>
                      <ControlTemplate TargetType="{x:Type Button}">
                        <Grid>
                          <Rectangle x:Name="Border"
                                      Fill="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"
                                      SnapsToDevicePixels="True" />
                          <Polygon x:Name="Arrow"
                                    Fill="Black"
                                    Stretch="Uniform"
                                    HorizontalAlignment="Right"
                                    Margin="8,8,3,3"
                                    VerticalAlignment="Bottom"
                                    Opacity="0.15"
                                    Points="0,10 10,10 10,0" />
                        </Grid>
                        <ControlTemplate.Triggers>
                          <Trigger Property="IsMouseOver"
                                    Value="True">
                            <Setter Property="Stroke"
                                    TargetName="Border"
                                    Value="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" />
                          </Trigger>
                          <Trigger Property="IsPressed"
                                    Value="True">
                            <Setter Property="Fill"
                                    TargetName="Border"
                                    Value="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" />
                          </Trigger>
                          <Trigger Property="IsEnabled"
                                    Value="False">
                            <Setter Property="Visibility"
                                    TargetName="Arrow"
                                    Value="Collapsed" />
                          </Trigger>
                        </ControlTemplate.Triggers>
                      </ControlTemplate>
                    </Button.Template>
                    <Button.Command>
                      <RoutedCommand />
                    </Button.Command>
                  </Button>
                  <Custom:DataGridColumnHeadersPresenter x:Name="PART_ColumnHeadersPresenter"
                                                          Grid.Column="1">
                    <Custom:DataGridColumnHeadersPresenter.Visibility>
                      <Binding Path="HeadersVisibility"
                                RelativeSource="{RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type Controls:DataGrid}}">
                        <Binding.ConverterParameter>
                          <Controls:DataGridHeadersVisibility>Column</Controls:DataGridHeadersVisibility>
                        </Binding.ConverterParameter>
                      </Binding>
                    </Custom:DataGridColumnHeadersPresenter.Visibility>
                  </Custom:DataGridColumnHeadersPresenter>
                  <ScrollContentPresenter x:Name="PART_ScrollContentPresenter"
                                          Grid.ColumnSpan="2"
                                          Grid.Row="1"
                                          Content="{TemplateBinding Content}"
                                          ContentStringFormat="{TemplateBinding ContentStringFormat}"
                                          ContentTemplate="{TemplateBinding ContentTemplate}"
                                          CanContentScroll="{TemplateBinding CanContentScroll}"
                                          CanHorizontallyScroll="False"
                                          CanVerticallyScroll="False" />
                  <ScrollBar x:Name="PART_VerticalScrollBar"
                              Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
                              Grid.Column="2"
                              Grid.Row="0"
                              Grid.RowSpan="2"
                              Maximum="{TemplateBinding ScrollableHeight}"
                              Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
                              Orientation="Vertical"
                              ViewportSize="{TemplateBinding ViewportHeight}" />
                  <Grid Grid.Column="1"
                        Grid.ColumnSpan="2"
                        Grid.Row="2">
                    <Grid.ColumnDefinitions>
                      <ColumnDefinition Width="{Binding NonFrozenColumnsViewportHorizontalOffset, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type Controls:DataGrid}}}" />
                      <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <ScrollBar x:Name="PART_HorizontalScrollBar"
                                Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
                                Grid.Column="1"
                                Maximum="{TemplateBinding ScrollableWidth}"
                                Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
                                Orientation="Horizontal"
                                ViewportSize="{TemplateBinding ViewportWidth}" />
                  </Grid>
                </Grid>
              </ControlTemplate>
            </ScrollViewer.Template>
            <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
          </ScrollViewer>
        </Border>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
  <Style.Triggers>
    <Trigger Property="IsGrouping"
              Value="True">
      <Setter Property="ScrollViewer.CanContentScroll"
              Value="False" />
    </Trigger>
  </Style.Triggers>
</Style>

希望这有帮助

Answer 2

我一直讨厌那个角落。最简单的方法是将 DataGrid.Background 颜色设置为标题颜色，尽管这也会为空 DataGrid 的背景着色（如果它有固定的颜色）尺寸。您始终可以通过将 DataGrid 放置在不拉伸其子级的控件内来避免这种情况，例如 StackPanel 或带有 DockPanel code>LastChildFill="False"

<DockPanel LastChildFill="False">
    <DataGrid ItemsSource="{Binding MyCollection}" Background="Silver" />
</DockPanel>

替代方案包括覆盖 DataGrid 或其 ScrollBar 的样式或模板部分。混乱，但有可能。

Answer 3

将数据网格包含在 Scrollviewer 中并将其 Horizo​​ntalScrollBarVisibility 设置为隐藏
和 VerticalScrollBarVisibility 到 Auto.Hope 这会有所帮助。