Windows store app[Part 2]:全新的File System與Uri不匹配的問題

在Win 8 App的安全沙箱內，除了使用文件選取器FileOpenPicker外，沒有其餘辦法調用某個盤符的數據。

全新的Storage命名空間，借鑑了IOS與Android的設計。

下面引用一個圖片綁定的簡單例子：

原來WPF咱們能夠這樣寫:

1     <Grid Background="Red">
2         <Image x:Name="bg1" Source="ms-appx:///Assets/shanghai.jpg"></Image>
3     </Grid>

也能夠在Code-Behind這樣寫:

this.DataContext = new BitmapImage(new Uri("ms-appx:///Assets/shanghai.jpg"));

XAML:

 <Image x:Name="bg1" Source="{Binding}"></Image>

效果都是這樣：

下面咱們用Win8 App的Storage來重寫一下上面的代碼。

爲了舉例，咱們須要引用本地圖片庫的圖片文件。

在AppPackage.appxmanifest中，加上配置

1   <Capabilities>
2     <Capability Name="picturesLibrary" />
3   </Capabilities>

Code-Behind:

1             var file = KnownFolders.PicturesLibrary.GetFileAsync("shanghai.jpg").AsTask().Result;
2             
3             this.DataContext = new BitmapImage(new Uri(file.Path));

運行程序，圖片並無顯示，這說明Storage是不支持Uri的。

解決方案1：經過讀取File的Stream，Set Image的Source，代碼以下：

1             var file = await KnownFolders.PicturesLibrary.GetFileAsync("shanghai.jpg");
2             using (var fileStream = await file.OpenAsync(FileAccessMode.Read)) {
3                 BitmapImage image = new BitmapImage();
4                 image.SetSource(fileStream);
5                 this.DataContext = image;
6             }

解決方案2：經過WriteBitmap類實現，代碼以下：

 1         async private void GetImage() {
 2             var file = await KnownFolders.PicturesLibrary.GetFileAsync("shanghai.jpg");
 3             using (var stream = await file.OpenAsync(FileAccessMode.Read)) {
 4                 BitmapImage image = new BitmapImage();
 5                 image.SetSource(stream);
 6                 stream.Seek(0);
 7                 backgroundBmp = new WriteableBitmap(image.PixelWidth, image.PixelHeight);
 8                 await backgroundBmp.SetSourceAsync(stream);
 9                 this.DataContext = backgroundBmp;
10             }
11         }
12 
13         private WriteableBitmap backgroundBmp;

一樣，也能夠經過引用WriteableBitmapEx.WinRT簡化寫法，代碼以下：

 1         async private void GetImage() {
 2             var file = await KnownFolders.PicturesLibrary.GetFileAsync("shanghai.jpg");
 3             using (var stream = await file.OpenAsync(FileAccessMode.Read)) {
 4                 BitmapImage image = new BitmapImage();
 5                 image.SetSource(stream);
 6                 stream.Seek(0);
 7                 backgroundBmp = await BitmapFactory.New(image.PixelWidth, image.PixelHeight).FromStream(stream);
 8                 this.DataContext = backgroundBmp;
 9             }
10         }
11 
12         private WriteableBitmap backgroundBmp;

解放方案1和2的區別，WriteableBitmap能夠精確指定生成的Image的區域，這樣就能夠經過WriteableBitmap實現圖片的縮放，裁剪。

代碼：戳