WPF列表视图根据窗口高度将项目显示到列

基础概念

WPF（Windows Presentation Foundation）是微软推出的基于Windows的用户界面框架，它提供了丰富的控件和灵活的布局系统。列表视图（ListView）是WPF中的一个常用控件，用于显示数据集合。通过设置不同的视图模式，如详细信息、小图标、大图标等，可以展示不同类型的数据。

类型

WPF中的ListView有多种视图模式：

详细信息视图：显示多列数据，适合展示详细信息。
图标视图：以图标的形式展示数据，适合展示少量数据。
列表视图：以列表的形式展示数据，适合展示长文本数据。

应用场景

ListView广泛应用于各种需要展示数据集合的应用程序，如文件管理器、邮件客户端、任务管理工具等。

问题：根据窗口高度将项目显示到列

在WPF中，可以通过设置ListView的View属性为GridView，并使用AutoGenerateColumns属性来自动或手动定义列。为了实现根据窗口高度调整列数，可以使用View的ColumnHeaderContainerStyle属性来设置列头的样式，并结合窗口大小变化事件来动态调整列数。

示例代码

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="450" Width="800" SizeChanged="Window_SizeChanged">
    <Grid>
        <ListView x:Name="MyListView" ItemsSource="{Binding Data}" View="{StaticResource GridView}">
            <ListView.View>
                <GridView AutoGenerateColumns="False">
                    <GridViewColumn Header="Column1" DisplayMemberBinding="{Binding Column1}" />
                    <GridViewColumn Header="Column2" DisplayMemberBinding="{Binding Column2}" />
                    <!-- Add more columns as needed -->
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>
</Window>

public partial class MainWindow : Window
{
    public ObservableCollection<MyData> Data { get; set; }

    public MainWindow()
    {
        InitializeComponent();
        DataContext = this;
        Data = new ObservableCollection<MyData>
        {
            new MyData { Column1 = "Item1", Column2 = "Detail1" },
            new MyData { Column1 = "Item2", Column2 = "Detail2" },
            // Add more data items as needed
        };
    }

    private void Window_SizeChanged(object sender, SizeChangedEventArgs e)
    {
        AdjustColumns();
    }

    private void AdjustColumns()
    {
        int columnCount = CalculateColumnCount();
        GridView gridView = (GridView)MyListView.View;
        gridView.Columns.Clear();

        for (int i = 0; i < columnCount; i++)
        {
            GridViewColumn column = new GridViewColumn
            {
                Header = $"Column{i + 1}",
                DisplayMemberBinding = new Binding($"Column{i + 1}")
            };
            gridView.Columns.Add(column);
        }
    }

    private int CalculateColumnCount()
    {
        double height = this.Height;
        // Adjust the logic based on your requirements
        if (height > 600)
        {
            return 3;
        }
        else if (height > 400)
        {
            return 2;
        }
        else
        {
            return 1;
        }
    }
}

public class MyData
{
    public string Column1 { get; set; }
    public string Column2 { get; set; }
    // Add more properties as needed
}