BBCode Parser for WPF

• Download source - 15.95 KB 

Introduction

This article is about a custom WPF control that enables the definition and usage of BBCode in your XAML application.

Background

I was trying to create an ASP.NET backoffice for basic CMS operations on a Silverlight page. Since XAML/XML is hard to edit without some kind of code completion, I decided to give BBCode a shot, since it's easy and the square brackets look a lot nicer to the user. :)

Parser Design

The design of the control is fairly simple. It has a BBCode dependency property that stores the BBCode currently on display, a collection of Tags that are used during the parsing, a DefaultElementName that is used for elements without any tag, and a RootElementName, that is used as a root for the parsed XAML output.

The Parse method utilizes the tags to transform the BBCode into XAML and then uses the XamlReader.Load method to set the UserControl.Content property of the Parser control. 

Explanation of the Tag Objects

• SimpleTag: [;)]
• EnclosingTag: [i]text[/i]
• ValueTag: [url]http://m0sa.net[/url]
• ParameterValueTag: [url=http://m0sa.net]m0sa.net[url]
• ParametrizedTag: [img width=100 height=200]image.jpg[/img]

You can add your own tags if you wish. Just implement the ITag interface, and you can use it in Parser.Tags in code or XAML! 

Using the Code

Here is a example of how one can define custom BBCodes for the Parser control:

And this is the demo app: 

Since the BBCode and Tags are dependency properties, you can use bindings on them. In the demo app, I have bound the Textbox.Text to the Parser.BBCode property. And you have a (very) simple editor!

Points of Interest  

My first attempt to write this control was with regular expressions, but I decided to write the parsing manually because I had problems with nested BBCodes. 

I had problems with special Slovenian characters (š, c, ž) using the XamlReader.Parse(string) method. I had to use... 

XamlReader.Load(new MemoryStream(Encoding.UTF8.GetBytes(xaml)), pc);  

... to get it to work properly. Seems like the Parse method uses Encoding.ASCI to get the bytes from the input string.

History

• 27-11-2008: First release