C++/CX: 「Windows 8 ストアアプリことはじめ」で忘れていたこと

データの集合をバインドする

　 「ストアアプリことはじめ」と題し2本のアーティクルを公開したんですけど…ごめんなさい、データ・バインディングのお話をまとめたところで気が抜けたか、ことはじめには欠かせない、大事なトピックを書き損ねていました。何をいまさらで申し訳ないのですけど書かずに済ますのもどうかと思うので、小ネタですけどお許しいただきたく。データ列とのバインディングのお話です。

※

　サンプルファイルではstep3,step4が本アーティクルに対応します。

データ列とのバインディング

　ことはじめとことはじめ（2）で解説したのはUI要素の基本のキであるTextBlock（とButton）の扱いでした。TextBlockは"1つ"のデータと利用者とを繋ぐ窓口として機能します。ならば"複数"のデータ（データ列）についてはどうなんだ、と。

　ここまでのサンプル:CounterAppに操作履歴:Historyをくっつけてみました。

　HistoryはXAMLコントロールの一つ：ListViewで実現しており、ListViewに並ぶ各項は何をやったか（What）といつやったか（When）をTextBlockの二段重ねで構成しています。

　XAMLを見ていただきましょうか：

list01 "操作履歴を追加したMainPage.xaml（抜粋）"

        <Grid Grid.Row="1" x:Name="CounterPage"> <!-- x:Name をココに移動 -->
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="120"/>
                <ColumnDefinition Width="1*"/>
                <ColumnDefinition Width="2*"/> <!-- 一列追加: ここにListViewを置く -->
            </Grid.ColumnDefinitions>
            <Grid Grid.Column="1" >
                <TextBlock ... />
                <Button ... />
                <Button ... />
            </Grid>
            <!-- 新たに追加: ここから -->
            <ListView Grid.Column="2" ItemsSource="{Binding History}">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Vertical">
                            <TextBlock Text="{Binding What}" FontSize="40"/>
                            <TextBlock Text="{Binding When}" FontSize="20"/>
                        </StackPanel>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
            <!-- 新たに追加: ここまで -->
        </Grid>

　XAML上にListViewを置き、ItemsSource="{Binding History}"とすることでデータ提供側のHistoryプロパティにバインドします。

　ListViewの各項はItemTemplate内のDataTemplateで定義しています。2つのTextBlockをStackPanelで二段重ねにし、それぞれWhatとWhenにバインド。"What/Whenの2つのプロパティを持ったナニか"の列を返すプロパティ:Historyをデータ提供側が用意することになりますな。

　"What/Whenの2つのプロパティを持ったナニか"を作ります。

list02 "OperationRecord.h"

#pragma once

namespace CounterApp {

  [Windows::UI::Xaml::Data::Bindable]
  public ref class OperationRecord sealed {
  public:
    OperationRecord(Platform::String^ what, Windows::Foundation::DateTime when);
    OperationRecord(Platform::String^ what);

    property Platform::String^             What;
    property Windows::Foundation::DateTime When;

  private:
    static Windows::Globalization::Calendar cal_;
  };

}

list03 "OperationRecord.cpp"

#include "pch.h"
#include "OperationRecord.h"

namespace CounterApp {

  OperationRecord::OperationRecord(Platform::String^ what, Windows::Foundation::DateTime when) {
    What = what;
    When = when;
  }

  OperationRecord::OperationRecord(Platform::String^ what) {
    What = what;
    When = cal_.GetDateTime();
  }

  Windows::Globalization::Calendar OperationRecord::cal_;
}

　WhatとWhenはそれぞれString^とDateTimeです。