step-2：ページサイズの表示
DeviceFamilyは実行中に不変なので起動時に一度だけ取得すればいいのですが、実行中にコロコロ変化し、さらに変化のたびにその旨をページに反映するとなると少しばかりややこしくなります。コードビハインドからXAMLページへ「変化した（から書き直してネ）！」と通知しなければなりませんからね。
DeviceFamilyの直下にTextBlockを置き、ページの横幅×高さを表示します。ページの隅っこをマウスでつまんでぐりぐりすれば、幅と高さをリアルタイムに表示させようって魂胆です。プロパティ：Dimensionsを、追加したTextBlockのText属性にバインドします。
バインド・パラメータにある"Mode=OneWay"は、ソース（データの提供側）からコントロールへのOneWay（一方向）バインドであることを示しています。
コードビハインドすなわちclass MainPageがソース（データの提供側）です。MainPageからXAMLページに対し「プロパティ値が変化した！」ことを通知するには、class MainPageがINotifyPropertyChangedインターフェースを実装していなければなりません。プロパティ（Property）が変化した（Changed）ことを通知する（Notify）インターフェース（I）です。で、INotifyPropertyChangedを実装するからには、通知の発信源となるイベント：PropertyChangedをpublicメンバに置くことになります。それともう一つ、サイズ変化に反応するイベントハンドラ：MainPage_SizeChangedを追加します。
//
// MainPage.xaml.h
// MainPage クラスの宣言。
//
#pragma once
#include "MainPage.g.h"
namespace HelloUWP {
/// <summary>
/// それ自体で使用できる空白ページまたはフレーム内に移動できる空白ページ。
/// </summary>
public ref class MainPage sealed : Windows::UI::Xaml::Data::INotifyPropertyChanged {
public:
MainPage();
property Platform::String^ DeviceFamily { Platform::String^ get(); }
property Platform::String^ Dimensions { Platform::String^ get(); }
virtual event Windows::UI::Xaml::Data::PropertyChangedEventHandler^ PropertyChanged;
private:
// サイズ変化時のイベントハンドラ
void MainPage_SizeChanged(Platform::Object ^sender, Windows::UI::Xaml::SizeChangedEventArgs ^e);
double currentWidth_; // 現在の横幅
double currentHeight_; // 現在の高さ
};
}
MainPage.xaml.cppではサイズ変更イベントに反応するイベントハンドラ：MainPage_SizeChangedのアタッチをコンストラクタに仕込みます。MainPage_SizeChangedではサイズを取得し、プロパティ値が変化した旨をPropertyChangedにアタッチされた相手（ここではXAMLページ）に通知します。プロパティ：Dimensions::get() は得られたサイズから文字列："Current Window Size: <横幅> x <高さ>"を作って返します。実装はこれで完了。プロパティ値の変化を通知されたXAMLページは通知元のDimensionsプロパティをget()して描いてくれるってダンドリです。
//
// MainPage.xaml.cpp
// MainPage クラスの実装。
//
#include "pch.h"
#include "MainPage.xaml.h"
#include <string> // std::wstring
using namespace HelloUWP;
using namespace Platform;
using namespace Windows::Foundation;
using namespace Windows::Foundation::Collections;
using namespace Windows::UI::Xaml;
using namespace Windows::UI::Xaml::Controls;
using namespace Windows::UI::Xaml::Controls::Primitives;
using namespace Windows::UI::Xaml::Data;
using namespace Windows::UI::Xaml::Input;
using namespace Windows::UI::Xaml::Media;
using namespace Windows::UI::Xaml::Navigation;
// 空白ページのアイテム テンプレートについては、http://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409 を参照してください
MainPage::MainPage() {
InitializeComponent();
// サイズ変化時に MainPage_SizeChanged を呼ぶ
SizeChanged += ref new SizeChangedEventHandler(this, &MainPage::MainPage_SizeChanged);
}
String^ MainPage::DeviceFamily::get() {
return L"DeviceFamily : " + Windows::System::Profile::AnalyticsInfo::VersionInfo->DeviceFamily;
}
// サイズ変化時のイベントハンドラ
void MainPage::MainPage_SizeChanged(Platform::Object ^sender, SizeChangedEventArgs ^e) {
// 横幅と高さを取得し
currentWidth_ = Window::Current->Bounds.Width;
currentHeight_ = Window::Current->Bounds.Height;
// プロパティ:Dimensions が変化したことを通知する
PropertyChanged(this, ref new PropertyChangedEventArgs(L"Dimensions"));
}
// プロパティ:Dimensions
String^ MainPage::Dimensions::get() {
std::wstring str =
L"Current Window Size: " +
std::to_wstring((int)currentWidth_) + L" x " +
std::to_wstring((int)currentHeight_);
return ref new String(str.c_str());
}
こんなのができました。ページの隅っこマウスでつまんでぐりぐりしてみてくださいな。
ハンズオンセミナーの最初のセッション前半"Hello UWP"をC++/CXで再演しました。ページの作り方およびバインディングによるXAMLページとコードビハインドとの連携、UWPアプリの"はじめの一歩"を踏み出すオハナシですね。
セッションはまだ続きます。後編は複数のページを移動する方法（＋非同期処理を少しだけ）。
