The following tutorial will walk you through the process of binding the C1DataGrid control to an RSS feed. Note that in this example, you will be binding the grid to the ComponentOne Buzz RSS news feed. Note that you can substitute another RSS feed in the steps below, if you choose.

Complete the following steps:

1.        In Visual Studio, select File | New | Project.

2.        In the New Project dialog box, select a language in the left pane and in the templates list select Silverlight Application. Enter a Name for your project, for example "C1DataGridRSS", and click OK. The New Silverlight Application dialog box will appear.

3.        Click OK to accept the default settings, close the New Silverlight Application dialog box, and create your project.

4.        In the Solution Explorer window, right-click the project name (for example, C1DataGridRSS) and select Add Reference.

5.        In the Add Reference dialog box, locate the System.Xml.Linq library and click OK to add a reference to your project.

6.        In the XAML window of the project, place the cursor between the <Grid> and  </Grid> tags and click once.

7.        Navigate to the Toolbox and double-click the C1DataGrid icon to add the grid control to MainPage.xaml. The XAML markup will now look similar to the following:

<UserControl xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml" x:Class="C1DataGrid.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="400" Height="300">
    <Grid x:Name="LayoutRoot" Background="White">
        <c1:C1DataGrid></c1:C1DataGrid>
    </Grid>
</UserControl>

Note that the C1.Silverlight.DataGrid namespace and <c1:C1DataGrid></c1:C1DataGrid> tags have been added to the project.

8.        If the <c1:C1DataGrid> tag includes existing content, delete it so it appears similar to the following:

<c1:C1DataGrid></c1:C1DataGrid>

9.        Give your grid a name by adding x:Name="c1grid" to the <c1:C1DataGrid> tag so that it appears similar to the following:

<c1:C1DataGrid x:Name="c1grid">

By giving the control a unique identifier, you'll be able to access the C1DataGrid control in code.

10.     Add AutoGenerateColumns="True" to the <c1:C1DataGrid> tag so that it appears similar to the following:

<c1:C1DataGrid x:Name="c1grid" AutoGenerateColumns="True">

This way the grid will automatically generate and display data from the data source.

11.     In the Solution Explorer, expand the MainPage.xaml node and double-click the MainPage.xaml.cs (or MainPage.xaml.vb) file to open it in the Code Editor.

12.     Add the following import statement at the top of the file:

Imports System.Xml.Linq

using System.Xml.Linq;

13.     In the MainPage constructor, add an event handler and set up a WebClient object to read from the RSS feed with the following code:

Public Sub New()
    InitializeComponent()
    Dim client As New WebClient()
    Dim uri As New Uri("https://developer.mescius.com/componentone/docs/wpf/online-datagrid/overview.html")
    AddHandler client.DownloadStringCompleted, AddressOf client_DownloadStringCompleted
    client.DownloadStringAsync(uri)
End Sub

public MainPage()
{
    InitializeComponent();
    WebClient client = new WebClient();
    Uri uri = new Uri("http://helpcentral.componentone.com/CS/blogs/c1buzz/rss.aspx");
    client.DownloadStringCompleted += new DownloadStringCompletedEventHandler(client_DownloadStringCompleted);
    client.DownloadStringAsync(uri);
}

Note that you can substitute another RSS feed for the ComponentOne Buzz feed, if you choose.

14.     Add the News class:

Public Class News
    Public Property Title() As String
        Get
            Return m_Title
        End Get
        Set(ByVal value As String)
            m_Title = Value
        End Set
    End Property
    Private m_Title As String
    Public Property Link() As String
        Get
            Return m_Link
        End Get
        Set(ByVal value As String)
            m_Link = Value
        End Set
    End Property
    Private m_Link As String
End Class

public class News
{
    public string Title { get; set; }
    public string Link { get; set; }
}

15.     Add the client_DownloadStringCompleted event handler:

Private Sub client_DownloadStringCompleted(ByVal sender As Object, ByVal e As DownloadStringCompletedEventArgs)
    Dim xmlNews As XDocument = XDocument.Parse(e.Result)
    Dim news = From story In xmlNews.Descendants("item") _
    Select New News With {.Title = story.Element("title").Value, .Link = story.Element("link").Value}
    c1grid.ItemsSource = news
End Sub

void client_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
{
    XDocument xmlNews = XDocument.Parse(e.Result);
    var news = from story in xmlNews.Descendants("item")
        select new News
        {
           Title = (string)story.Element("title"),
           Link = (string)story.Element("link")
        };
    c1grid.ItemsSource = news;
}

16.     Run your application and observe that the grid appears bound to the ComponentOne Buzz RSS news feed.

 What You've Accomplished

Congratulations, you've completed this tutorial! In this topic you created a new Silverlight project, added a C1DataGrid control, and learned how to bind the grid to an RSS feed.