ScrollViewer嵌套ListView致虚拟化失效，求单滚动条高性能布局方案

页面控件垂直顺序如下：

TextBlock
Some Images
TextBlock
Some Images
ListView

由于TextBlock和图片总高度超出屏幕，我采用了如下ScrollViewer布局：

<ScrollViewer>
    <Grid>
          <Grid.RowDefinitions>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="Auto"></RowDefinition>
                <RowDefinition Height="*"></RowDefinition>
          </Grid.RowDefinitions>
          <TextBlock Grid.Row="0" Text=...></TextBlock>
          <Image Grid.Row="1" Source=...></Image>
          <ListView Grid.Row="2"></ListView>
    </Grid>
</ScrollViewer>

但该布局会破坏ListView的虚拟化功能（ListView包含约200项数据）。需要找到方案，让ListView作为Grid最后一项，同时满足：

• 具备高性能（保留虚拟化）
• 显示所有行（不想设置ListView的MaxHeight，避免双滚动条混淆）
• 页面仅一个垂直滚动条

核心思路是不让外层ScrollViewer无限撑开ListView的高度，而是让ListView占据剩余可用空间，同时保留页面唯一滚动条。以下是两种可行方案：

方式一：用DockPanel替代Grid布局 #

DockPanel的LastChildFill="True"属性会自动让最后一个子元素填充剩余空间，且不会强制拉满其内容高度，刚好适配ListView虚拟化需求：

<ScrollViewer>
    <DockPanel LastChildFill="True">
        <!-- 顶部控件依次停靠在上方 -->
        <TextBlock DockPanel.Dock="Top" Text="..."></TextBlock>
        <Image DockPanel.Dock="Top" Source="..."></Image>
        <TextBlock DockPanel.Dock="Top" Text="..."></TextBlock>
        <Image DockPanel.Dock="Top" Source="..."></Image>
        <!-- ListView自动填充剩余空间，高度受ScrollViewer限制，虚拟化生效 -->
        <ListView></ListView>
    </DockPanel>
</ScrollViewer>

方式二：修复Grid布局的高度问题 #

原Grid中RowDefinition Height="*"在ScrollViewer内会被无限撑开（因为ScrollViewer无固定高度限制），导致ListView高度拉满所有内容，虚拟化失效。可通过以下两种调整方式解决：

方案2.1：限制Grid高度并设置对齐方式 #

<ScrollViewer>
    <Grid Height="Auto" VerticalAlignment="Top">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <TextBlock Grid.Row="0" Text="..."></TextBlock>
        <Image Grid.Row="1" Source="..."></Image>
        <TextBlock Grid.Row="2" Text="..."></TextBlock>
        <Image Grid.Row="3" Source="..."></Image>
        <ListView Grid.Row="4" VerticalAlignment="Stretch"></ListView>
    </Grid>
</ScrollViewer>

方案2.2：绑定Grid的最大高度到ScrollViewer可视高度 #

<ScrollViewer>
    <Grid MaxHeight="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType=ScrollViewer}}">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <TextBlock Grid.Row="0" Text="..."></TextBlock>
        <Image Grid.Row="1" Source="..."></Image>
        <TextBlock Grid.Row="2" Text="..."></TextBlock>
        <Image Grid.Row="3" Source="..."></Image>
        <ListView Grid.Row="4"></ListView>
    </Grid>
</ScrollViewer>

关键原理 #

ListView虚拟化生效的前提是自身高度被明确限制（不能无限扩展），这样它才会只渲染可视区域内的项。上述方案均通过让ListView高度受限于外层ScrollViewer的可视空间，既保证顶部内容可随页面滚动，又让ListView维持虚拟化的高性能。

内容的提问来源于stack exchange，提问作者Phil N