Question

我试图在Windows应用程序中显示从默认图片库到ListView的所有图像，但我只能显示图像的名称而不是文件夹中的所有图像，这是我的代码。

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
using Windows.UI.Xaml.Media.Imaging;
using Windows.Storage.Streams;
using Windows.Storage;

// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238

namespace ListView
{
/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();
        showall();
    }

    public async void showall()
    {
        IReadOnlyList<StorageFile> file = await KnownFolders.PicturesLibrary.GetFilesAsync();

        foreach (StorageFile file1 in file)
        {
            list.Items.Add(file1.Name);
        }

    }

这是xaml代码......

<Page
x:Class="ListView.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:ListView"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <StackPanel>
        <StackPanel HorizontalAlignment="Left" Width="350" Height="350">
            <ListView Width="300" Height="300" Name="list" SelectionChanged="list_SelectionChanged">
                <Image Width="200" Height="200" Name="img"></Image>
            </ListView>
        </StackPanel>
        <StackPanel VerticalAlignment="Top">

            <Image Width="300" Height="300" Name="img1" />
            <TextBlock Width="300" Height="30" Name="txt1" />

        </StackPanel>
    </StackPanel>


</Grid>

Answer 1

没有从StorageFile名称到图像的自动转换。

您需要两件事，首先是ListView中带有Image控件的DataTemplate：

extension ViewController: UITextFieldDelegate {
    func textFieldShouldEndEditing(_ textField: UITextField) -> Bool {

        guard let text = textField.text, !text.isEmpty else {
            textField.placeholder = "Your placeholder text"

            return true
        }

        return true
    }

    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
        textField.resignFirstResponder()

        return true
    }
}

其次，从StorageFiles创建BitmapImages，它们被添加到Items集合而不是文件名中：

<ListView x:Name="list">
    <ListView.ItemTemplate>
        <DataTemplate>
            <Image Source="{Binding}"/>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

另请注意，加载是在public MainPage() { InitializeComponent(); Loaded += OnLoaded; } private async void OnLoaded(object sender, RoutedEventArgs e) { list.Items.Clear(); var files = await KnownFolders.PicturesLibrary.GetFilesAsync(); foreach (var file in files) { var bitmap = new BitmapImage(); using (var stream = await file.OpenReadAsync()) { await bitmap.SetSourceAsync(stream); } list.Items.Add(bitmap); } }事件处理程序中完成的，而不是直接调用异步方法而不等待它。事件处理程序是唯一可以安全地Loaded并且无法等待的方法。

Answer 2

虽然克莱门斯的方法对你有用，但我想向你展示一种不同的方法。使用ViewModels。

这是一个PicturesViewModel：

public class PicturesViewModel
{
    public ObservableCollection<ImageSource> MyImages { get; }
        = new ObservableCollection<ImageSource>();

    public async Task GetImages()
    {
        var files = await KnownFolders.PicturesLibrary.GetFilesAsync();
        foreach (var file in files)
        {
            using (var stream = await file.OpenReadAsync())
            {
                BitmapImage image = new BitmapImage();
                await image.SetSourceAsync(stream);
                MyImages.Add(image);
            }
        }
    }
}

通常，如果它是同步活动，您可以在构造函数中编写逻辑。由于这是异步的，我在视图模型中使用另一种方法加载List BitmapImage s

现在在你的MainPage_Loaded（MainPage的Loaded事件的处理程序方法中，如另一个答案中所示），你需要这样做：

private async void MainPage_Loaded(object sender, RoutedEventArgs e)
{
    var viewModel = new PicturesViewModel();
    DataContext = viewModel;

    await viewModel.GetImages();
}

您的ListView只是Binding

<ListView ItemsSource="{Binding MyImages}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <Image Source="{Binding}"/>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

将图片库中的图像填充到Windows 10 App中的ListView

2 个答案: