Project Description
Silverlight PathTextBlock is a control that overcomes some of the limitations in the built in Silverlight 2 TextBlock, such as not being able to outline the text, and not being able to distort the text, for example to draw it along a circle.

Previously, you could use a tool like Expression Design to create the text and export it as a Path, but this wouldn't work for text that needed to be specified at run time. This control allows you to specify the Text property and it will generate the proper Path objects based on the font, font size, and text.

It is not meant to be a plug-in replacement for TextBlock, since TextBlock is a pretty sophisticated control. This is for the cases where you need one or both of these extra capabilities. A common use for this would be to jazz up your text in a game.

Note that any fonts you embed in your application are subject to the original licensing of the font and you should contact the font publisher before embedding a font in your application.

This is the included sample, it uses a sine wave transform to make the text wavy and then uses a polar transform to wrap it around a circle:



You can see the sample live here: http://www.bluerosegames.com/pathtextblocksampleweb/pathtextblocksampletestpage.html

The corresponding XAML for the above sample is as follows:
<brg:PathTextBlock x:Name="tb" Font="JellyBelly70.xfn" Stroke="Red" Fill="White" 
    StrokeThickness="2" FontSize="100" UpdateInterval="0:0:0.02">
    <brg:PathTextBlock.TextTransform>
            <brg:TransformGroup>
                <brg:SineTransform StartAngle="0" Amplitude="30" Period="250"/> 
                <brg:PolarTransform Angle="180" CenterX="320" CenterY="240" 
                    RadiusX="250" RadiusY="200" RadiusStretch="1.2" 
                    AngleStretch=".4" TextDirection="Clockwise"/>
            </brg:TransformGroup>
        </brg:PathTextBlock.TextTransform>
</brg:PathTextBlock> 


Some other transforms I'd like to see are a 3D perspective transform and a transform that aceepts a PathGeometry. If you write one of these or another interesting transform, please let me know and I'll either include it or link to it based on what you want.

To create your own transforms, inherit from BlueRoseGames.Controls.Text.Transform, and then override the TransformPoint method. Also if you have any custom properties, call SetChanged() in the property set code. This will tell the PathTextBlock that the transform has changed and it will re-render.

This code is released under the Microsoft Permissive License (Ms-PL) and can be used at no charge for non-commercial and commercial use. The software is provided as-is.

More documentation coming soon, check out the sample project and the included PolarTransform and SineTransform classes.

To get started, convert the font you want to use to a "xfn" file using the included FontParser.exe. Then add this xfn file to your Silverlight project and make sure it's of type "Content". Put this font file name in the Font property of the PathTextBlock.

Planned updates to the project:
  • Expose all properties as dependency properties so that they can be databound.
  • Exception handling
  • More transforms
  • More samples

If you use this for something interesting, please let me know and I'll create a gallery.

You can follow my efforts on this project and others on my blog at:
http://www.bluerosegames.com/silverlightbrasstacks/
Last edited Oct 9 2008 at 4:26 PM by billreiss, version 5

 

Want to leave feedback?
Please use Discussions or Reviews instead.

Archived page comments (2)

Updating...
© 2006-2010 Microsoft | About CodePlex | Privacy Statement | Terms of Use | Code of Conduct | Advertise With Us | Version 2010.1.12.16187