How to Use Implicit Templates in Silverlight 5 Beta



Prologue:

In my last article we have seen about Handling Multiple Clicks in Silverlight 5. In this article we are going to see how to use the new feature of Silverlight 5 called "Implicit Data Templates" in our Silverlight applications.

Short intro to Implicit Data Template:

Implicit Data Templates are one of the new features included in Silverlight 5. Implicit Templates can be said to be data templates associated with a particular DATA TYPE. These templates will be applied to all template-driven controls which are trying to display the specified data type using the Property DataType.
 
In our sample demonstration application we will have two types, namely LateralEntry and Regular. These classes are about an engineering college joining mode in India i.e. if you join B.E after completing a Diploma then the joining mode is called LateralEntry if you join after completing the school education then it is called Regular.

Here we have two different Data Templates for Two different Classes. Let us discuss these.

Preparing the Solution:

As we are ready to create a Silverlight Application just fire up the Visual studio 2010 and create a project with the name ImplicitDataTemplateInSL5.

To create the application just follow the steps listed in NUMBERS.

ImpSilver1.gif

Make sure we are creating a Silverlight 5 application by selecting the Silverlight version.

ImpSilver2.gif

Designing the Page [XAML]:

In this application we are going to demonstrate the Implicit Data Template by designing the page such that it will the Persons details who are all LateralEntry and Regular.

Here is the complete XAML for the page.

ImpSilver3.gif

In this design page we are using one list box which will display the Persons say my Engineering friends and another StackPanel to hold the information about the person selected.

Friends_SelectionChanged [No: 1] is an event which will fire when the item in the list box is being changed.

The Image and TextBlock [No: 2] is used to display the person's image and information about them.

Note:

In the design page we have not used any Templates for the list box.

Adding Templates in App.xaml:

Adding the Templates in the App.xaml we can access the Template anywhere in the solution.

Before adding the Implicit Templates in the App.xaml first add the namespace for the DataType we are going to use in the Template.

ImpSilver4.gif

In this application we are using the Friends Base class and two sub-classes called LateralEntry and Regular.

Before are creating the Templates, let us see the Types i.e. LateralEntry and Regular.

The following figure is for the base class.

ImpSilver5.gif

The LateralEntry class:

ImpSilver6.gif

The Regular class:

ImpSilver7.gif

Implicit Template for LateralEntry friends:

ImpSilver8.gif

In the above code the Implicit Data Template for the LateralEntry class i.e. this template will be applied to the items of the Listbox wherever the item belongs to LateralEntry.

In the DataType property we are assigning "frnd: LateralEntry"; it means to the LateralEntry class which belongs to the Friend base class.

Implicit Template for Regular friends:

ImpSilver9.gif

In the DataType property we are assigning "frnd: Regular"; it means to the Regular class which belongs to the Friend base class. So the Template will be applied to the Regular type items.

As we are going to display the person's information with images, just add the images needed. In this example I have added my classmate's image.

ImpSilver10.gif

Binding the Data:

For binding the data to the list box we have to create a collection of friends like the following one.

ImpSilver11.gif

Bind the collection of friends with the Listbox data source.

ImpSilver12.gif

The information about friends will be displayed upon selection of the particular friend.

ImpSilver13.gif

Application in Action:

Though we have not used the Templates in the design page the Templates applied here are based on the item type.

The items in the ODD number are the LateralEntry type so it is displayed using the LateralEntry Templates. The items in the EVEN number are the Regular type so it is displayed using the Regular Templates.

Quick Notes:

An Implicit Data Template can be applied to the following controls only.

  • Controls which are Data Type specified
  • Collection controls [ListBox, ComboBox...]
  • Controls defined in Template scope

Summary:

You see how useful this Implicit Data Templates is. It reduces the Development time because once you define the Template for a particular type the Template will be applied automatically to the items which are the Type specified in the Template.

Thanks for spending your precious time here. Please provide your valuable feedbacks and comments, which enable me to give a better article the next time.

Please rate this Article.

Thanks.