Retrieve an RSS or Atom Data Feed in Windows Store App

Today we are learn how to retrieve an RSS feed into a Windows 8 Apps. This article shows how to read a RSS feed and display it with an interactive user interface into your Metro App.

We are trying to get the RSS feed of C-sharpcorner.com and display the title of each article with their pub date and also content from the latest article to be displayed in the Metro app.

So, let's begin creating a Windows 8 Apps that shows the full text of the posts in both RSS and Atom form.

Step 1: First of all we need to create some business classes that hold the RSS feed data, so that we can retrieve from there as required.

To add a new class file to a project:

Select Project > Add Class. The New Item dialog box opens.
Enter a name for the class file. In this example we use FeedData.
Click Add. Your new class file is created.

The Feeddata class holds the data about the RSS feed. It has some properties that contain info about the individual articles such title, pubdate, author name etc. It also has a collection of feeds and a method to retrieve the feeds from the network.

Here is code:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Threading.Tasks;

 

namespace rss

{

    public class FeedData

    {

        private List<FeedItem> _Items = new List<FeedItem>();

        public List<FeedItem> Items

        {

            get

            {

                return this._Items;

            }

        }

    }    

    public class FeedItem

    {

        public string Title { get; set; }

        public string Author { get; set; }

        public string Content { get; set; }

        public DateTime PubDate { get; set; }

        public Uri Link { get; set; }

    }

}

Step 2: Add the following namespace in the mainPage.xaml.cs file:

using Windows.Web.Syndication;

Step 3: Now we have to retrieve the RSS feed data. Here we use the SyndicationClient class that retrieves a fully parsed RSS feed, so we can use the data without worrying about parsing XML.

Here is the code for getting RSS feeds:
 

private  async void k_Click_1(object sender, RoutedEventArgs e)

{

    SyndicationClient client = new SyndicationClient();

     Uri feedUri = new Uri("http://www.c-sharpcorner.com/RSS/TopArticles.aspx");

     feed = await client.RetrieveFeedAsync(feedUri);

     FeedData feedData = new FeedData();

      foreach (SyndicationItem item in feed.Items)

      {

              FeedItem feedItem = new FeedItem();          

              feedItem.Title = item.Title.Text;

              feedItem.PubDate = item.PublishedDate.DateTime;

              feedItem.Author = item.Authors[0].Name;

              // Handle the differences between RSS and Atom feeds.

            if (feed.SourceFormat == SyndicationFormat.Atom10)

              {

                  feedItem.Content = item.Content.Text;

                  feedItem.Link = new Uri("http://www.c-sharpcorner.com" + item.Id);

              }

             else if (feed.SourceFormat == SyndicationFormat.Rss20)

              {

                  feedItem.Content = item.Summary.Text;

                  feedItem.Link = item.Links[0].Uri;

              }

              feedData.Items.Add(feedItem);

      }

          ItemListView.DataContext = feedData.Items;

}   
    
In the above code we use the SyndicationClient class and we called the asynchronous RetrieveFeedAsync method to get the RSS feed into the fully parsed form. Then with the SyndicationFeed retrieved, we copy the parts we need into our FeedData and FeedItem data classes.

Step 4: On the selection changed events of the listview display the contents of the artilce is put into webview control:

private void ItemListView_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

       FeedItem f = new FeedItem();

       f.Link = feed.Items[ItemListView.SelectedIndex].Links[0].Uri;        

       web.Navigate(f.Link);

       web.Visibility = Visibility.Visible;

}

Step 5: After retrieving the RSS feed we design the UI to display it on the application. So, we take a list view to display the list of all the latest articles.

Here is the XAML code:
 

<Page

    x:Class="rss.MainPage"

    IsTabStop="false"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:local="using:rss"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d">

    <Grid>

        <Grid.Background>

            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                <GradientStop Color="Black"/>

                <GradientStop Color="#FF94D8CC" Offset="1"/>

            </LinearGradientBrush>

        </Grid.Background>

        <StackPanel Orientation="Horizontal" VerticalAlignment="Top">

            <Button x:Name="k" Click="k_Click_1" Content="click" />

            <TextBlock Margin="190,20" Text="C# Corner's Top Articles" FontSize="50" Foreground="BlanchedAlmond" >
           </TextBlock>

        </StackPanel>

        <StackPanel Orientation="Horizontal">

            <ListView x:Name="ItemListView"

          ItemsSource="{Binding}"  Width="520" Margin="35,100,30,10"

           BorderThickness="3" SelectionChanged="ItemListView_SelectionChanged" >

                <ListView.ItemTemplate>

                    <DataTemplate>

                        <StackPanel>

                            <TextBlock Text="{Binding Title}" 

                           FontSize="24" Margin="5,0,0,0" TextWrapping="Wrap" />

                            <TextBlock Text="{Binding Author}"

                           FontSize="16" Margin="15,0,0,0"/>

                            <TextBlock Text="{Binding PubDate}"

                           FontSize="16" Margin="15,0,0,0"/>

                        </StackPanel>

                    </DataTemplate>

                </ListView.ItemTemplate>

            </ListView>

            <WebView x:Name="web" Margin="20,100,40,10" Width="1200" Visibility="Collapsed" />

        </StackPanel>

    </Grid>

</Page>

Step 6: In the last build and Press F5 to run the application to see the output. You will see the list of the latest articles from C# Corner with their titles.



Step 7: Select any article from the list and you will see the content of the article on the left side.