【WP8.1开发】RenderTargetBitmap类的特殊用途
相信，耍过WPF的人都知道RenderTargetBitmap这个玩意儿，这家伙比较有意思，它可以将用户界面上呈现的东西写入到内存的位图对象，从而开发者可以在应用程序中使用它，或者将其保存为图像文件。
在Runtime API里面也有这个位图组件，可以将UI元素呈现到位图中，当然，它也不是万能的，首先，要写入到位图中的UI对象必须已经在用户界面上呈现了，也就是说，只要你能看到界面上出现的东东，它才会写入位图对象；其次，要呈现到位图中的UI元素需要位于可视化树中，我简单地总结为：只要是放在Page内并且可见的元素，都可以生成位图。
调用RenderTargetBitmap类的RenderAsync方法来将可视化对象呈现到RenderTargetBitmap中，如果只是在应用程序中显示该生成的位图，那么，直接把RenderTargetBitmap对象赋值给Image控件的Source属性即可。
要是希望保存为图像文件，就要用到BitmapEncoder类，也就是图像编码。大家知道，在编码图像文件时，是向流中写入字节数组（byte[]）作为图像的像素数据的，那么，如何提取RenderTargetBitmap位图中的像素数据呢。你会发现RenderTargetBitmap类有个GetPixelsAsync方法，对的，通过该方法就可以返回位图的像素数据，只不过其类型为IBuffer，这样大家又会疑惑了，如何变成byte[]呢？
勿急，你只要引入System.Runtime.InteropServices.WindowsRuntime命名空间，里面就有相关类型为IBuffer定义了扩展方法——ToArray，调用它可以返回byte[]。
之后的事情就好办了。
理论永远是抽象的，咱们还是干点实事吧，这里我弄了个不那么美观的示例。
示例项目中有四张图片，顺便Show一下老周的书法作品。在应用页面上，把这四张图片分别作为画刷来填充图形。XAML如下：
<Grid> <Grid.RowDefinitions> <RowDefinition/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <Canvas x:Name="cv"> <Ellipse Width="250" Height="200" Canvas.Left="50" Canvas.Top="20"> <Ellipse.Fill> <ImageBrush ImageSource="/01.png" Stretch="UniformToFill"/> </Ellipse.Fill> </Ellipse> <Rectangle Width="180" Height="250" Canvas.Top="240" Canvas.Left="10" RadiusX="12" RadiusY="20"> <Rectangle.Fill> <ImageBrush ImageSource="/02.png" Stretch="UniformToFill"/> </Rectangle.Fill> </Rectangle> <Polygon Points="50,0 100,50 50,100 0,50" Width="240" Height="240" Canvas.Left="150" Canvas.Top="230" Stretch="Uniform"> <Polygon.Fill> <ImageBrush ImageSource="03.png" Stretch="UniformToFill"/> </Polygon.Fill> </Polygon> <Ellipse Width="130" Height="130" Canvas.Left="245" Canvas.Top="80"> <Ellipse.Fill> <ImageBrush ImageSource="/04.png" Stretch="UniformToFill"/> </Ellipse.Fill> </Ellipse> </Canvas> <Button Content="保存图像文件" Grid.Row="1" Click="OnClick"/> </Grid>
然后，处理Button的事件，生成图片，保存到相册中的“保存的图片”中。
private async void OnClick(object sender, RoutedEventArgs e)
{
Button b = sender as Button;
b.IsEnabled = false;
StorageFolder savedPics = KnownFolders.SavedPictures;
// 1、在位图中呈现UI元素
RenderTargetBitmap rtb = new RenderTargetBitmap();
await rtb.RenderAsync(this.cv);
// 提取像素数据
IBuffer buffer = await rtb.GetPixelsAsync();
// 创建新文件
StorageFile newFile = await savedPics.CreateFileAsync("test-3-7-11-5.png", CreationCollisionOption.ReplaceExisting);
// 获取文件流
IRandomAccessStream streamOut = await newFile.OpenAsync(FileAccessMode.ReadWrite);
// 实例化编码器
BitmapEncoder pngEncoder = await BitmapEncoder.CreateAsync(BitmapEncoder.PngEncoderId, streamOut);
// 写入像素数据
byte[] data = buffer.ToArray();
pngEncoder.SetPixelData(BitmapPixelFormat.Bgra8,
BitmapAlphaMode.Straight,
(uint)rtb.PixelWidth,
(uint)rtb.PixelHeight,
96d, 96d, data);
await pngEncoder.FlushAsync();
streamOut.Dispose();
b.IsEnabled = true;
}
运行效果如下图
在写入像素数据时，最常用的格式是rgba8或bgra8，一般8位够用了，虽然就是R值和B值的通道顺序不同，但这两种格式所保存的图片文件效果不太一样，我觉得bgra8好一点，没有偏色。
下面是保存后的PNG图片，左边的是用RGBA格式的，右边是用BGRA格式的，大家自行比较吧。
虽然老周的书法水平不怎么样，大家将就着看吧，重点是看RenderTargetBitmap类的用法。
示例下载：https://files.cnblogs.com/tcjiaan/RenderUiApp.zip
好，再次感谢您收看老周吹牛节目，再见。
