第一回 Windows デベロッパーカンファレンスin東京で発表したときのスライドです

1. Windows ストア ア テンプレート活用につ
いて
プリの上手な作り方 2012/09/22
大田 一希@okazuki

2. 自己紹介
大田 一希
Microsoft MVP for Client App Dev 2011/07～
Twitter: @okazuki
Blog
かずきのBlog@Hatena
http://d.hatena.ne.jp/okazuki/
Love
犬

3. 本日の環境について

4. 今日の目的 目指すところ

5. 目指すところ
Windows ストア アプリを作れる気になる
Visual Studio
Blend for VS テンプレート
2012

6. アジェンダ
Windows ストア アプリ
 プロジェクトテンプレート
 アイテムテンプレート
アイテムテンプレート
 色々な見た目への対応
まとめ

7. Windows ストア ア
プリ

8. プロジェクトテンプレート
新しいアプリケーション(XAML)
グリッド アプリケーション(XAML)
分割アプリケーション(XAML)

9. プロジェクトテンプレート
新しいアプリケーション(XAML)
グリッド アプリケーション(XAML)
分割アプリケーション(XAML)

10. グリッド アプリケーション
(XAML)
基本的な3段の階層構造のデータを表示するアプリケーション
のテンプレート
重要なエッセンスが凝縮されている

11. DEMO
グリッドアプリケーション

12. プロジェクトの中身
Commonフォルダが宝の山
 BindableBaseクラス
 BooleanNegationConverterクラス
 BooleanToVisibilityConverterクラス
 LayoutAwarePageクラス
 RichTextColumnsクラス
 StandardStyles.xaml
 SuspensionManagerクラス

13. プロジェクトの中身
今日紹介したいもの
 BindableBaseクラス
 BooleanNegationConverterクラス
 BooleanToVisibilityConverterクラス
 LayoutAwarePageクラス
 RichTextColumnsクラス
 SuspensionManagerクラス
 StandardStyles.xaml

14. ゴミの山？
知っててスルーするのはOK
知らないのはもったいない

15. BindableBaseクラス
INotifyPropertyChangedインターフェースの実装クラス
class Person : BindableBase
{
private string name;
public string Name
{
get { return this.name; }
set { this.SetProperty(ref this.name, value); }
}
private int age;
public int Age
{
get { return this.age; }
set { this.SetProperty(ref this.age, value); }
}
}

16. BindableBaseクラス
従来の一般的なプロパティの書き方
private string name;
public string Name
{
get { return this.name; }
set
{
if (this.name == value)
{
return;
}
this.name = value;
this.OnPropertyChanged("Name");
}
}

17. LayoutAwarePageクラス
DefaultViewModelプロパティ
 XAMLでDataContextへバインドされている
 IObservableMap<string, object>型
 {Binding Path=キー名}でバインド可能
 ここにデータを入れてXAMLでバインドする
中断処理への対応
 LoadState(object navigationParameter, Dictionary<string, object>
pageState)
 SaveState(Dictionary<string, object> pageState)

18. LayoutAwarePageクラス
SuspensionManagerとの連携
 画面遷移履歴も保持
スナップ・ポートレイト用のVisual Stateの定義
 BlendやVisual Studioもこれを前提にしている

19. アイテム 色々な見た目への対応
テンプレート

20. アイテムテンプレート
空白のページ
基本ページ
分割ページ
項目ページ
アイテム詳細ページ
グループ化された項目ページ
グループ詳細ページ

21. アイテムテンプレート
空白のページ
基本ページ
分割ページ
項目ページ
アイテム詳細ページ
グループ化された項目ページ
グループ詳細ページ

22. アイテムテンプレート
スナップ対応
ポートレイト対応
ランドスケープ対応

23. アイテムテンプレートの
基本構造
LayoutAwarePage
XAML コードビハインド
Other Data
Control Context DefaultVeiwModel
アプリケーションの
ロジック
GridView データ構造
Collection
イベントハンドラ 通信
ViewSource
UIロジック
ListView
SuspensionManager（中断への対応）

24. DEMO
スナップとかへの対応

25. まとめ
用意されてるものを把握して使い倒そう
 BindableBase
 LayoutAwarePage
 各種テンプレート
アプリケーションの構成はテンプレートから大きく変えない
 楽が出来る。早く仕上がる。
（本気で作りこむなら自作プロジェクトテンプレートやアイテムテンプ
レートをそろえるという前準備が必要）
Blend for VSで自分の色を出す