SIGN UP MEMBER LOGIN:    
ARTICLE

RSS Feed Widget in Silverlight

Posted by Diptimaya Patra Articles | WPF with C# May 24, 2009
RSS Feed Widget in Silverlight using Expression Blend 3.
Reader Level:
 

Introduction

This is a new widget of my recent posts in c-sharpcorner. This widget is called RSS Feed Widget. The basic functionality of this widget is to display the Links when the RSS Feed is provided. The following figure will describe you everything.

RSSFeedWidget1.gif

Figure 1.1 RSS Feed Widget

Steps

To begin with we need the following requirements:

  1. Silverlight 3
  2. Visual Studio 2008 SP1
  3. Expression Blend 3

Creating a Silverlight Project with or without RIA enabled.

  1. Create project in Visual Studio and open the solution in Expression Blend 3.
  2. The following figure will guide you for that.

RSSFeedWidget2.gif

Figure 1.2 Create a new Silverlight project

RSSFeedWidget3.gif

Figure 1.3 Uncheck the bottom checkbox to create the project without RIA support

Designing the User Control in Expression Blend 3

The User Control we are going to make should contain a background which matches a RSS Feed. I am taking a simple .png file which is looking simple.

RSSFeedWidget4.gif

Figure 1.4 RSS Feed Background.

Now our task is to add textbox, datagrid and image to fulfill our requirement. The following figure describes the design of the grid.

RSSFeedWidget5.gif

Figure 1.5 Designing the grid and placing the required controls.

The XAML will look like the following after all the design changes above.

<Grid x:Name="LayoutRoot" Width="280" Height="280">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="0.043*"/>
            <ColumnDefinition Width="0.614*"/>
            <ColumnDefinition Width="0.114*"/>
            <ColumnDefinition Width="0.043*"/>
            <ColumnDefinition Width="0.186*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="0.086*"/>
            <RowDefinition Height="0.057*"/>
            <RowDefinition Height="0.086*"/>
            <RowDefinition Height="0.045*"/>
            <RowDefinition Height="0.64*"/>
            <RowDefinition Height="0.086*"/>
        </Grid.RowDefinitions>
        <Canvas Grid.ColumnSpan="5" Grid.RowSpan="6">
            <Image Source="image/rss.png" Width="270" Height="270" Canvas.Left="5" Canvas.Top="5"/>

        </Canvas>
        <Image x:Name="btnFetch" Source="image/rssButton.png" Grid.Column="2" Grid.Row="2" MouseLeftButtonDown="btnFetch_MouseLeftButtonDown" ToolTipService.ToolTip="Click To get all RSS Feeds" Curser="Hand" />
        <TextBlock HorizontalAlignment="Center" Grid.Column="1" Grid.Row="1" Text="Enter RSS Feed URL" TextWrapping="NoWrap"/>
        <TextBox x:Name="txtFeedLoc" Grid.Column="1" Grid.Row="2" Height="20" FontSize="9" Text="" TextWrapping="NoWrap" Margin="0,2,0,2" ToolTipService.ToolTip="Copy and Paste the URL of the RSS feed"/>
 
        <data:DataGrid x:Name="dGrid" Grid.Column="1" Grid.Row="4" AutoGenerateColumns="False" 
                       IsReadOnly="True" CanUserSortColumns="True" AlternatingRowBackground="{x:Null}" Background="{x:Null}" Grid.ColumnSpan="3"
                       HeadersVisibility="Column" GridLinesVisibility="Horizontal"
                       FontSize="10" FontWeight="Normal" BorderBrush="{x:Null}">
            <data:DataGrid.Columns>
                <data:DataGridTemplateColumn IsReadOnly="True">
                    <data:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <StackPanel>
                                <HyperlinkButton Foreground="Black" Content="{Binding Path=Title}" NavigateUri="{Binding Path=NavURL}" TargetName="_blank"/>
                            </StackPanel>
                        </DataTemplate>
                    </data:DataGridTemplateColumn.CellTemplate>
                </data:DataGridTemplateColumn>
            </data:DataGrid.Columns>
        </data:DataGrid>
        <TextBlock x:Name="lblError" FontSize="8" Foreground="Red" Grid.Column="1" Grid.Row="3" Text="" HorizontalAlignment="Center" TextWrapping="Wrap"/>
    </Grid>

