SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

特集記事

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

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

  • X ポスト
  • このエントリーをはてなブックマークに追加

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

  • X ポスト
  • このエントリーをはてなブックマークに追加

 サンプルファイルでは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です。

会員登録無料すると、続きをお読みいただけます

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

次のページ

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
特集記事連載記事一覧

もっと読む

この記事の著者

επιστημη(エピステーメー)

C++に首まで浸かったプログラマ。Microsoft MVP, Visual C++ (2004.01~2018.06) "だった"りわんくま同盟でたまにセッションスピーカやったり中国茶淹れてにわか茶...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/7273 2013/07/29 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング