需要创建一个 ListView，在视图中水平列出单列项目

Question

我想在 wpf 中创建一个包含一列项目的列表视图，并在视图中水平列出这些项目。我一直无法找到这个问题的答案，并且已经寻找了很长一段时间。也许我只是想不出正确的搜索词。

因此，换句话说，我想在一列中创建一个字符串（即文件名）列表，当该列达到列表视图的高度时，而不是创建垂直滚动条，而是创建另一列在第一个的右侧。然后如果有足够的项目，就会出现一个水平滚动条。比如windows资源管理器在“列表”设置中是如何做到的。

这是我目前所拥有的。

    <ListView x:Name="dirListView" HorizontalAlignment="Left" Height="181" Margin="10,43,0,0" VerticalAlignment="Top" Width="572" ScrollViewer.VerticalScrollBarVisibility="Disabled" SelectionMode="Single" ItemsSource="{Binding Items}" SelectedItem="{Binding Path=selectedItem}">
        <ListView.Resources>
            <DataTemplate x:Key="TwoParts">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition/>
                    </Grid.ColumnDefinitions>
                    <Image Grid.Column="0" Source="{Binding image}"/>
                    <TextBlock Grid.Column="1" Text="{Binding directory}"/>
                </Grid>
            </DataTemplate>
        </ListView.Resources>
        <ListView.View>
            <GridView>
                <GridView.Columns>
                    <GridViewColumn CellTemplate="{StaticResource TwoParts}" />
                </GridView.Columns>
            </GridView>
        </ListView.View>
    </ListView>

任何帮助将不胜感激。

更新

我查看了下面的答案以及下面建议的帖子中的答案，并提出了一个新的 XAML。我也在尝试将数据绑定到此列表视图，但它似乎不起作用。如上所示，我将数据绑定到 DataTemplate 并将模板的键引用到 GridViewColumn。这似乎与这种新建议的方式不同。这是我现在所拥有的。

XAML 代码：

    <ListView x:Name="dirListView" HorizontalAlignment="Left" Height="181" Margin="10,43,0,0" VerticalAlignment="Top" Width="572" ScrollViewer.VerticalScrollBarVisibility="Disabled" SelectionMode="Single" ItemsSource="{Binding Items}" SelectedItem="{Binding Path=selectedItem}">
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <Image Source="{Binding image}"/>
                    <TextBlock Text="{Binding directory}"/>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel Orientation="Vertical"                    
                           MaxHeight="{Binding (FrameworkElement.ActualHeight), RelativeSource={RelativeSource AncestorType=ScrollContentPresenter}}"
                           ItemWidth="{Binding (ListView.View).ItemWidth, RelativeSource={RelativeSource AncestorType=ListView}}"
                           MinHeight="{Binding ItemHeight, RelativeSource={RelativeSource Self}}"
                           ItemHeight="{Binding (ListView.View).ItemHeight, RelativeSource={RelativeSource AncestorType=ListView}}"/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
    </ListView>

包含要绑定到 ListView 的数据的数据类：

public class ControlViewModel : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    private ObservableCollection<MyDirItems> _items;
    public ObservableCollection<MyDirItems> Items
    { 
        get { return _items; }
        set { _items = value; NotifyPropertyChanged("Items"); } 
    }

    private MyDirItems _selectedItem;
    public MyDirItems selectedItem 
    { 
        get { return _selectedItem; } 
        set { _selectedItem = value; NotifyPropertyChanged("selectedItem"); } 
    }

    public ControlViewModel()
    {
        _selectedItem = new MyDirItems();
        Icon icon = FileChooser.GetFolderIcon(IconSize.Small, FolderType.Closed);
        ImageSource i_source = (ImageSource)CommonUtility.ImageUtil.ImageConvert(icon.ToBitmap());
        _items = new ObservableCollection<MyDirItems>();
        Items.Add(new MyDirItems { directory = "Directory1.DIR", image = i_source });
        Items.Add(new MyDirItems { directory = "Directory2.DIR", image = i_source });
    }

    protected void NotifyPropertyChanged(string propertyName)
    {
        PropertyChangedEventHandler handler = this.PropertyChanged;
        if (handler != null)
        {
            var e = new PropertyChangedEventArgs(propertyName);
            handler(this, e);
        }
    }

}

最后是数据对象：

public class MyDirItems
{
    public string directory { get; set; }
    public ImageSource image { get; set; }
}

再次。任何帮助将不胜感激。提前致谢。

Answer 1

您可以更改 ListView 的 ItemsPanelTemplate 以使用 WrapPanel。将其方向设置为垂直，我认为这将完成您正在寻找的内容。

查看this post 了解更多信息。