Step-by-step tutorial to merge text on image (customize live tiles) and save it into the media library - Windows Phone 8 - Visual Studio 2012 using C#

  • Article

Would you like to update your live tiles to a customized one? Here is the step by step tutorial on how to merge text on an image.

To merge text and image into a single image, we have to convert the image to a writable bitmap, render the text over the image and position it, and then save the image.

Let’s say I have an image “myImage”

morning

1) Create a textblock and name it “textblock1”

2) Assign some text to the textblock

     textblock1.Text = “Good morning”;

3) Convert the image to a writeable bitmap

          WriteableBitmap wb = new WriteableBitmap((BitmapSource)myImage.Source);

4) Position the textblock over the writeable bitmap

          wb.Render(textblock1, new TranslateTransform() { X = 25, Y = 191 });
          wb.Invalidate();

5) Save the image as jpeg to the media library

          using (MemoryStream stream = new MemoryStream())
          {
              wb.SaveJpeg(stream, wb.PixelWidth, wb.PixelHeight, 0, 100);
              stream.Seek(0, SeekOrigin.Begin);
              using (MediaLibrary mediaLibrary = new MediaLibrary())
                  mediaLibrary.SavePicture("Picture.jpg", stream);
          }
          MessageBox.Show("Picture Saved...");

gm