首页 > 解决方案 > ScrollViewer 在 DockPanel 中不起作用

问题描述

我有下面的代码示例,其行为如下图所示。

<DockPanel LastChildFill="False" >
    <ScrollViewer DockPanel.Dock="Top">
        <ItemsControl>
            <Label Content ="First" BorderBrush="Violet" BorderThickness="2"/>
            <Label Content ="Second" BorderBrush="Black" BorderThickness="2"/>
            <Label Content ="Third" BorderBrush="Yellow" BorderThickness="2" />
            <Label Content ="Fourth" BorderBrush="Green" BorderThickness="2"/>
            <Label Content ="Fifth" BorderBrush="Maroon" BorderThickness="2"/>
        </ItemsControl>
    </ScrollViewer>
    <Button Height="50" DockPanel.Dock="Top">button</Button>
</DockPanel>

在此处输入图像描述

这里的问题是 Button 在调整大小期间被剪裁,然后 ScrollViewer 才激活。当空间不足时,如何防止 Button 剪辑和调整 ScrollViewer 的大小?

标签: wpf

解决方案


交换 DockPanel 子项的顺序并设置LastChildFillTrue使 ScrollViewer 填充。将 Button 停靠在Bottom并将 Dockpanel 设置VerticalAlignmentTop

<DockPanel LastChildFill="True" VerticalAlignment="Top">
    <Button Height="50" DockPanel.Dock="Bottom">button</Button>
    <ScrollViewer>
        <ItemsControl>
            <Label Content ="First" BorderBrush="Violet" BorderThickness="2"/>
            <Label Content ="Second" BorderBrush="Black" BorderThickness="2"/>
            <Label Content ="Third" BorderBrush="Yellow" BorderThickness="2"/>
            <Label Content ="Fourth" BorderBrush="Green" BorderThickness="2"/>
            <Label Content ="Fifth" BorderBrush="Maroon" BorderThickness="2"/>
        </ItemsControl>
    </ScrollViewer>
</DockPanel>

推荐阅读