iPhone like red badge notification in a WPF project?

c#, styles, wpf

Solution

Use a Border element and place your text within it. You can set the CornerRadius property for the Border appropriately so that it looks like a circle (or a rounded-rectangle shape, in case the number is bigger).

Here's a first cut, which exploits the fact that CornerRadius will get clamped to half the height or width in Y and X respectively:

 <Border Background="Red" CornerRadius="999" Padding="4">
    <TextBlock Foreground="White" FontWeight="Bold" FontSize="12">125</TextBlock>
 </Border>

Problem

I have a C# WPF project which generates daily and weekly reports automatically. I want to inform the user when new reports are available, so I thought of a badge like on the iPhone where the number of new messages appears on a little red circle: I thought of three images: Two images with semi circles on the left and right if the number to display is small. And a third image for the middle for the case that the number is large (123) and wouldn't fit in a circle. I want a glossy effect, so I've thought of pictures. Does anyone have a good idea how to do this without pictures but programmatically?

Original source