WinRT將圖像綁定到字符串或StorageFile

Question

我試圖從FilePicker中選擇一個StorageFile後顯示圖像。由於Image的Source必須是URI或ImageSource，因此我試圖從StorageFile中獲取其中的任一個。

我很難獲取數據綁定在XAML中的Image上工作。我曾嘗試以下：

<Image Width="300" 
     Height="300" 
     x:Name="LogoImage"> 
    <Image.Source> 
     <BitmapImage UriSource="{Binding ImagePath}" /> 
    </Image.Source> 
</Image> 

這樣是不行的，作爲StorageFile的Path屬性不是URI。另外，我不能直接綁定到StorageFile本身，因爲它不是ImageSource。

我試圖用這個方法：

public async Task<Image> GetImageAsync(StorageFile storageFile) 
{ 
    BitmapImage bitmapImage = new BitmapImage(); 
    FileRandomAccessStream stream = (FileRandomAccessStream)await storageFile.OpenAsync(FileAccessMode.Read); 
    bitmapImage.SetSource(stream); 
    Image image = new Image(); 
    image.Source = bitmapImage; 
    return image; 
} 

但是，它返回一個Task<Image>，這也不是一個ImageSource或URI。它似乎應該比我想要做的更直接，但我只是沒有看到它。另外，我試過在XAML中爲Image.Source指定一個文件，它工作正常。我只是無法根據FilePicker中選定的文件進行鏈接。

我的最終目標是：從FilePicker中選擇一個文件，更新顯示的Image的ImageSource，編碼爲base64以存儲在數據庫中。然後，從數據庫加載現有的base64字符串，轉換回Image進行顯示。

編輯：

我能夠完成我使用下面張貼的解決了這個任務。非常感謝傑裏·尼克松的博客文章：http://blog.jerrynixon.com/2014/11/reading-and-writing-base64-in-windows.html

Answer 1

如果任何人遇到了這個問題尋找一個答案，我最終落得這樣做對我的情況，是採取從FilePicker選擇StorageFile，編碼爲Base64字符串（我將保存到我的數據庫供以後檢索）。

一旦我有base64字符串，我可以將該字符串解碼爲ImageSource以在代碼隱藏中設置。這裏是我的全ButtonClick事件處理程序：

private async void ChooseImage_Click(object sender, RoutedEventArgs e) 
{ 
    var filePicker = new FileOpenPicker(); 
    filePicker.FileTypeFilter.Add(".jpg"); 
    filePicker.ViewMode = PickerViewMode.Thumbnail; 
    filePicker.SuggestedStartLocation = PickerLocationId.PicturesLibrary; 
    filePicker.SettingsIdentifier = "picker1"; 
    filePicker.CommitButtonText = "Open File to Process"; 

    var files = await filePicker.PickMultipleFilesAsync(); 

    if (files.Count > 0) 
    { 
     // encode the storage file to base64 
     var base64 = await Encoding.ToBase64(files[0]); 

     // asynchronously save base64 string to database 
     // ... 

     // decode the base64 and set the image source 
     LogoImage.Source = await Encoding.FromBase64(base64); 
    } 
} 

的base64編碼/解碼，我發現在偉大的傑里尼克鬆的博客在這裏：http://blog.jerrynixon.com/2014/11/reading-and-writing-base64-in-windows.html

Answer 2

最好的解決方案是將代碼源設置在後面而不是使用綁定，因爲它可以讓你處理類似取消的情況，以防ImagePath在更新時圖像仍在加載。

或者，您可以創建一個位圖，啓動加載它的任務並在任務完成之前返回，例如，

public Image GetImage(StorageFile storageFile) 
{ 
    var bitmapImage = new BitmapImage(); 
    GetImageAsync(bitmapImage, storageFile); 

    // Create an image or return a bitmap that's started loading 
    var image = new Image(); 
    image.Source = bitmapImage; 

    return image ; 
} 

private async Task GetImageAsync(BitmapImage bitmapImage, StorageFile storageFile) 
{ 
    using (var stream = (FileRandomAccessStream)await storageFile.OpenAsync(FileAccessMode.Read)) 
    { 
     await bitmapImage.SetSource(stream); 
    } 
}