DataGrid for WPF/Silverlight
RSS フィードへのグリッドの連結
製品の概要 > チュートリアル (Silverlight のみ) > RSS フィードへのグリッドの連結

次のチュートリアルでは、C1DataGrid コントロールを RSS フィードに連結するプロセスを説明します。この例では、グリッドを GrapeCity RSS ニュースフィード(http://feeds.feedburner.com/http/wwwgrapecitycom/japan)に連結します。URL を変更すれば、他の RSS フィードを購読することも可能です。

次の手順に従います。

  1. Visual Studio で、[ファイル]→[新しいプロジェクト]を選択します。
  2. [新しいプロジェクト]ダイアログボックスで、左ペインから言語を選択し(この例では C# を使用)、テンプレートリストから[Silverlight アプリケーション]を選択します。プロジェクトの名前(たとえば、「C1DataGridRSS」)を入力し、[OK]をクリックします。[新しい Silverlight アプリケーション]ダイアログボックスが表示されます。
  3. 既定の設定のまま[OK]をクリックすると、[新しい Silverlight アプリケーション]ダイアログボックスが閉じ、プロジェクトが作成されます。
  4. ソリューションエクスプローラウィンドウで、プロジェクト名(たとえば、C1DataGridRSS)を右クリックし、[参照の追加]を選択します。
  5. [参照の追加]ダイアログボックスで System.Xml.Linq ライブラリを見つけ、[OK]をクリックすると、参照がプロジェクトに追加されます。
  6. プロジェクトの XAML ウィンドウで、カーソルを タグと タグの間に置き、1回クリックします。
  7. ツールボックスに移動し、[C1DataGrid]アイコンをダブルクリックして、MainPage.xaml にグリッドコントロールを追加します。XAML マークアップは次のようになります。
    XAML
    コードのコピー
    <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>
    
    C1.Silverlight.DataGrid 名前空間と<c1:C1DataGrid></c1:C1DataGrid>タグがプロジェクトに追加されていることがわかります。
  8. <c1:C1DataGrid>タグが既存のコンテンツを含む場合、コンテンツを削除します。タグは次のように表示されます。
    XAML
    コードのコピー
    <c1:C1DataGrid></c1:C1DataGrid>
    
  9. x:Name="c1DataGrid1" を<c1:C1DataGrid>タグに追加して、グリッドに名前を付けます。次のようになります。
    XAML
    コードのコピー
    <c1:C1DataGrid x:Name="c1DataGrid1">
    
    コントロールに一意の識別子を付けると、コードでその C1DataGrid コントロールにアクセスできるようになります。
  10. <c1:C1DataGrid>タグに AutoGenerateColumns="True" を追加します。次のようになります。
    XAML
    コードのコピー
    <c1:C1DataGrid x:Name="c1DataGrid1" AutoGenerateColumns="True">
    
    このように、グリッドはデータをデータソースから自動的に生成して表示します。
  11. ソリューションエクスプローラで、MainPage.xaml ノードを展開し、MainPage.xaml.cs または MainPage.xaml.vb ファイルをダブルクリックしてコードエディタで開きます。
  12. 次の using 文または Imports 文をファイルの先頭に追加します。
    コードのコピー
    Imports System.Xml.Linq
    
    コードのコピー
    using System.Xml.Linq;
    
  13. MainPage コンストラクタで、イベントハンドラを追加し、RSS フィードから読み取るために WebClient オブジェクトを設定します。次のコードを使用します。
    コードのコピー
    Public Sub New()
        InitializeComponent()
        Dim client As New WebClient()
        Dim uri As New Uri("http://feeds.feedburner.com/http/wwwgrapecitycom/japan")
        AddHandler client.DownloadStringCompleted, AddressOf client_DownloadStringCompleted
        client.DownloadStringAsync(uri)
    End Sub
    
    コードのコピー
    public Page()
    {
        InitializeComponent();
        WebClient client = new WebClient();
        Uri uri = new Uri("http://feeds.feedburner.com/http/wwwgrapecitycom/japan");
        client.DownloadStringCompleted +=
         new DownloadStringCompletedEventHandler(client_DownloadStringCompleted);
        client.DownloadStringAsync(uri);
    }
    
  14. News クラスを追加します。
    コードのコピー
    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. client_DownloadStringCompleted イベントハンドラを追加します。
    コードのコピー
    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}
        c1DataGrid1.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")
            };
        c1DataGrid1.ItemsSource = news;
    }
    
  16. アプリケーションを実行し、グリッドが Silverlight RSS ニュースフィードに連結していることを確認します。

ここまでの成果

おめでとうございます。このチュートリアルは終了です。このトピックでは、新しい Silverlight プロジェクトを作成し、C1DataGrid コントロールを追加し、グリッドを RSS フィードに連結する方法を学びました。