如何让含Grid、StackPanel、ListView的长UWP XAML页面整体垂直滚动？

这个问题我碰到过好多次了，核心就是ListView自带的ScrollViewer和你外层的ScrollViewer冲突了！默认情况下，ListView的模板里已经包含了一个ScrollViewer，它会自动占据可用空间并处理自身的滚动。当你把整个布局（包括ListView）套在外层ScrollViewer里时，ListView会“认为”自己已经有足够的空间展示内容（甚至会自动撑满父容器的高度），导致外层ScrollViewer感知不到整体内容超出视口，自然就不会触发滚动。

下面是具体的解决步骤，亲测有效：

1. 禁用ListView内部的ScrollViewer #

通过附加属性直接关掉ListView自带的垂直滚动功能，让它只负责渲染内容，把滚动的控制权交给外层的ScrollViewer：

• 设置 ScrollViewer.VerticalScrollMode="Disabled"：彻底禁用内部垂直滚动
• 设置 ScrollViewer.VerticalScrollBarVisibility="Hidden"：隐藏内部的滚动条（避免视觉上的混乱）

2. 让ListView自适应内容高度 #

确保ListView的高度是自适应内容的，不要给它设置固定高度或者用*占满空间。如果你的外层容器是StackPanel，默认就会自动让ListView根据item数量撑开高度；如果是Grid，要把ListView所在行的Height设为Auto，而不是*。

完整示例代码 #

<ScrollViewer VerticalScrollMode="Enabled" 
              VerticalScrollBarVisibility="Auto">
    <!-- 用StackPanel作为外层容器，自动撑开所有内容的高度 -->
    <StackPanel>
        <!-- 你的固定内容控件 -->
        <TextBlock Text="顶部固定标题" 
                   FontSize="24" 
                   Margin="16"/>
        <TextBox PlaceholderText="固定输入框" 
                 Margin="16"
                 Height="40"/>
        <Button Content="固定操作按钮" 
                Margin="16"
                Width="120"/>
        
        <!-- 处理后的ListView -->
        <ListView ScrollViewer.VerticalScrollMode="Disabled"
                  ScrollViewer.VerticalScrollBarVisibility="Hidden"
                  ItemsSource="{Binding YourItemList}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid Margin="16"
                          Height="80"
                          Background="#F0F0F0">
                        <TextBlock Text="{Binding ItemName}"
                                   FontSize="18"
                                   VerticalAlignment="Center"/>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
            <!-- 移除ListView的默认边框和内边距，让布局更连贯 -->
            <ListView.BorderThickness>
                <Thickness>0</Thickness>
            </ListView.BorderThickness>
            <ListView.Padding>
                <Thickness>0</Thickness>
            </ListView.Padding>
        </ListView>
    </StackPanel>
</ScrollViewer>

额外注意事项 #

• 不要给外层ScrollViewer设置固定高度，让它自动占满父容器的可用空间（比如放在Grid的*行里），这样才能正确判断内容是否超出视口。
• 如果你的固定内容里有需要占满宽度的控件（比如TextBox），确保外层StackPanel的Width是自适应的，或者给控件设置HorizontalAlignment="Stretch"。

内容的提问来源于stack exchange，提问作者Rick Engle