使用ScrollView创建用户控件

Posted 2021-04-16

我有一个WPF项目。

在这个项目中，我有一个UserControl，其StackPanel包含各种元素。它位于网格的单元格内。当我调整Windwo的大小并且Cell变小以适合Stackpanel时，我希望scrollview接管。

我尝试将TheUserControl放在一个但是它似乎只适用于Set size。我需要它来适应动态单元格大小。我在网上找到的所有“解决方案”对于这样一个简单的commen问题都是不必要的困难解决方法。所以我很确定有一种简单的方法来实现这种行为。

伪代码

UserControl：

<UserControl x:class=x.TheUserControl>
    <StackPanel>
        <Label Content="Label 01 />
        <Label Content="Label 02 />
        <Label Content="Label 03 />
                     .
                     .
                     .
        <Label Content="Label n />
    </StackPanel>
</UserControl>

窗户：

<Window x:Class="x.MainWindow>
<Grid>

    <Grid.RowDefinitions>
       <RowDefinition Height="auto" />
       <RowDefinition Height="*" />
    </Grid.RowDefinitions>

    <Label Content="Header" />

    <ScrollView Grid.Row="1">
        <x:TheUserControl />
    </ScrollView>

</Window>

我非常确定当我将StackPAnel直接放入ScrollView时，ScrollView的工作正常，那么为什么在中间使用UserControl这么复杂呢？

我没有意识到ScrollView中有一些明显的行为，如果有人能给我一个更好的方法或解释为什么它会这样做，我会很高兴。

答案

请尝试在usercontrol中使用ScrollViewer并使用Horizo​​ntalScrollBarVisibility和VerticalScrollBarVisibility：

用户控件：

<UserControl x:Class="WpfApp1.TheUserControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:WpfApp1"
             >
    <Grid>
        <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
            <StackPanel Orientation="Vertical"  Background="LightGray">
                <Label Content="Label 01" />
                <Label Content="Label 02" />
                <Label Content="Label 03" />
                <Label Content="Label n" />
            </StackPanel>
        </ScrollViewer>
    </Grid>
</UserControl>

主窗口：

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" >
    <Grid Background="Aqua">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <Label Content="Header" Grid.Row="0" />
        <local:TheUserControl Grid.Row="1" />

    </Grid>
</Window>

结果，如果您调整窗口大小：