为什么我的 WPF DataGrid 的垂直 ScrollBar 在包含在网格中时不显示其全宽？

Question

我有一个 WPF 用户控件，其中包含一个包裹在网格中的 DataGrid。 用户控件托管在我的主应用程序窗口中的 TabControl 中，包装在 StackPanel 中。

我遇到的问题是我无法让 DataGrid 的垂直滚动条完全显示。它被“剪裁”，因此只有 1/2 的宽度可见。

这是我的 UserControl 的 XAML 定义：

<UserControl x:Class="Sample.Views.SampleView"
             Width="{Binding RelativeSource={RelativeSource FindAncestor, 
                        AncestorType={x:Type StackPanel}},Path=ActualWidth}"
             Height="{Binding RelativeSource={RelativeSource FindAncestor, 
                        AncestorType={x:Type StackPanel}},Path=ActualHeight}">
    <Grid Name="PastDueInvoicesGrid" >
        <DataGrid Name="PastDueInvoicesDataGrid" 
                AutoGenerateColumns="False"
                Margin="0,0,0,3"  
                GridLinesVisibility="None"
                IsReadOnly="True"
                SelectionMode="Extended"
                SelectionUnit="CellOrRowHeader"
                HorizontalScrollBarVisibility="Auto"  
                VerticalScrollBarVisibility="Auto" 
                AllowDrop="False" >
        </DataGrid>
    </Grid>
</UserControl>

这就是 StackPanel/TabControl 的定义：

<StackPanel Grid.Row="1" x:Name="stackPanelAccountDetailViewContainer"
  Orientation="Vertical">
  <TabControl x:Name="tabContainerContainer"
   TabStripPlacement="Bottom" 
   Height="{Binding Path=ActualHeight,
     RelativeSource={RelativeSource Mode=FindAncestor,
     AncestorType={x:Type StackPanel}}}"
    Width="{Binding Path=ActualWidth,
    RelativeSource={RelativeSource Mode=FindAncestor,
    AncestorType={x:Type StackPanel}}}">
   </TabControl>
</StackPanel>

我尝试了几种不同的方法，但我似乎无法让垂直滚动条显示其全宽。它的水平边界似乎超过了容器的宽度。

如何使其正确显示？

Answer 1

这里有一些要点。不要设置

Width

的

Height

（或

TabControl

）或

UserControl

。无论如何，它们都会拉伸以填充父级

StackPanel

：

<StackPanel Grid.Row="1" x:Name="stackPanelAccountDetailViewContainer" Orientation="Vertical">
    <TabControl x:Name="tabContainerContainer" TabStripPlacement="Bottom">
    </TabControl>
</StackPanel>

<UserControl x:Class="Sample.Views.SampleView">
    <Grid Name="PastDueInvoicesGrid" >
        <DataGrid Name="PastDueInvoicesDataGrid" 
                AutoGenerateColumns="False"
                Margin="0,0,0,3"  
                GridLinesVisibility="None"
                IsReadOnly="True"
                SelectionMode="Extended"
                SelectionUnit="CellOrRowHeader"
                HorizontalScrollBarVisibility="Auto"  
                VerticalScrollBarVisibility="Auto" 
                AllowDrop="False" >
        </DataGrid>
    </Grid>
</UserControl>

您也可以尝试在

Margin

中添加

Padding

或

UserControl

：

<UserControl x:Class="Sample.Views.SampleView" ... Padding="5">