WPF中如何实现多行横向ListView（类似文件资源管理器）

嘿，这个需求其实挺常见的，咱们完全不用自己手动折腾StackPanel的换行逻辑——WPF里早就有现成的控件能完美实现你要的效果！

核心思路就是把ListView默认的ItemPanelTemplate替换成WrapPanel，它天生就支持当子元素总宽度超出容器宽度时自动换行，正好匹配你想要的布局效果。

完整XAML示例代码 #

<ListView x:Name="FileExplorerStyleListView"
          SelectionMode="Single"
          <!-- 禁用横向滚动条，强制WrapPanel换行 -->
          ScrollViewer.HorizontalScrollBarVisibility="Disabled">
    <!-- 替换ItemPanel为WrapPanel -->
    <ListView.ItemPanel>
        <ItemsPanelTemplate>
            <WrapPanel Orientation="Horizontal" 
                       <!-- 绑定WrapPanel宽度到ListView的实际宽度，确保换行判断准确 -->
                       Width="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType=ListView}}"/>
        </ItemsPanelTemplate>
    </ListView.ItemPanel>

    <!-- 自定义Item模板，模拟资源管理器的图标+文件名样式 -->
    <ListView.ItemTemplate>
        <DataTemplate>
            <StackPanel Width="100" Margin="5" HorizontalAlignment="Center">
                <Image Source="{Binding FileIcon}" Width="64" Height="64"/>
                <TextBlock Text="{Binding FileName}" TextWrapping="Wrap" HorizontalAlignment="Center"/>
            </StackPanel>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

几个关键细节要注意： #

• 禁用横向滚动：一定要设置ScrollViewer.HorizontalScrollBarVisibility="Disabled"，不然ListView会默认显示横向滚动条，WrapPanel就不会触发换行了。
• WrapPanel宽度绑定：把WrapPanel的宽度绑定到ListView的ActualWidth，能保证它始终和ListView同宽，换行的判断会更精准，不会出现元素明明没超出却换行的情况。
• 横向排列设置：Orientation="Horizontal"指定WrapPanel是横向排列元素，当一行的总宽度超过容器宽度时，自动把后续元素放到下一行。

额外优化小技巧： #

• 如果希望所有Item的大小统一（就像资源管理器里的文件图标那样），可以在ItemTemplate的容器（比如上面的StackPanel）设置固定宽度，避免元素大小不一导致布局乱糟糟的。
• 要是后续需要加拖拽排序这类功能，WrapPanel也能很好地配合相关逻辑，比自己手动创建多个StackPanel要省心太多。

这样设置之后，你的ListView就会完全按照预期工作：元素横向排列，当一行放不下时自动换行，完全不需要自己去写换行判断或者创建新的StackPanel~

内容的提问来源于stack exchange，提问作者A. Wolf