I don't think I'm alone in saying that I've been waiting to get my hands on the Silverlight 2.0 bits for quite a while now. First impressions: it delivers!
I've been reading through the docs and playing around with the bits and my mind has been buzzing with loads of little samples and things to try, many of which will make it to these pages over the coming months I'm sure. I was actually reading though the API docs on MSDN before MIX08 even started and when I saw System.Text.RegularExpressions it just popped into my head I could make my first little baby steps with a Silverlight regex evaluator.
If you have read through all of Mr Guthrie's tutorials, which I highly recommend you do, then most of the code is very simple so I will only highlight a few interesting pieces, although as always the code will be available for download. The application cycles through all available matches for the suplied regular expression highlighting each in turn as you press the button. If no match is found or the last match has been reached a modal "MessageBox" type control is displayed.
Without further ado, here she is:
How It Works
Like Scott's Digg application I wanted to have the application flow and resize nicely using the new layout controls. The trick to getting this to work is setting a DesignWidth and DesignHeight on the root element instead of just Width and Height. This is accomplished with the following Xaml:
<UserControl x:Class="FlawlessCodeRegexTester.Page"
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignWidth="640" d:DesignHeight="480"
xmlns:FlawlessCodeRegexTester="clr-namespace:FlawlessCodeRegexTester">
The part to note is that DesignWidth and DesignHeight are actually in an expression blend related namespace and as such VS08 doesn't properly respect these values. In fact the designer goes a little odd looking, this isn't really a problem though as Blend looks fine and Blend is where I do all the visual stuff anyway.
The only other part worth mentioning really is how the regex is evaluated.
match = Regex.Match(textTextBox.Text, regexTextBox.Text);
Run beforeMatchText = new Run();
beforeMatchText.Text = textTextBox.Text.Substring(0, match.Index);
Run matchText = new Run();
matchText.Text = textTextBox.Text.Substring(match.Index, match.Length);
matchText.Foreground = new SolidColorBrush(Color.FromArgb(255, 255, 0, 0));
Run afterMatchText = new Run();
afterMatchText.Text = textTextBox.Text.Substring(match.Index + match.Length);
resultTextBlock.Text = "";
resultTextBlock.Inlines.Add(beforeMatchText);
resultTextBlock.Inlines.Add(matchText);
resultTextBlock.Inlines.Add(afterMatchText);
As you can see I use the standard Regex.Match method to perform the actual search and using the value returned I build up a series of Runs which contain the text, colouring the matched part in red. These Run objects are then added to the Inlines collection of the TextBlock which displays the result. A lot more info about how this works can be found on MSDN.
This should be the first of many Silverlight 2 apps I have swimming around in my brain but I do like it, short and sweet, and I may spend some time extending it and adding features to develop this into a more useful tool. Hope you enjoyed it!
FlawlessCodeRegexTester.zip (136.68 kb)
