Watermark text on Image in flipview

Question

I created a windows 8 app using c#/xaml that will allow my users to take pictures and post them to social media networks. I use a flipview to store the images so they can view them before they post, but I would also like to automatically insert a 'Copyright' message on each image taken so other people know they can't use them. This will be sort of a watermark.

I tried to overlay text on the image once they are taken but no luck so far.

Here is the flipview code:

<FlipView HorizontalAlignment="Left" VerticalAlignment="Top" RequestedTheme="Light" SelectionChanged="FlipView_SelectionChanged">
            <Image Source="Assets/Logo.png" />
            <Image Source="Assets/SplashScreen.png" />
            <Image Source="Assets/SmallLogo.png" />
        </FlipView>


 private void FlipView_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            var flipView1 = new FlipView();
            if (flipView1.Items != null)
            {
                flipView1.Items.Add("Item 1");
                flipView1.Items.Add("Item 2");
            }
            flipView1.SelectionChanged += FlipView_SelectionChanged;
        }

Any help on how to do this would be great!

Answer 1

You can overlay a TextBlock over the image if you put them both in a single panel like a Grid. If you want to actually combine the image and the watermark into a single image - it becomes a bit more challenging and you have multiple options.

1. If you are targeting Windows 8.1 - you get the RenderTargetBitmap.Render() option where you can render the visual tree that has the image and the watermark to a bitmap you can then save. It's the easiest way, but I'm not sure if you can get the resolution you might want out of that.
2. If your watermark can be an image as well you can combine your image with the watermark by combining all the pixels manually using the WriteableBitmap.PixelBuffer.AsStream() API. I think the open source library - "WriteableBitmapEx" has some nice extension methods to make that easy (probably named with something about "blit").
3. The quickest way might be doing that with Direct2D/DirectWrite, but that could be yet a bit more work. SharpDX is your friend there though so you don't necessarily have to use C++ for that.