全て展開
すべて折りたたむ前の手順では、C1ListBox コントロールをアプリケーションに追加しました。この手順では、フォトストリームから画像を表示するコードを追加します。
プログラムでコントロールにデータを追加するには、次の手順に従います。
- ［ページ］を選択して［プロパティ］ウィンドウに移動し、稲妻の［イベント］ボタンをクリックしてイベントを表示します。次に、下にスクロールして、Loaded イベントの横にある領域をダブルクリックします。
これで、コードエディタが開き、Page_Loaded イベントが追加されます。 - 次の imports 文をページの先頭に追加します。
Visual Basic コードの書き方
Visual Basic コードのコピーImports C1.Xaml
Imports System
Imports System.Collections.Generic
Imports System.IO
Imports System.Linq
Imports System.Net
Imports System.Xml.Linq
Imports Windows.Data.Html
Imports Windows.Foundation
Imports Windows.Foundation.Collections
Imports Windows.UI.Popups
Imports Windows.UI.Xaml
Imports Windows.UI.Xaml.Controls
Imports Windows.UI.Xaml.Controls.Primitives
Imports Windows.UI.Xaml.Data
Imports Windows.UI.Xaml.Input
Imports Windows.UI.Xaml.Media
Imports Windows.UI.Xaml.NavigationC# コードの書き方
C# コードのコピーusing C1.Xaml;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Net;
using System.Xml.Linq;
using Windows.Data.Html;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Popups;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation; -
Page_Loaded イベントハンドラ内に次のコードを追加します。
Visual Basic コードの書き方
Visual Basic コードのコピーLoadPhotos() C# コードの書き方
C# コードのコピーLoadPhotos(); -
MainPage クラス内の Page_Loaded イベントの下に次のコードを追加します。
Visual Basic コードの書き方
Visual Basic コードのコピーPrivate Async Function LoadPhotos() As Task
Dim flickrUrl = "http://api.flickr.com/services/feeds/photos_public.gne"
Dim AtomNS = "http://www.w3.org/2005/Atom"
Dim photos = New List(Of Photo)()
Dim client = WebRequest.CreateHttp(New Uri(flickrUrl))
Dim response = Await client.GetResponseAsync()
Try
'#Region "** parse data"
Dim doc = XDocument.Load(response.GetResponseStream())
For Each entry As XElement In doc.Descendants(XName.[Get]("entry", AtomNS))
Dim title = entry.Element(XName.[Get]("title", AtomNS)).Value
Dim enclosure = entry.Elements(XName.[Get]("link", AtomNS)).Where(Function(elem) elem.Attribute("rel").Value = "enclosure").FirstOrDefault()
Dim contentUri = enclosure.Attribute("href").Value
photos.Add(New Photo() With { _
.Title = title, _
.Content = contentUri, _
.Thumbnail = contentUri.Replace("_b", "_m") _
})
Next
'#End Region
listBox.ItemsSource = photos
loading.Visibility = Visibility.Collapsed
listBox.Zoom = C1ZoomUnit.Fill
listBox.Visibility = Visibility.Visible
Catch
Dim dialog = New MessageDialog("There was an error when attempting to download data from Flickr.")
dialog.ShowAsync()
End Try
End FunctionC# コードの書き方
C# コードのコピーprivate async void LoadPhotos()
{
var flickrUrl = "http://api.flickr.com/services/feeds/photos_public.gne";
var AtomNS = "http://www.w3.org/2005/Atom";
var photos = new List<Photo>();
var client = WebRequest.CreateHttp(new Uri(flickrUrl));
var response = await client.GetResponseAsync();
try
{
#region ** parse data
var doc = XDocument.Load(response.GetResponseStream());
foreach (var entry in doc.Descendants(XName.Get("entry", AtomNS)))
{
var title = entry.Element(XName.Get("title", AtomNS)).Value;
var enclosure = entry.Elements(XName.Get("link", AtomNS)).Where(elem => elem.Attribute("rel").Value == "enclosure").FirstOrDefault();
var contentUri = enclosure.Attribute("href").Value;
photos.Add(new Photo() { Title = title, Content = contentUri, Thumbnail = contentUri.Replace("_b","_m") });
}
#endregion
listBox.ItemsSource = photos;
loading.Visibility = Visibility.Collapsed;
listBox.Zoom = C1ZoomUnit.Fill;
listBox.Visibility = Visibility.Visible;
}
catch
{
var dialog = new MessageDialog("There was an error when attempting to download data from Flickr.");
dialog.ShowAsync();
}
} - 上のコードは、Flickr のパブリックフォトストリームから画像を取得し、それらの画像のリストに C1ListBox を連結します。
-
MainPage クラスの直後に次のコードを追加します。
Visual Basic コードの書き方
Visual Basic コードのコピーPublic Class Photo
Public Property Title() As String
Get
Return m_Title
End Get
Set(value As String)
m_Title = Value
End Set
End Property
Private m_Title As String
Public Property Thumbnail() As String
Get
Return m_Thumbnail
End Get
Set(value As String)
m_Thumbnail = Value
End Set
End Property
Private m_Thumbnail As String
Public Property Content() As String
Get
Return m_Content
End Get
Set(value As String)
m_Content = Value
End Set
End Property
Private m_Content As String
End ClassC# コードの書き方
C# コードのコピーpublic class Photo
{
public string Title { get; set; }
public string Thumbnail { get; set; }
public string Content { get; set; }
}
ここまでの成果
これで、C1TileListBox にデータを追加できました。次の「手順3：ListBox アプリケーションの実行」では、ListBox for UWP/WinRT XAML の機能について説明します。
関連トピック