在 UWP 和 XAML 中创建"table style"列表视图 (C#)

Question

我想知道是否有任何方法可以在UWP Windows 10应用程序中创建"类似表"的列表视图？我需要某种表格，我可以允许用户浏览和选择文件，然后将所选文件放入列表中，有点像您在 Windows 资源管理器中看到的详细信息视图，其中包含列标题和行，我可以以编程方式插入，如下所示：

string[] item = { "D:\Music\MyAudioFile.mp3", "MP3", "12MB" }
listview1.Items.Add(item);

有人知道我可以用什么来做这件事吗？

谢谢

Answer 1

谢谢Lindexi，它为我指明了正确的方向......这是我工作的代码...

C# 后端代码：

        // Create a new StackPanel to insert as a ListViewItem
        StackPanel myStack = new StackPanel();
        myStack.HorizontalAlignment = HorizontalAlignment.Stretch;
        myStack.VerticalAlignment = VerticalAlignment.Stretch;
        myStack.Orientation = Orientation.Horizontal;
        // Create new StackPanel "Child" elements with alignment and width
        ListViewItem lv1 = new ListViewItem();
        lv1.Content = "Test Content";
        lv1.Width = 400;
        lv1.HorizontalAlignment = HorizontalAlignment.Stretch;
        lv1.VerticalAlignment = VerticalAlignment.Stretch;
        // Create new StackPanel "Child" elements with alignment and width
        ListViewItem lv2 = new ListViewItem();
        lv2.Content = "Test Content";
        lv2.Width = 100;
        lv2.HorizontalAlignment = HorizontalAlignment.Stretch;
        lv2.VerticalAlignment = VerticalAlignment.Stretch;
        // Create new StackPanel "Child" elements with alignment and width
        ListViewItem lv3 = new ListViewItem();
        lv3.Content = "Test Content";
        lv3.Width = 100;
        lv3.HorizontalAlignment = HorizontalAlignment.Stretch;
        lv3.VerticalAlignment = VerticalAlignment.Stretch;
        // Create new StackPanel "Child" elements with alignment and width
        ListViewItem lv4 = new ListViewItem();
        lv4.Content = "Test Content";
        lv4.Width = 100;
        lv4.HorizontalAlignment = HorizontalAlignment.Stretch;
        lv4.VerticalAlignment = VerticalAlignment.Stretch;
        // Create new StackPanel "Child" elements with alignment and width
        ListViewItem lv5 = new ListViewItem();
        lv5.Content = "Test Content";
        lv5.Width = 250;
        lv5.HorizontalAlignment = HorizontalAlignment.Stretch;
        lv5.VerticalAlignment = VerticalAlignment.Stretch;
        // Create new StackPanel "Child" elements with alignment and width
        ListViewItem lv6 = new ListViewItem();
        lv6.Content = "Test Content";
        lv6.Width = 250;
        lv6.HorizontalAlignment = HorizontalAlignment.Stretch;
        lv6.VerticalAlignment = VerticalAlignment.Stretch;
        // Add "Child" elements for the new StackPanel
        myStack.Children.Add(lv1);
        myStack.Children.Add(lv2);
        myStack.Children.Add(lv3);
        myStack.Children.Add(lv4);
        myStack.Children.Add(lv5);
        myStack.Children.Add(lv6);
        // Add the new StackPanel as a ListViewItem control
        MusicQueue.Items.Insert(1, myStack);

XAML 代码：

        <ListView Name="MusicQueue" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
            <ListViewItem HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                <StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Orientation="Horizontal">
                    <ListViewHeaderItem Width="400">Filename</ListViewHeaderItem>
                    <ListViewHeaderItem Width="100">Format</ListViewHeaderItem>
                    <ListViewHeaderItem Width="100">Size</ListViewHeaderItem>
                    <ListViewHeaderItem Width="100">Duration</ListViewHeaderItem>
                    <ListViewHeaderItem Width="250">Artist</ListViewHeaderItem>
                    <ListViewHeaderItem Width="250">Title</ListViewHeaderItem>
                </StackPanel>
            </ListViewItem>
        </ListView>

当然，这可能不是手动将项目添加到水平堆叠的 ListView 的最有效方法，但它是最重要的:)

如果有人知道用更少的代码更快地做到这一点的方法，请告诉我:)

谢谢大家

Answer 2

可以在 UWP 中使用 dataGrid。

但你也可以在ListView中使用DataTemplate，你可以使用打击代码来解决宽度太小的问题。

            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="HorizontalContentAlignment"
                            Value="Stretch"></Setter>
                </Style>
            </ListView.ItemContainerStyle>

您可以使用的库是：https://github.com/MyToolkit/MyToolkit/wiki/DataGrid

和 https://liftcodeplay.com/2015/10/24/datagrid-alternatives-in-uwp/

能花钱就用 https://www.syncfusion.com/products/uwp/sfdatagrid