MetroApp保存UIEment为图片

浏览数：35 / 时间：2015年06月11日

　　写本文的起因是想截取Metro App画面作为图片来使用Win8的共享。

　　话说自从大MS的客户端UI技术进入XAML时代之后，每次截屏的代码都不太一样，无论silverlight、WPF还是Windows Phone都不完全一样，搞得我头昏脑胀，每次都要搜索一下才写的出来。反观Winform许久未写，如何截屏我还记得一清二楚……真是尴尬……顺带吐槽Metro的各种奇葩Stream类，那跟.NET的Stream类互转那叫一个惨烈和别扭啊。

　　花开两头，各表一枝。接下来我们进入今天的正题——如何在Metro下截屏，我再吐槽一下MS,这个截屏用的API似乎Win8.1才开放，还在用Win8的话还是撸撸睡吧……

　　首先我们要用到一个奇葩类，这次真的不是WriteableBitmap了，这次的主角是叫做RenderTargetBitmap。

            var bitmap = new RenderTargetBitmap();
            await bitmap.RenderAsync(this.rootGrid);
            IBuffer buffer = await bitmap.GetPixelsAsync();
            var stream = buffer.AsStream();

　　要想转换UIElement到Stream，通过以上几步就可以了，this.rootGrid是一个UIElement控件，也就是我想保存的图像。值得一提的是AsStream是一个扩展方法，记得要添加namespace System.Runtime.InteropServices.WindowsRuntime哟！

　　如果是WPF应用，得到Stream之后存为图片文件是很容易的事情了，分分钟秒杀的程度，问题Metro下面还需要再折腾折腾……

　　首先你需要创建一个StorageFile来存放这个图片，一个比较容易的方式是使用FileSavePicker。

            FileSavePicker savePicker = new FileSavePicker();
            savePicker.SuggestedStartLocation = PickerLocationId.Desktop;
            savePicker.FileTypeChoices.Add("Bitmap", new List<string>() { ".png" });
            savePicker.SuggestedFileName = "New Bitmap";

            StorageFile savedItem = await savePicker.PickSaveFileAsync();

　　接下来你可能会想StorageFile也有了，Stream也有了，应该往StorageFile里写Stream就行了。

　　可惜不是，直接使用FileIO.WriteBufferAsync的方法来写入图片文件是不行的。文件会无法作为图片正常显示。

　　我们需要使用BitmapEncoder来写入Stream，而WinRT下的这个BitmapEncoder，又需要WinRT的IRandomAccessStream才能使用。

                Guid encoderId = BitmapEncoder.PngEncoderId;
                IRandomAccessStream fileStream = await savedItem.OpenAsync(Windows.Storage.FileAccessMode.ReadWrite);
                BitmapEncoder encoder = await BitmapEncoder.CreateAsync(encoderId, fileStream);
                byte[] pixels = new byte[pixelStream.Length];
                pixelStream.Read(pixels, 0, pixels.Length);

                //pixal format shouldconvert to rgba8
                for (int i = 0; i < pixels.Length; i += 4)
                {
                    byte temp = pixels[i];
                    pixels[i] = pixels[i + 2];
                    pixels[i + 2] = temp;
                }

                encoder.SetPixelData(
                 BitmapPixelFormat.Rgba8,
                 BitmapAlphaMode.Straight,
                 (uint)bitmap.PixelWidth,
                 (uint)bitmap.PixelHeight,
                 96, // Horizontal DPI
                 96, // Vertical DPI
                 pixels);

                await encoder.FlushAsync();