时间戳

首页 > 解决方案 > Listview 选定项目作为图像源

c# - Listview 选定项目作为图像源

问题描述

我的 WPF 应用程序中有一个列表视图。列表视图中的每一项都是图像文件的路径。我想在列表视图上显示所选图像的缩略图或预览。

主窗口.xaml

<Image Source="{Binding SelectedImage}" />
<ListView x:Name="MyListView" AllowDrop="True" Drop="MyListView_Drop" />

主窗口.xaml.cs

namespace MyWPFApp
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            DataContext = new MyDataContext();
        }
    }

    private void MyListView_Drop(object sender, DragEventArgs e)
    {
        string[] files = (string[])e.Data.GetData(DataFormats.FileDrop);
        List<string> fileList = new List<string>(files);

        foreach (string file in fileList)
        {
            if ((file.ToLower().EndsWith(".jpg") || file.ToLower().EndsWith(".jpeg") && !MyListView.Items.Contains(file))
            {
                MyListView.Items.Add(file);
            }
        }
    }

    public class MyDataContext : INotifyPropertyChanged
    {
        public string SelectedImage
        {
            get { return ((KeyValuePair<string, object>?)((MainWindow)Application.Current.MainWindow).MyListView.SelectedItem)?.Value?.ToString(); }
            set
            {
                ((MainWindow)Application.Current.MainWindow).MyListView.SelectedItem = value;
                OnPropertyChanged(nameof(SelectedImage));
            }
        }

        private void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }

        public event PropertyChangedEventHandler PropertyChanged;
    }
}

目前，在列表视图上选择图像不会做任何事情。任何帮助将不胜感激。

标签： c#wpflistview

解决方案

您的 ListView 未绑定到该SelectedImage属性。

除此之外，您应该考虑拥有一个实际的视图模型，该模型ObservableCollection除了属性之外还具有图像文件列表的SelectedImage属性。

public class ViewModel : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    public ObservableCollection<string> Images { get; }
        = new ObservableCollection<string>();

    private string selectedImage;

    public string SelectedImage
    {
        get { return selectedImage; }
        set
        {
            selectedImage = value;
            PropertyChanged?.Invoke(this,
                new PropertyChangedEventArgs(nameof(SelectedImage)));
        }
    }
}

您将在 XAML 中绑定到它，如下所示（可能使用 ListBox 而不是 ListView，因为它更简单）：

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>

    <ListBox ItemsSource="{Binding Images}"
             SelectedItem="{Binding SelectedImage}"
             AllowDrop="True" Drop="ListView_Drop"/>

    <Image Grid.Column="1" Source="{Binding SelectedImage}" />
</Grid>

窗口后面的代码：

public partial class MainWindow : Window
{
    private readonly ViewModel viewModel = new ViewModel();

    public MainWindow()
    {
        InitializeComponent();
        DataContext = viewModel;
    }

    private void ListView_Drop(object sender, DragEventArgs e)
    {
        var files = (string[])e.Data.GetData(DataFormats.FileDrop);

        foreach (var file in files.Where(
            f => (f.ToLower().EndsWith(".jpg") || f.ToLower().EndsWith(".jpeg"))
                && !viewModel.Images.Contains(f)))
        {
            viewModel.Images.Add(file);
        }
    }
}

推荐阅读