如何綁定到異步圖像源

Question

我想要的是圖像源綁定到我的綁定源的Image屬性，而不是指向異步方法，它可以遠程獲取圖像。我需要能夠通過這兩個參數。

圖像抓取

class ConnectImage 
{ 
    public static async Task<BitmapImage> GetImageAsync(Uri uri, String sid) 
    { 
     HttpClient httpClient = new HttpClient(); 
     httpClient.DefaultRequestHeaders.Add("Authorization", "OAuth " + sid); 

     HttpResponseMessage response = await httpClient.GetAsync(uri); 

     BitmapImage bmp = new BitmapImage(); 
     byte[] byteArray = await response.Content.ReadAsByteArrayAsync(); 

     InMemoryRandomAccessStream ras = new InMemoryRandomAccessStream(); 
     DataWriter writer = new DataWriter(ras.GetOutputStreamAt(0)); 
     writer.WriteBytes(byteArray); 
     BitmapImage image = new BitmapImage(); 
     image.SetSource(ras); 
     return image; 
    } 
} 

的ListView

<ListView 
     x:Name="itemListView" 
     Grid.Row="1" 
     ItemsSource="{Binding Source={StaticResource itemsViewSource}}" 
     IsSwipeEnabled="False" 
     ItemTemplate="{StaticResource FeedItemTemplate}"/> 

FeedItemTemplate

<DataTemplate x:Key="FeedItemTemplate"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="Auto"/> 
      <ColumnDefinition Width="*"/> 
     </Grid.ColumnDefinitions> 
     <Border Width="110" Height="110"> 
      <Image Source="{Binding Image}" Stretch="UniformToFill" /> 
     </Border> 
    </Grid> 
</DataTemplate> 

Answer 1

屬性不能是async，所以你需要一個async初始化，將設置屬性完成。

在你的虛擬機：

public BitmapImage Image { get; private set; } 

public async Task Load() 
{ 
    Image = await ConnectImage.GetImageAsync(...); 
    ... // other asynchronously-loaded properties 
} 

，然後讓Loaded頁面事件加載您的VM：

public async void MainPage_Loaded(object sender, RoutedEventArgs e) 
{ 
    await vm.Load(); 
} 

你的頁面最初將Image設置爲null，當加載圖像顯示，它會顯示在頁面上。