Digital Moose Tracks

I have been playing around with WPF and  started writing a little game to experiment with.   So far I think my favorite thing about WPF has been data templates.  I defined a data template for a Gem Card, one of the game pieces.

<DataTemplate DataType="{x:Type game:GemCard}">
    <Border Style="{DynamicResource CardBorder}" Background="Green">
    <Border Style="{DynamicResource CardHighlight}">
        <Grid>
            <Label Content="{Binding Value}" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="5" FontSize="18.667"/>
            <Label Content="{Binding Value}" HorizontalAlignment="Right" VerticalAlignment="Bottom" Margin="5" FontSize="18.667"/>
            <Path Stretch="Fill" Stroke="Black" Data="m0,0 l1,1 -1,1 -1,-1z" Fill="Red" HorizontalAlignment="Center" VerticalAlignment="Center" Width="40" Height="60"/>
            <Label Content="{Binding Gems}" FontSize="18.667" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        </Grid>
    </Border>
    </Border>
</DataTemplate>

And when I put a GemCard in a content control in my game it looks something like this

I like this approach a lot because I can just tell WPF how I want my classes to be presented and then I can just start putting them in listboxes with out having to worry about how the will look.

When I was playing with the FlicScannerWedge Clone I wrote I decided I wanted to make the window look like a barcode cause that would be cool looking.  Plus hey its WPF so it should be able to do something like this. So I found this cool looking image to use as the window background.

So I set it as the background and make the window style none and allow transparency and I get the following

Bamm!! I was pretty excite that it was so easy but then I went to resize the window and no joy .  So I ask Google how to handle this and find Kirupa Chinnathambi’s blog where he shows you how to do this.  The way his example works is by creating a bunch of transparent ‘handles’ around they boarder of your window and then handling some mouse events to do the resizing.  Here’s how my window looks with the handles colored in.

So I go through the steps and it resizing and am happy.  Since Kipupa’s was presented more as a proof of concept I pulled out the resizing logic into a base class and did a little refactoring.  The refactoring I liked the most was using Enum,Parse and a dictionary  to replace a switch statement. Turning this

private void Resize(object sender, MouseEventArgs e)
{
    Rectangle clickedRectangle = sender as Rectangle;
    ResizeDirection direction = ResizeDirection.Top;

    switch (clickedRectangle.Name)
    {
        case "top":
            this.Cursor = Cursors.SizeNS;
            direction = ResizeDirection.Top;
            break;
        case "bottom":
            this.Cursor = Cursors.SizeNS;
            direction = ResizeDirection.Bottom;
            break;
        case "left":
            this.Cursor = Cursors.SizeWE;
            direction = ResizeDirection.Left;
            break;
        case "right":
            this.Cursor = Cursors.SizeWE;
            direction = ResizeDirection.Right;
            break;
        case "topLeft":
            this.Cursor = Cursors.SizeNWSE;
            direction = ResizeDirection.TopLeft;
            break;
        case "topRight":
            this.Cursor = Cursors.SizeNESW;
            direction = ResizeDirection.TopRight;
            break;
        case "bottomLeft":
            this.Cursor = Cursors.SizeNESW;
            direction = ResizeDirection.BottomLeft;
            break;
        case "bottomRight":
            this.Cursor = Cursors.SizeNWSE;
            direction = ResizeDirection.BottomRight;
            break;
        default:
            break;
    }

    if (e.LeftButton == MouseButtonState.Pressed)
        ResizeWindow(direction);
}

in to this

private Dictionary<ResizeDirection, Cursor> cursors = new Dictionary<ResizeDirection, Cursor>
{
    {ResizeDirection.Top, Cursors.SizeNS},
    {ResizeDirection.Bottom, Cursors.SizeNS},
    {ResizeDirection.Left, Cursors.SizeWE},
    {ResizeDirection.Right, Cursors.SizeWE},
    {ResizeDirection.TopLeft, Cursors.SizeNWSE},
    {ResizeDirection.BottomRight, Cursors.SizeNWSE},
    {ResizeDirection.TopRight, Cursors.SizeNESW},
    {ResizeDirection.BottomLeft, Cursors.SizeNESW}
};

private static ResizeDirection GetDirectionFromName(string name)
{
    //Hack - Assumes the drag handels are all named *DragHandle
    string enumName = name.Replace("DragHandle", "");
    return (ResizeDirection)Enum.Parse(typeof(ResizeDirection), enumName);
}

protected void ResizeIfPressed(object sender, MouseEventArgs e)
{
    FrameworkElement element = sender as FrameworkElement;
    ResizeDirection direction = GetDirectionFromName(element.Name);

    this.Cursor = cursors[direction];

    if (e.LeftButton == MouseButtonState.Pressed)
        ResizeWindow(direction);
}

Which is a little smaller and more readable IMHO – although probably slower. Here is the source.

Flic Scanner Wedge Source Code