April 13, 2009

Accessing template elements of a usercontrol

0 comments

Hi Frnds,
In the last post I explained of creating a user control which acts like a container. In this post I will explain how to change the properties of your user control. The following steps will clear you about this,
1. Create a public property for the user control, accessing on which you will change the properties of your usercontrol. This is something like,
Private string someText;
Public string SomeText
{
Set { this.txtName.Text = value; }
Get { return txtName.Text; }
}
2. Since your properties are kept inside control template you cannot refer them simply by name as above.i.e.,this.txtName is not accessible if txtName is name of an element inside the control template.To access that element you need to have something like,
TextBlock txtBlock = (TextBlock)Template.FindName(“txtName”,this);
So if you think of something like,
Set
{
TextBlock txtBlock = (TextBlock)Template.FindName(“txtName”,this);
txtBlock.Text = value;
}
Then you are mistaken. This is because inside the setter you cannot fill the object txtBlock. This means that you will get a null reference when you run the above code. The reason is control hierarchy loading. When your setter method is executing your TextBlock is not yet created and so it will return an error(a run-time error).So the solution would be to set the value inside onApplyTemplate().The overall code looks like this:
MyUserControl.xaml
<USerControl x:Class="MyUserControl" Height="Auto" Width="Auto"......>
<UserControl.Template>
<ControlTemplate>
<Grid>
<Border Height="Auto" Width="Auto" Background="{TemplateBinding Property=ContentControl.Background}" CornerRadius="10" Name=”myContainer”>
<ContentPresenter Content="{TemplateBinding Property=ControlContent.Content}" />
</Border>
</Grid>
</ControlTemplate>
</UserControl.Template>


MyUserControl.xaml.cs
Public partial class MyUserControl : UserControl
{
Public MyUserControl()
{
InitializeComponent();
}
Public override void OnApplyTemplate()
{
Border border = (Border)Template.FindName(“myContainer”,this);
border.CornerRadius = new CornerRadius(topLeftRadius,0,10,0);
base.OnApplyTemplate();
}
Private double topLeftRadius;
Public double TopLeftRadius
{
Set { topLeftRadius = value; }
Get { return topLeftRadius; }
}
}


And in the main window Main.xaml
<Window…….>
<MyUserControl Background=”Chocolate” Height=”100” Width=”65” TopLeftRadius=”20”>
<TextBlock HorizontalAlignment=”Center” VerticalAlignment=”Center”>Some Text </TextBlock>
</MyUserControl>
</Window>

Please feel free to scold me if anything wrong mentioned.
Hope this was helpful