XAML DataGrid周围的WPF ScrollViewer会影响列宽

nhn9ugyo  于 2022-12-07  发布在  其他
关注(0)|答案(3)|浏览(172)

我在使用ScrollViewer滚动包含数据网格的用户控件时遇到问题。如果没有滚动查看器,列将按照我的要求填充数据网格,但添加滚动查看器后,列将缩小到~ 15 px。我能够简化布局,并且仍然可以重现此行为。
将数据网格宽度绑定到另一个控件时,列具有正常的宽度,但这与数据网格上的固定宽度具有相同的效果。我想我不是第一个遇到此问题的人。如何解决此问题,使网格根据可用空间调整其大小,并给予列提供成比例的宽度?
使用滚动查看器:x1c 0d1x和不带:

<Window x:Class="GridTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<ScrollViewer HorizontalScrollBarVisibility="Auto">
<Grid MinWidth="200">
    <DataGrid Margin="0" AutoGenerateColumns="False">
        <DataGrid.Columns>
            <DataGridCheckBoxColumn Header="Column A" Width="*"/>
            <DataGridCheckBoxColumn Header="Column B" Width="*"/>
        </DataGrid.Columns>
    </DataGrid>
</Grid>
</ScrollViewer>
7bsow1i6

7bsow1i61#

是的,我有这个问题前一段时间,我采取了变通办法,我会张贴在这里,以防万一它有用

<ScrollViewer HorizontalScrollBarVisibility="Auto">
    <Grid x:Name="grid" MinWidth="200">
        <DataGrid Width="{Binding ElementName=grid, Path=ActualWidth}">
            <DataGrid.Columns>
                <DataGridCheckBoxColumn Header="Column A" Width="1*"/>
                <DataGridCheckBoxColumn Header="Column B" Width="1*"/>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</ScrollViewer>

技巧是给予DataGrid一个宽度,在本例中,我绑定回包含的元素
或者,如果不使用HorizontalScrollBar,则可以禁用它,这将允许ScrollViewer计算宽度,从而允许DataGrid计算宽度。

wydwbb8l

wydwbb8l2#

上周我也经历了同样的事情。
通常,当您具有下列元素时会发生此问题:
1.未定义宽度的DataGrid,放置在HorizontalScrollBarVisibility属性设置为AutoScrollViewer
1.至少有一个DataGridColumn具有无限/未定义的宽度(例如:(一个月五个月一次)
实际上,解决方案取决于您的需求:

  • 当窗口显示时(即使没有显示数据),您希望DataGridColumns占用DataGrid的所有可用空间:在这种情况下,sa_ddam213的回答可以帮助您应对。
  • 或者,您不介意在最后一列和Windows第一次显示时的DataGrid右边框之间有一些空格。

对于最后一个选项,您只需要为DataGridColumns设置固定的宽度(或者如果您不想定义它,就不定义它,这并不重要,因为用户可以通过双击轻松地调整列的大小)。在这种情况下,您可以定义DataGrid而不定义宽度。
以下是一个示例:

<ScrollViewer HorizontalScrollBarVisibility="Auto">
    <Grid x:Name="grid" MinWidth="200">
        <DataGrid>
            <DataGrid.Columns>
                <DataGridCheckBoxColumn Header="Column A" Width="100"/>
                <DataGridCheckBoxColumn Header="Column B" />
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</ScrollViewer>

通过这种方式,如果列内容在列自动调整大小后溢出容器,则会出现一个水平滚动条。

vfh0ocws

vfh0ocws3#

解决方案防止了mardok提到的问题。

<ScrollViewer x:Name="Scroll"
                  HorizontalScrollBarVisibility="Auto"
                  VerticalScrollBarVisibility="Auto">
    <StackPanel Width="{Binding ElementName=Scroll, Path=ViewportWidth}"
                MinWidth="150">
        <TextBlock Text="Other UI Controls"/>
        <DataGrid>
            <DataGrid.Columns>
                <DataGridTextColumn Header="Col1" Width="*"/>
                <DataGridTextColumn Header="Col2" Width="50"/>
            </DataGrid.Columns>
        </DataGrid>
    </StackPanel>
</ScrollViewer>

1.将容器面板的宽度绑定到ScrollViewer的ViewportWidth
1.设置容器面板的MinWidth。

相关问题