Use of TemplateBinding and Custom Control in Silverlight

To create a custom control in Silverlight it is quite easy .
Select "Silverlight Template Control" after clicking on Add new Item on your silverlight project.
Once you add this you will notice generic.xaml is already added under theme folder. It contains the control template of your newly create template control.

You can add as many dependency property as you want.

Your Control.cs will look like this after adding some dependency property


using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace WrapPanel
{
    public class FieldSet : Control
    {
        public FieldSet()
        {
            this.DefaultStyleKey = typeof(FieldSet);
        }

        public String Title
        {
            get { return (String)GetValue(TitleProperty); }
            set { SetValue(TitleProperty, value); }
        }
        public static readonly DependencyProperty TitleProperty =
            DependencyProperty.Register("TitleProperty", typeof(String), typeof(Orientation), null);

        public  FrameworkElement Content
        {
            get { return (FrameworkElement)GetValue(MyContentProperty); }
            set { SetValue(MyContentProperty, value); }
        }

        public static readonly DependencyProperty MyContentProperty =
            DependencyProperty.Register("ContentProperty", typeof(FrameworkElement), typeof(Orientation), null);
    }
}

and generic.xaml will look like below

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

                    xmlns:local="clr-namespace:WrapPanel">

    <Style TargetType="local:FieldSet">

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="local:FieldSet">

                    <Border Background="{TemplateBinding Background}"

                            BorderBrush="{TemplateBinding BorderBrush}"

                            BorderThickness="{TemplateBinding BorderThickness}">

                        <Grid x:Name="FieldsetLayoutRoot"

                              HorizontalAlignment="Stretch"

                              VerticalAlignment="Stretch">

                            <Border HorizontalAlignment="Stretch"

                                    VerticalAlignment="Stretch">

                                <ContentPresenter x:Name="TheFieldsetContentPresenter"

                                                  Content="{TemplateBinding Content}"

                                                  HorizontalAlignment="Stretch"

                                                  VerticalAlignment="Stretch"

                                                  Margin="0" />

                            </Border>

                            <Border HorizontalAlignment="Left"

                                    VerticalAlignment="Top">

                                <TextBlock x:Name="FieldsetTitleTextBlock"

                                           HorizontalAlignment="Left"

                                           VerticalAlignment="Top"

                                           Text="{TemplateBinding Title}" />

                            </Border>

                        </Grid>

                    </Border>

                </ControlTemplate>

            </Setter.Value>

        </Setter>

    </Style>

</ResourceDictionary>

Please not the use of TemplateBinding tells the XAML parser to look for the said property in the Control's dependency property

Feedback and comments are always welcomed

Cheers!

Vinod