執筆者: PROJECT KySS 薬師寺 国安

動作確認環境: Visual Studio 2010 + SP1、Silverlight 4、Windows 7 Professional (32 ビット) + SP1


DomainUpDown コントロールは Silverlight4 Tookit に含まれていますので、「Silverlight_4_Toolkit_April_2010.msi」をダウンロードしてインストールしてください。

DomainUpDown コントロールを使うと、上下のスピン ボタンでデータを順次表示させることができます。

新しいソリューションとして Silverlight アプリケーションを作成します。ここではソリューション名に "SL4_DomainUpDown" を指定します。また、LINQ to XML を利用するために、Visual Studio 2010 のメニュー「プロジェクト」、「参照の追加」から、 System.Xml.Linq を追加しておいてください。

[XAML] DomainUpDown コントロールを使用してデータを表示する方法 (MainPage.xaml)

DomainUpDown コントロールを配置し、IsCyclic プロパティに True を指定して、データを循環して表示させるようにしておきます。

<toolkit:DomainUpDown.ItemTemplate> プロパティ要素内に <DataTemplate>、<StackPanel> 要素を記述し、子要素として <TextBlock> 要素を記述します。

<TextBlock> 要素の Text プロパティには「ID、氏名、年齢、住所、勤務先」をバインドしておきます。ここでバインドに使用する名称は、VB コード内のクラスで定義するプロパティ名です。

XAML
スクリプトの編集|{#scriptcode_dlg.remove_script}
<UserControl x:Class="SL4_DomainUpDown.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    Width="800" Height="600"  
xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit" 
    <Grid x:Name="LayoutRoot" Background="White"        <toolkit:DomainUpDown Height="273" HorizontalAlignment="Left" Margin="67,53,0,0" Name="DomainUpDown1" VerticalAlignment="Top" Width="652" IsCyclic="True"            <toolkit:DomainUpDown.ItemTemplate                <DataTemplate                    <StackPanel                        <TextBlock Text="{Binding ID}" FontSize="24" FontWeight="Bold" Padding="5"/> 
                        <TextBlock Text="{Binding 氏名}" FontSize="24" FontWeight="Bold" Padding="5"/> 
                        <TextBlock Text="{Binding 年齢}" FontSize="24" FontWeight="Bold" Padding="5"/> 
                        <TextBlock Text="{Binding 住所}" FontSize="24" FontWeight="Bold" Padding="5"/> 
                        <TextBlock Text="{Binding 勤務先}" FontSize="24" FontWeight="Bold" Padding="5"/> 
                    </StackPanel> 
                </DataTemplate> 
            </toolkit:DomainUpDown.ItemTemplate> 
        </toolkit:DomainUpDown> 
    </Grid> 
</UserControl>

[VB] コード ビハインド (MainPage.xaml.vb)

Visual Basic
スクリプトの編集|{#scriptcode_dlg.remove_script}
Option Strict On 
Imports System.Xml.Linq 
 
Public Class PersonalInfo 
    Property ID As String 
    Property 氏名 As String 
    Property 年齢 As String 
    Property 住所 As String 
    Property 勤務先 As String 
End Class 
Partial Public Class MainPage 
    Inherits UserControl 
 
    Public Sub New() 
        InitializeComponent() 
    End Sub 
 
    Private Sub MainPage_Loaded(sender As Object, e As System.Windows.RoutedEventArgsHandles Me.Loaded 
        Dim PersonalInfoDoc As XElement = <個人情報> 
                                              <情報> 
                                                  <ID>1001</ID> 
                                                  <氏名>愛媛花子</氏名> 
                                                  <年齢>30</年齢> 
                                                  <性別>女性</性別> 
                                                  <住所>松山市道後1-1-1</住所> 
                                                  <勤務先>道後IT株式会社</勤務先> 
                                              </情報> 
                                              <情報> 
                                                  <ID>1002</ID> 
                                                  <氏名>夏目団吾</氏名> 
                                                  <年齢>56</年齢> 
                                                  <性別>男性</性別> 
                                                  <住所>松山市湯渡2-2-2</住所> 
                                                  <勤務先>松山XMLセンター</勤務先> 
                                              </情報> 
                                              <情報> 
                                                  <ID>1003</ID> 
                                                  <氏名>九里杏子</氏名> 
                                                  <年齢>18</年齢> 
                                                  <性別>女性</性別> 
                                                  <住所>松山市文京町3-3-3</住所> 
                                                  <勤務先>伊予XSL株式会社</勤務先> 
                                              </情報> 
                                          </個人情報> 
 
        Dim myPersonalInfo As New List(Of PersonalInfo) 
 
        For Each result In From c In PersonalInfoDoc.Descendants("情報"Select c 
            With myPersonalInfo 
                .Add(New PersonalInfo With {.ID = result.Element("ID").Value, 
                                           .氏名 = result.Element("氏名").Value, 
                                           .年齢 = result.Element("年齢").Value, 
                                           .住所 = result.Element("住所").Value, 
                                           .勤務先 = result.Element("勤務先").Value}) 
            End With 
        Next 
        DomainUpDown1.ItemsSource = myPersonalInfo 
    End Sub 
End Class

PersonalInfo クラス内で、文字列型の「ID、氏名、年齢、住所、勤務先」プロパティを定義しておきます。

ページが読み込まれた時の処理 (MainPage_Loaded)

ここでは Visual Basic の埋め込み式を用いて、XML 要素リテラルで PersonalInfoDoc XML 要素を作成しています。

次に、PersonalInfo クラス型の myPersonalInfo というリストを作成しておきます。

Descendants メソッドで、子孫要素であるすべての <情報> 要素のコレクションに対して、各要素を変数 result に格納しながら、PersonalInfo クラスの各プロパティに、result.Element(要素名).Value で要素の内容テキストを指定していきます。

最後に DomainUpDown コントロールの ItemsSource に myPersonalInfo オブジェクトを指定します。

実行結果

実行結果は図 1 のようになります。

図 1

図 1 実行結果

上下スピン ボタンでデータが表示されている様子。

関連リンク


Code Recipe Code Recipe

 

ページのトップへ