Getting RSS Feed from a particular RSS URI

For now we are collecting the rss feed URIs and pasting into our RSS Feed textbox, but in further enhancement we are planning to make use of the concept of caching. The following code is for a basic rss feed getter.

namespace RSSFeedSilverlightWidget
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
        }
        protected void LoadRSS(Uri uriFeed)
        {
            WebClient wc = new WebClient();

            wc.DownloadStringCompleted += new DownloadStringCompletedEventHandler(wc_DownloadStringCompleted);
            wc.DownloadStringAsync(uriFeed);
        }

        void wc_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
        {
            if (e.Error != null)
            {
                lblError.Text = "*URL has no Authentication";
                return;
            }

            lblError.Text = "";
            string xml = e.Result;
            if (xml.Length == 0)
                return;
            StringReader stringReader = new StringReader(xml);
            XmlReader reader = XmlReader.Create(stringReader);
            List<SyndicationItem> feedItems = new List<SyndicationItem>();
            SyndicationFeed feed = SyndicationFeed.Load(reader);
            foreach (SyndicationItem feedItem in feed.Items)
            {
                feedItems.Add(feedItem);
            }
            var posts = from item in feedItems
                        select new RSSFeed()
                        {
                            Title = item.Title.Text,
                            NavURL = item.Links[0].Uri.AbsoluteUri,
                            Description = item.Summary.Text
                        };
            dGrid.ItemsSource = posts;
            dGrid.Visibility = Visibility.Visible;
        }

        private void txtFeedLoc_GotFocus(object sender, RoutedEventArgs e)
        {
            lblError.Text = string.Empty;
        }

        #region Requesting for RSS Feed
        private void btnFetch_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            Uri feedUri;
            Uri.TryCreate(txtFeedLoc.Text, UriKind.Absolute, out feedUri);

            #region URI Validations
            if (feedUri == null)
            {
                if (txtFeedLoc.Text == "")
                {
                    lblError.Text = "*URL Field should not empty";
                }
                else
                {
                    lblError.Text = "*Invalid RSS feed URL";
                }
                return;
            }
            #endregion

            LoadRSS(feedUri);
        }
        #endregion

    }

    #region RSS Feeds class
    public class RSSFeed
    {
        public string Title { get; set; }
        public string NavURL { get; set; }
        public string Description { get; set; }
    }
    #endregion
}

Enjoy the RSS Feed Widget, hope you like it.

Login to add your contents and source code to this article
share this article :
post comment
 
6 Months Free & No Setup Fees ASP.NET Hosting!
Become a Sponsor
PREMIUM SPONSORS
  • Finally – a virtual platform that delivers next-generation Windows Server 2008 Hyper-V virtualization technology from a managed hosting partner you can truly depend on. Visit www.maximumasp.com/max for a FREE 30 day trial. Hurry offer ends soon. Climb aboard the MaxV platform and take advantage of High Availability, Intelligent Monitoring, Recurrent Backups, and Scalability – with no hassle or hidden fees. As a managed hosting partner focused solely on Microsoft technologies since 2000, MaximumASP is uniquely qualified to provide the superior support that our business is built on. Unparalleled expertise with Microsoft technologies lead to working directly with Microsoft as first to offer IIS 7 and SQL 2008 betas in a hosted environment; partnering in the Go Live Program for Hyper-V; and product co-launches built on WS 2008 with Hyper-V technology.
    ceTE software specializes in components for dynamic PDF generation and manipulation. The DynamicPDF™ product line allows you to dynamically generate PDF documents, merge PDF documents and new content to existing PDF documents from within your applications. Visit DynamicPDF here
Nevron Gauge for SharePoint
Become a Sponsor