Question

我正在我的UWP应用程序中开发内部文件管理器。我在调用此方法时在GridView中显示StorageFolder的内容：

gridView.ItemsSource = await storageFolder.GetItemsAsync();

另外，我有一个项目模板，用于可视化链接到GridView的文件/文件夹项目。我在这个模板中有一个Image对象。我想将StorageFolder的缩略图图像绑定到此Image对象的Source属性。但是，GetThumbnailAsync()是异步方法，而不是属性。我怎么能这样做？

Answer 1

另外，我有一个项目模板，用于可视化链接到GridView的文件/文件夹项目。我在这个模板中有一个Image对象。我想将StorageFolder的缩略图图像绑定到此Image对象的Source属性。

我认为您可以首先获取缩略图然后将其转换为图像，因此它可以成为Image控件的来源。我认为你需要的是这样的：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.Resources>
        <local:ThumbnailToImageConverter x:Key="cvt" />
    </Grid.Resources>
    <GridView x:Name="gridView">
        <GridView.ItemTemplate>
            <DataTemplate>
                <StackPanel>
                    <Image Source="{Binding Thumbnail, Converter={StaticResource cvt}}" Stretch="None" />
                    <TextBlock Text="{Binding Name}" Margin="0,5" />
                </StackPanel>
            </DataTemplate>
        </GridView.ItemTemplate>
    </GridView>
</Grid>

代码隐藏和绑定模型类：

private ObservableCollection<Model> Collection = new ObservableCollection<Model>();

protected override async void OnNavigatedTo(NavigationEventArgs e)
{
    var files = await KnownFolders.PicturesLibrary.GetFilesAsync();
    foreach (var file in files)
    {
        var thumbnail = await file.GetThumbnailAsync(ThumbnailMode.PicturesView, 100);
        Collection.Add(new Model { Name = file.Name, Thumbnail = thumbnail });
    }
    gridView.ItemsSource = Collection;
}

public class Model
{
    public StorageItemThumbnail Thumbnail { get; set; }
    public string Name { get; set; }
}

ThumbnailToImageConverter代码：

public class ThumbnailToImageConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        BitmapImage image = null;

        if (value != null)
        {
            StorageItemThumbnail thumbnail = (StorageItemThumbnail)value;
            image = new BitmapImage();
            image.SetSource(thumbnail);
        }
        return (image);
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

由于我在代码中使用了PicturesLibrary，因此我们需要在测试此代码时在清单文件中启用<uap:Capability Name="picturesLibrary" />。

UWP中的异步绑定缩略图图像

1 个答案: