WritableBitmap - Save custom live tile as Transparent PNG

Question

Having a bit of a problem creating a WritableBitmap and saving it being that WritableBitmap only seems to support JPEG. Obviously, this is quite an inconvenience and I really don't know what to do about it. How can I go about making my WritableBitmap save as a PNG file that supports Windows Phone 8.1 transparent tiles w/ background?

Note that i'm targeting 8.0.

My code:

private static void CreateBitmap(int width, int height)
{
        WriteableBitmap b = new WriteableBitmap(width, height);

        var canvas = new Grid();
        canvas.Width = b.PixelWidth;
        canvas.Height = b.PixelHeight;

        var background = new Canvas();
        background.Height = b.PixelHeight;
        background.Width = b.PixelWidth;

        // Removed this area of code which contains the design for my live tile. 

        b.Render(background, null);
        b.Render(canvas, null);
        b.Invalidate(); //Draw bitmap

        using (IsolatedStorageFile isf = IsolatedStorageFile.GetUserStoreForApplication())
        {
            using (IsolatedStorageFileStream imageStream = new IsolatedStorageFileStream("/Shared/ShellContent/" + imagename + ".jpeg", System.IO.FileMode.Create, isf))
            {

                b.SaveJpeg(imageStream, b.PixelWidth, b.PixelHeight, 0, 100);
            }
        }
}

score 2 · Accepted Answer · answered Jun 21 '14 at 19:15

There is a toolkit called Cimbalino WP that has an extension method for saving PNGs using WriteableBitmap. Cimbalino is available on NuGet, for the SavePng extension method you need to get the Background Components.

Here's a code sample on how to use it:

 using (IsolatedStorageFile isf = IsolatedStorageFile.GetUserStoreForApplication())
    {
        using (IsolatedStorageFileStream imageStream = new IsolatedStorageFileStream("/Shared/ShellContent/" + imagename + ".png", System.IO.FileMode.Create, isf))
        {
              Cimbalino.Phone.Toolkit.Extensions.WriteableBitmapExtensions.SavePng(b, imageStream);

        }
    }

score 0 · Answer 2 · edited May 23 '17 at 11:58

Just give a try using this snippet. Seems like you could call the ToImage extension method on your WriteableBitmap which is provided as part of ImageTools.

var img = bitmap.ToImage();
var encoder = new PngEncoder();
using (var stream = new IsolatedStorageFileStream(fileName, FileMode.Create, store))
{
encoder.Encode(img, stream);
stream.Close();
}

Have a look at these threads for more. Save WriteableBitmap to file using WPF http://www.codeproject.com/Questions/272722/Converting-WriteableBitmap-to-a-Bitmap-for-saving

Hope it helps!

WritableBitmap - Save custom live tile as Transparent PNG

2 Answers2