XAML being getting more and more popular is also introduced for Mobile applications. Recently while I was exploring on the internet, I found that the recent version of Windows 7 mobile interfaces uses Silverlight to deal with the interface. Just after the initial thought, I thought to try it for just to increase my knowledge base. Hence, I installed it to my machine and tried. It works great and I am really excited to see that Silverlight is again introduced with this mobile.

Inspite of having XNA for truely 3D style of application building, I tried simple programs to use this edition of silverlight and it worked greatly. It works in the most simplest way as with normal silverlight applications.

While doing the simple application, I found the XML binding within WPF application as an interesting part of XAML bindings. In this post, I will discuss how you can implement binding of a property with an XMLDataSource.

XML is very important part for any application. While you create your application, we generally need to write lot of code to handle XML data stream. May be from your local machine, or using WebClient to download data from your web server. WPF has in built support for XML bindings. Lets discuss XML bindings in detail using sample code.

Say you have an XML like this :

<data><packetid="names"><Namesdescription="All are selected"><nametypeid="1"firstname="raja"lastname="das">58</nametype><nametypeid="2"firstname="anjan"lastname="chowdhuri">67</nametype><nametypeid="3"firstname="charu"lastname="singh">38</nametype><nametypeid="4"firstname="manju"lastname="sen">69</nametype><nametypeid="5"firstname="sanju"lastname="sharma">89</nametype><nametypeid="6"firstname="sanjana"lastname="mathur">77</nametype></Names></packet></data>

So first of all we have added a new window, and added the XmlDataSource as resource. Please note that we can also use x:Data to define the XmlDataSource Xml directly within the file itself like :

<XmlDataProviderx:Key="xdata"XPath="/data/packet/Names"><x:XData><dataxmlns=""><packetid="names"><Namesdescription="All are selected"><nametypeid="1"firstname="raja"lastname="das">58</nametype><nametypeid="2"firstname="anjan"lastname="chowdhuri">67</nametype><nametypeid="3"firstname="charu"lastname="singh">38</nametype><nametypeid="4"firstname="manju"lastname="sen">69</nametype><nametypeid="5"firstname="sanju"lastname="sharma">89</nametype><nametypeid="6"firstname="sanjana"lastname="mathur">77</nametype></Names></packet></data></x:XData></XmlDataProvider>

Please note that I have added the xmlns in data tag intentionally, as if you dont the xml will inherit from the base Namespace.
The XPath within the XmlDataProvider induces the read of XML from that path. So for our XML the data will be read after /data/packet/names.

In the above XAML code, you can see I have put the datacontext of the Grid to the XmlDataProvider resource.

Keep in mind @ is used for attributes and / is used for tags. So the first TextBlock shows @description which means the string written within the description attribute of Names tag.

Now as we are in a collection of names, lets take a listbox to show all the elements within the XML data. The ItemsSource allows you to bind data with specific XPath. Here we have used nametype, as our main collection is of nametype. Within the datatemplate, we place one TextBlock for which the data is multi-bound. We use firstname and lastname attribute to put binding on the TextBlock Text property. In this situation, you can see, I have used @firstname and @lastname which will ensure that the binder will evaluate the Attribute rather than the innerText. The StatusBar allow you to show the bound data for the SelectedItem of the ListBox.

Things to Remember :

Use XPath to move to a particular node path.

Move to currentElement using XPath and choose @ for attribute and text() to get the InnerText.

/ is used to move to the child nodes.

In case you define your xml within XAML, be sure to specify the namespace to blank. Otherwise it will inherit from XAML namespace.

A little RSS Reader

So as things are now clear, lets build a sample RSS reader.

RSS is a special XML schema, so when we load RSS into our XMLDataProvider, we need to parse it in a special format. So lets see how the XAML looks like.

The sample code looks almost similar to what we have already discussed. The major difference is how you parser the XML coming from the RSS feed. Here the XMLDataProvider points to an external Web address. The program once starts takes a second to load the rss from the external source. Once it is loaded, the specific nodes are bound to the Title, description and items shown on the ListBox.

Blog Subscription

Learn MVC 5 step by step

My friend Shivprasad Koirala who is also a Microsoft ASP.NET MVP has released Learn MVC 5 step by step video series. It starts right from basics of MVC and goes to a level until you become a professional.
You can start taking the course for free using the below youtube video.
Please try it, you will find it awesome.

My Awards

Hit Counter

Twitter

Best .NET 4.5 Expert CookBook

Abhishek authored one of the best selling book of .NET. It covers ASP.NET, WPF, Windows 8, Threading, Memory Management, Internals, Visual Studio, HTML5, JQuery and many more...
Grab it now !!!
Another book on .NET 4.5 has been released very recently. It covers Debugging, Testing, Extensibility, WCF, Windows Phone, Windows Azure and many more...
Grab it now !!!GET ANY BOOK AT $5 from PacktPub. Offer is limited