原文:
与众不同 windows phone (16) - Media（媒体）之编辑图片, 保存图片到相册, 与图片的上下文菜单“应用程序...”和“共享...”关联, 与 Windows Phone 的图片中心集成
与众不同 windows phone (16) - Media（媒体）之编辑图片, 保存图片到相册, 与图片的上下文菜单“应用程序...”和“共享...”关联, 与 Windows Phone 的图片中心集成
作者：webabcd
介绍
与众不同 windows phone 7.5 (sdk 7.1) 之媒体
- 通过 WriteableBitmap 编辑图片，以及保存图片到相册
- 与图片的上下文菜单“应用程序...”关联
- 与图片的上下文菜单“共享...”关联
- 与 Windows Phone 的图片中心集成
示例
1、演示如何通过 WriteableBitmap 编辑图片，以及保存图片到相册
WriteableBitmapDemo.xaml
<phone:PhoneApplicationPage x:Class="Demo.Media.WriteableBitmapDemo" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" SupportedOrientations="Portrait" Orientation="Portrait" mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480" shell:SystemTray.IsVisible="True"> <Grid x:Name="LayoutRoot" Background="Transparent"> <StackPanel Orientation="Vertical"> <Image x:Name="img" /> <Button x:Name="btnSaveToCameraRollAlbum" Content="保存到图片 hub 的“本机拍照”" Click="btnSaveToCameraRollAlbum_Click" /> <Button x:Name="btnSaveToPictureAlbum" Content="保存到图片 hub 的“相册”" Click="btnSaveToPictureAlbum_Click" /> </StackPanel> </Grid> </phone:PhoneApplicationPage>
WriteableBitmapDemo.xaml.cs
/* * 本例演示编解码 jpeg 格式图片，通过 WriteableBitmap 修改图片，以及如何保存图片到图片中心的“本机拍照”和“相册” * * Picture - 媒体库中的图片对象 * MediaLibrary - 媒体库，用于访问设备中的图片、音乐、播放列表等 * SavePicture(String, Byte[]), SavePicture(String, Stream) - 保存图片到图片中心的“相册”，第一个参数是保存到媒体库的图片名称，第二个参数是需要被保存的图片数据 * SavePictureToCameraRoll(String, Byte[]), SavePictureToCameraRoll(String, Stream) - 保存图片到图片中心的“本机拍照”，第一个参数是保存到媒体库的图片名称，第二个参数是需要被保存的图片数据 * 注：关于 MediaLibrary 和 Picture 以及其他与媒体库（图片、音乐、播放列表等）相关的介绍详见 Microsoft.Xna.Framework.Media 命名空间下的类：http://msdn.microsoft.com/en-us/library/dd254868(v=xnagamestudio.40) * * PictureDecoder.DecodeJpeg(Stream source) - 解码 jpeg 格式文件到 WriteableBitmap 对象（经测试 png 格式也可以） * * WriteableBitmap - 位图 API，详见：http://www.cnblogs.com/webabcd/archive/2009/08/27/1554804.html 中的关于 WriteableBitmap 的介绍 * SaveJpeg() - 新增的扩展方法，用于将 WriteableBitmap 对象保存为 jpeg 格式文件 * LoadJpeg() - 新增的扩展方法，用于将 jpeg 格式图片加载到 WriteableBitmap 对象 */ using System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Windows; using System.Windows.Controls; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Animation; using System.Windows.Shapes; using Microsoft.Phone.Controls; using System.Windows.Resources; using System.Windows.Media.Imaging; using Microsoft.Phone; using Microsoft.Xna.Framework.Media; using System.IO.IsolatedStorage; using System.IO; namespace Demo.Media { public partial class WriteableBitmapDemo : PhoneApplicationPage { private WriteableBitmap _wb; public WriteableBitmapDemo() { InitializeComponent(); ShowImage(); } private void ShowImage() { Uri imageUri = new Uri("Assets/TileBackgroundBlue.png", UriKind.Relative); StreamResourceInfo sri = Application.GetResourceStream(imageUri); // 将图片流解码为 WriteableBitmap 对象，经测试不只是 jpeg 格式可以，png 格式也可以 _wb = PictureDecoder.DecodeJpeg(sri.Stream); // 将图片的第 10 行的像素点都改为红色 for (int i = _wb.PixelWidth * 9; i < _wb.PixelWidth * 10; i++) { unchecked { // 每个像素的颜色的描述规范为 ARGB _wb.Pixels[i] = (int)0xFFFF0000; } } // 重新绘制整个 WriteableBitmap 对象 _wb.Invalidate(); // 显示修改后的图片 img.Source = _wb; } // 将图片保存到图片 hub 的“本机拍照” private void btnSaveToCameraRollAlbum_Click(object sender, RoutedEventArgs e) { // 在独立存储中创建一个临时文件 string fileName = "myImage.jpg"; var myStore = IsolatedStorageFile.GetUserStoreForApplication(); if (myStore.FileExists(fileName)) myStore.DeleteFile(fileName); IsolatedStorageFileStream myFileStream = myStore.CreateFile(fileName); // 将图片保存到独立存储的临时文件 _wb.SaveJpeg(myFileStream, _wb.PixelWidth, _wb.PixelHeight, 0, 85); myFileStream.Close(); // 打开独立存储中的图片 myFileStream = myStore.OpenFile(fileName, FileMode.Open, FileAccess.Read); // 将图片保存到“本机拍照” MediaLibrary library = new MediaLibrary(); Picture pic = library.SavePictureToCameraRoll("SavedPicture.jpg", myFileStream); } // 将图片保存到图片 hub 的“相册” private void btnSaveToPictureAlbum_Click(object sender, RoutedEventArgs e) { // 在独立存储中创建一个临时文件 string fileName = "myImage.jpg"; var myStore = IsolatedStorageFile.GetUserStoreForApplication(); if (myStore.FileExists(fileName)) myStore.DeleteFile(fileName); IsolatedStorageFileStream myFileStream = myStore.CreateFile(fileName); // 将图片保存到独立存储的临时文件 _wb.SaveJpeg(myFileStream, _wb.PixelWidth, _wb.PixelHeight, 0, 85); myFileStream.Close(); // 打开独立存储中的图片 myFileStream = myStore.OpenFile(fileName, FileMode.Open, FileAccess.Read); // 将图片保存到“相册” MediaLibrary library = new MediaLibrary(); Picture pic = library.SavePicture("SavedPicture.jpg", myFileStream); } } }
2、演示如何与图片的上下文菜单“应用程序...”关联
IntegrateWithThePictureViewer.xaml
<phone:PhoneApplicationPage x:Class="Demo.Media.IntegrateWithThePictureViewer" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" SupportedOrientations="Portrait" Orientation="Portrait" mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480" shell:SystemTray.IsVisible="True"> <Grid x:Name="LayoutRoot" Background="Transparent"> <TextBlock TextWrapping="Wrap"> <Run>在“图片中心”中查看某图片，然后点击 AppBar 的“应用程序...”按钮，则会发现本 app 也在选项列表中，也就是说可以使用本 app 打开指定的图片</Run> <LineBreak /> <Run>具体实现方法请参见 manifest 和 MainPage.xaml.cs</Run> </TextBlock> </Grid> </phone:PhoneApplicationPage>
WMAppManifest.xml
<Extensions> <!-- 与图片的上下文菜单“应用程序...”关联，即在“图片中心”中查看某图片，然后点击 AppBar 的“应用程序...”按钮，则会发现本 app 也在选项列表中，也就是说可以使用本 app 打开指定的图片 --> <Extension ExtensionName="Photos_Extra_Viewer" ConsumerID="{5B04B775-356B-4AA0-AAF8-6491FFEA5632}" TaskID="_default" /> </Extensions>
MainPage.xaml.cs
protected override void OnNavigatedTo(NavigationEventArgs e) { // 当使用本 app 打开指定的图片时，会传递过来一个 token 参数 // 开发时要注意，如果同时使用了 PhotoChooserTask ，要避免冲突 if (NavigationContext.QueryString.ContainsKey("token")) { MediaLibrary library = new MediaLibrary(); // 根据 token 获取到指定的图片 Picture picture = library.GetPictureFromToken(NavigationContext.QueryString["token"]); // 将 Picture 对象转换成 BitmapImage 对象 BitmapImage bitmap = new BitmapImage(); bitmap.CreateOptions = BitmapCreateOptions.None; bitmap.SetSource(picture.GetImage()); // 将 BitmapImage 对象转换成 WriteableBitmap 并显示 WriteableBitmap picLibraryImage = new WriteableBitmap(bitmap); img.Source = picLibraryImage; } }
3、演示如何与图片的上下文菜单“共享...”关联
IntegrateWithThePictureShare.xaml
<phone:PhoneApplicationPage x:Class="Demo.Media.IntegrateWithThePictureShare" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" SupportedOrientations="Portrait" Orientation="Portrait" mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480" shell:SystemTray.IsVisible="True"> <Grid x:Name="LayoutRoot" Background="Transparent"> <TextBlock TextWrapping="Wrap"> <Run>在“图片中心”中查看某图片，然后点击 AppBar 的“共享...”按钮，则会发现本 app 也在选项列表中，也就是说可以使用本 app 共享指定的图片</Run> <LineBreak /> <Run>具体实现方法请参见 manifest 和 MainPage.xaml.cs</Run> </TextBlock> </Grid> </phone:PhoneApplicationPage>
WMAppManifest.xml
<Extensions> <!-- 与图片的上下文菜单“共享...”关联，即在“图片中心”中查看某图片，然后点击 AppBar 的“共享...”按钮，则会发现本 app 也在选项列表中，也就是说可以使用本 app 共享指定的图片 --> <Extension ExtensionName="Photos_Extra_Share" ConsumerID="{5B04B775-356B-4AA0-AAF8-6491FFEA5632}" TaskID="_default" /> </Extensions>
MainPage.xaml.cs
protected override void OnNavigatedTo(NavigationEventArgs e) { // 当使用本 app 共享指定的图片时，会传递过来一个 FileId 参数 if (NavigationContext.QueryString.ContainsKey("FileId")) { MediaLibrary library = new MediaLibrary(); // 根据 FileId 获取到指定的图片 Picture picture = library.GetPictureFromToken(NavigationContext.QueryString["FileId"]); // 将 Picture 对象转换成 BitmapImage 对象 BitmapImage bitmap = new BitmapImage(); bitmap.CreateOptions = BitmapCreateOptions.None; bitmap.SetSource(picture.GetImage()); // 将 BitmapImage 对象转换成 WriteableBitmap 并显示 WriteableBitmap picLibraryImage = new WriteableBitmap(bitmap); img.Source = picLibraryImage; } }
4、演示如何与 Windows Phone 的图片中心集成
IntegrateWithThePictureHub.xaml
<phone:PhoneApplicationPage x:Class="Demo.Media.IntegrateWithThePictureHub" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" FontFamily="{StaticResource PhoneFontFamilyNormal}" FontSize="{StaticResource PhoneFontSizeNormal}" Foreground="{StaticResource PhoneForegroundBrush}" SupportedOrientations="Portrait" Orientation="Portrait" mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480" shell:SystemTray.IsVisible="True"> <Grid x:Name="LayoutRoot" Background="Transparent"> <TextBlock TextWrapping="Wrap"> <Run>本 app 会出现在“图片中心”中的“应用程序”下</Run> <LineBreak /> <Run>具体实现方法请参见 manifest</Run> </TextBlock> </Grid> </phone:PhoneApplicationPage>
WMAppManifest.xml
<Extensions> <!-- 与 Windows Phone 的图片中心集成，即将本 app 添加到“图片中心”中的“应用程序”下 --> <Extension ExtensionName="Photos_Extra_Hub" ConsumerID="{5B04B775-356B-4AA0-AAF8-6491FFEA5632}" TaskID="_default" /> </Extensions>
OK
[源码下载]
