c# - 我如何创建特定编号的 ListView。 WPF 中的列数？

Question

我想创建一个包含 3 列的 ListView，我在 ListView 标签内创建了一个 GridView，但这并没有提供我想要的相同结果。

附件是我想要的结果图片。

这是我正在使用的代码。

[![<ListView Name="List1" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,70,0,0" ScrollViewer.HorizontalScrollBarVisibility="Hidden" ScrollViewer.VerticalScrollBarVisibility="Hidden" Background="Transparent" BorderThickness="0" RenderTransformOrigin="-1.33,-0.562" SelectionChanged="ListView_SelectionChanged">
            <ListView.View>
                <GridView ColumnHeaderContainerStyle="{StaticResource myHeaderStyle}">
                    <GridViewColumn>
                        <GridViewColumn.CellTemplate>
                            <DataTemplate>
                                <DockPanel HorizontalAlignment="Right" Height="200" Width="200" LastChildFill="False" VerticalAlignment="Top">
                                    <StackPanel Orientation="Vertical">
                                        <Grid>
                                            <Label Content="{Binding username}" Width="100" Height="200" VerticalAlignment="Bottom" HorizontalAlignment="Center"/>
                                            <Image Source="{Binding imageSource}" Width="100" Height="100"/>
                                        </Grid>
                                    </StackPanel>
                                </DockPanel>
                            </DataTemplate>
                        </GridViewColumn.CellTemplate>
                    </GridViewColumn>
                    <GridViewColumn>
                        <GridViewColumn.CellTemplate>
                            <DataTemplate>
                                <DockPanel HorizontalAlignment="Right" Height="200" Width="200" LastChildFill="False" VerticalAlignment="Top">
                                    <StackPanel Orientation="Vertical">
                                        <Grid>
                                            <Label Content="{Binding username}" Width="100" Height="200" VerticalAlignment="Bottom" HorizontalAlignment="Center"/>
                                            <Image Source="{Binding imageSource}" Width="100" Height="100"/>
                                        </Grid>
                                    </StackPanel>
                                </DockPanel>
                            </DataTemplate>
                        </GridViewColumn.CellTemplate>
                    </GridViewColumn>
                    <GridViewColumn>
                        <GridViewColumn.CellTemplate>
                            <DataTemplate>
                                <DockPanel HorizontalAlignment="Right" Height="200" Width="200" LastChildFill="False" VerticalAlignment="Top">
                                    <StackPanel Orientation="Vertical">
                                        <Grid>
                                            <Label Content="{Binding username}" Width="100" Height="200" VerticalAlignment="Bottom" HorizontalAlignment="Center"/>
                                            <Image Source="{Binding imageSource}" Width="100" Height="100"/>
                                        </Grid>
                                    </StackPanel>
                                </DockPanel>
                            </DataTemplate>
                        </GridViewColumn.CellTemplate>
                    </GridViewColumn>
                </GridView>
            </ListView.View>
        </ListView>][1]][1]

Answer 1

更好的方法是使用 UniformGrid 作为 ListView 的 ItemsPanel。

<ListView>
    <ListView.ItemsPanel>
        <ItemsPanelTemplate>
           <UniformGrid Columns="3" />
        </ItemsPanelTemplate>
    </ListView.ItemsPanel>
    ...
</ListView>

---

这是一个使用 ListBox 而不是 ListView 的示例，正​​如评论中所讨论的那样。这是我推荐的方式，除非您需要 ListView 的一些特殊功能，因为它会更高效。

这使用了 AgentOctal.WpfLib NuGet 包(我是这个包的作者)为基础 ViewModel 类提供属性更改通知和命令支持。不过，您应该能够替换任何正确实现 INotifyPropertyChanged 的工作方法。

XAML:

<Window
    x:Class="ColumnsTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="clr-namespace:ListViewColumns"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    Title="MainWindow"
    Width="800"
    Height="450"
    mc:Ignorable="d">
    <Window.DataContext>
        <local:MainWindowVm />
    </Window.DataContext>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <ListBox
            Grid.Row="0"
            HorizontalContentAlignment="Stretch"
            VerticalContentAlignment="Stretch"
            ItemsSource="{Binding Path=People}">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <UniformGrid Columns="3" />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Border
                            Height="{Binding RelativeSource={RelativeSource Self}, Path=ActualWidth}"
                            Margin="4"
                            BorderBrush="Black"
                            BorderThickness="1">
                            <TextBlock Text="{Binding Path=Name}" />
                        </Border>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
        <Button
            Grid.Row="1"
            Command="{Binding Path=AddPersonCommand}"
            Content="Add Person" />
    </Grid>
</Window>

查看模型:

namespace ColumnsTest
{
    using System.Windows.Input;
    using AgentOctal.WpfLib;
    using AgentOctal.WpfLib.Commands;

    class MainWindowVm : ViewModel
    {
        public MainWindowVm()
        {
            People = new ObservableCollection<PersonVm>();
        }

        public ObservableCollection<PersonVm> People { get; }

        private ICommand _addPersonCommand;
        public ICommand AddPersonCommand
        {
            get
            {
                return _addPersonCommand ?? (_addPersonCommand = new SimpleCommand((obj) =>
                                        {
                                            People.Add(new PersonVm() { Name = Guid.NewGuid().ToString() });
                                        }));
            }
        }

    class PersonVm : ViewModel
    {
        private string _name;
        public string Name
        {
            get { return _name; }
            set { SetValue(ref _name, value); }
        }

    }
}

它产生以下结果: