Windows 8 C#/XAML - Create a border around textblock text

Question

I'm creating an app for the Windows 8 app store and I'm pretty new to the XAML UI stuff. What I want to do is create a black border around the actual text in the textblock. Any help would be greatly appreciated.

Here is the textblock:

<TextBlock Grid.Row="0" x:Name="TopLabel" VerticalAlignment="Top" Text="Top Label" HorizontalAlignment="Center" FontFamily="Impact" FontSize="48"/>

Solution 1

Use Border control :

http://msdn.microsoft.com/en-us/library/windows/apps/xaml/windows.ui.xaml.controls.border.aspx

something like this :

<Border BorderBrush="Gray" BorderThickness="2" Grid.Row="0">
  <TextBlock x:Name="TopLabel" VerticalAlignment="Top" Text="Top Label" HorizontalAlignment="Center" FontFamily="Impact" FontSize="48"/>
</Border>

Solution 2

I believe the term you are looking for is 'Stroke', other SO users have noticed that this affect appears to be absent from the shipped feature set.

The following question/solution should meet your needs - its based on WPF but both Windows 8 and WPF make use of XAML : Apply Stroke to Text

Alternatively theres an informative MSDN article about it (again aimed at WPF but the principles should be the same) : How to: Create Outlined Text (MSDN)

I hope this helps!

Comments

[Denis]

You would have to use DirectWrite to do this

[Slayter]

Could you possibly elaborate please?

[Denis]

You can use directwrite to generate text outline convert it to path object and render path in the xaml app.

[Slayter]

I hate to act like a total noob but could you possibly share some sample code with me. I'm fairly new to this framework and SDK. Thanks either way.

[Slayter]

That only put a box around the label. I'm trying to outline the actual text. Thanks though.