füllen Bilder von Bildbibliothek zu ListView in Windows 10 App

Question

ich versuche, alle Bilder von Standard-Bild-Bibliothek zu ListView in Windows-app zu zeigen, aber ich bin nur in der Lage, die Namen der Bilder nicht alle Bilder aus dem Ordner, hier ist mein Code.

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); 
     } 

    } 

hier ist der XAML-Code ...

<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

Es gibt keine automatische Konvertierung von StorageFile Namen zu Bildern.

Sie werden zwei Dinge benötigen, zuerst eine Datatemplate mit einem Image-Steuerelement in Ihrem Listview:

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

Zweitens BitmapImages aus dem StorageFiles erstellt, die anstelle der Dateinamen in die Items-Auflistung hinzugefügt werden:

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); 
    } 
} 

Beachten sie auch, dass das Laden in einem Handler Loaded Veranstaltung durchgeführt wird, anstatt direkt eine Asynchron-Methode aufrufen, ohne sie zu warten. Ereignishandler sind die einzigen Methoden, die sicher async void sein können und nicht erwartet werden.

Answer 2

Während Clemens Ansatz für Sie arbeiten wird, möchte ich Ihnen einen anderen Ansatz zeigen. Verwenden von ViewModels. Hier

ist ein 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); 
      } 
     } 
    } 
} 

Normalerweise, wenn es sich um eine synchrone Aktivität ist, können Sie Ihre Logik in Konstruktor schreiben. Da diese asynchron ist, verwende ich eine andere Methode meiner Ansicht nach Modell in einem List von BitmapImage s

Jetzt laden MainPage_Loaded (a-Handler-Methode der Loaded Ereignisses Mainpage wie in der anderen Antwort gezeigt) Sie dies tun müssen, :

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

    await viewModel.GetImages(); 
} 

Und Ihre Listview ist Binding gerade hier

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