Click here to Skip to main content
13,287,116 members (38,022 online)
Click here to Skip to main content
Add your own
alternative version


13 bookmarked
Posted 15 Apr 2009

Data Driven Silverlight Pages

, 15 Apr 2009
Rate this:
Please Sign up or sign in to vote.
Dynamically Creating Silverlight Controls


In this article, we are going to build a data driven application by using Silverlight and XML. Creating controls in XAML code is easy, but it’s not easy to reuse the control for different target objects.

In this article, I will cover some implementation details of how to dynamically generate the Text block, Textbox, Auto Complete Box, Combo Box, Numeric Control and Button controls.

Creating the XML File

The XML file will look like the following:


You will notice that the XML file has the following elements:

  1. Field Name: This element represents the field name.
  2. Field Type: This element represents the field type. The valid field types are Textblock, TextBox, AutoCompleteBox, Numeric Control and Button.
  3. Validation: This element represents the validation of the field. The valid attributes are Minimum, Maximum, Width, Height, Increment, Expression, Required, Horizontal Alignment(Left, Right, Centre, Stretch), Vertical Alignment(Top,Bottom,Center) and Array List
  4. Row: This element represents the row the field should be displayed in the grid.
  5. Column: This element represents the row the field should be displayed in the grid.

Place the XML file in the \ClientBin folder.

Load the XML File

  1. Open Page.xaml.cs in your Silverlight Project. Add the following two methods: Image-2.jpg
  2. Call the LoadXMLFile() method after the InitializeComponent() method.
  3. Add a reference to the following DLLs to the Silverlight page:
    • System.XML.linq.dll
    • SilverlightValidator.dll
    • Microsoft.Windows.Controls.dll
    • Microsoft.Windows.Controls.Inputs.dll
  4. Now create the myBuldPage method. This method retrieves the information from XML file and builds the page based on the field type.


  5. Now add the Validation Manager to the Silverlight page:


  6. Now add the Grid to the Silverlight page:


  7. Now add the Silverlight controls based on the XML file:


  8. Now add the grid to the Silverlight page:



In this article, we separate data from content to make a cleaner design and for better maintainability. When XML is combined Silverlight controls become even more powerful. This opens up numerous possibilities for dynamic and robust systems.


  • 15th April, 2009: Initial post


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Nidhi Dham
Software Developer (Senior)
Canada Canada
Microsoft Certified Professional (MCP)
Microsoft Certificated Application Developer (MCAD.NET)
Microsoft Certified Dynamics (MS CRM 1.2)
Microsoft Certified Technology Specialist – SQL Server 2005 Business Intelligence (MCTS)
Microsoft Certified IT Professional – Business Intelligence Developer (MCTIP)
Microsoft Certified Technology Specialist – SQL Server 2005 (MCTS)
Microsoft Certified IT Professional – Database Administrator (MCTIP)

You may also be interested in...


Comments and Discussions

GeneralInteresting and useful Pin
liviucatrina12-Sep-10 22:56
memberliviucatrina12-Sep-10 22:56 
GeneralMy vote of 3 Pin
mheskol14-Jul-10 22:50
membermheskol14-Jul-10 22:50 
QuestionAnd why the sample code as images??? Pin
Michael E. Jones15-Apr-09 12:39
memberMichael E. Jones15-Apr-09 12:39 
Question[My vote of 1] Why no sample project? Pin
Robert Kozak15-Apr-09 10:17
memberRobert Kozak15-Apr-09 10:17 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.171207.1 | Last Updated 15 Apr 2009
Article Copyright 2009 by Nidhi Dham
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid