狠狠撸

狠狠撸Share a Scribd company logo
Windows ストア ア   テンプレート活用につ
                いて

プリの上手な作り方       2012/09/22
                大田 一希@okazuki
自己紹介
大田 一希
Microsoft MVP for Client App Dev 2011/07~
Twitter: @okazuki
Blog
かずきのBlog@Hatena
http://d.hatena.ne.jp/okazuki/
Love
犬
本日の环境について
今日の目的   目指すところ
目指すところ
Windows ストア アプリを作れる気になる




Visual Studio
                Blend for VS   テンプレート
2012
アジェンダ
Windows ストア アプリ
? プロジェクトテンプレート
? アイテムテンプレート

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

まとめ
Windows ストア ア
          プリ
プロジェクトテンプレート
新しいアプリケーション(XAML)
グリッド アプリケーション(XAML)
分割アプリケーション(XAML)
プロジェクトテンプレート
新しいアプリケーション(XAML)
グリッド アプリケーション(XAML)
分割アプリケーション(XAML)
グリッド アプリケーション
(XAML)
基本的な3段の階層構造のデータを表示するアプリケーション
のテンプレート
重要なエッセンスが凝縮されている
DEMO
グリッドアプリケーション
プロジェクトの中身
Commonフォルダが宝の山
? BindableBaseクラス
? BooleanNegationConverterクラス
? BooleanToVisibilityConverterクラス
? LayoutAwarePageクラス
? RichTextColumnsクラス
? StandardStyles.xaml
? SuspensionManagerクラス
プロジェクトの中身
今日紹介したいもの
? BindableBaseクラス
? BooleanNegationConverterクラス
? BooleanToVisibilityConverterクラス
? LayoutAwarePageクラス
? RichTextColumnsクラス
? SuspensionManagerクラス
? StandardStyles.xaml
ゴミの山?
知っててスルーするのはOK
知らないのはもったいない
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); }
    }
}
BindableBaseクラス
従来の一般的なプロパティの書き方
private string name;
public string Name
{
    get { return this.name; }
    set
    {
        if (this.name == value)
        {
            return;
        }

        this.name = value;
        this.OnPropertyChanged("Name");
    }
}
LayoutAwarePageクラス
DefaultViewModelプロパティ
? XAMLでDataContextへバインドされている
? IObservableMap<string, object>型
? {Binding Path=キー名}でバインド可能
? ここにデータを入れてXAMLでバインドする

中断処理への対応
? LoadState(object navigationParameter, Dictionary<string, object>
  pageState)
? SaveState(Dictionary<string, object> pageState)
LayoutAwarePageクラス
SuspensionManagerとの連携
? 画面遷移履歴も保持

スナップ?ポートレイト用のVisual Stateの定義
? BlendやVisual Studioもこれを前提にしている
アイテム   色々な見た目への対応
テンプレート
アイテムテンプレート
空白のページ
基本ページ
分割ページ
項目ページ
アイテム詳細ページ
グループ化された項目ページ
グループ詳細ページ
アイテムテンプレート
空白のページ
基本ページ
分割ページ
項目ページ
アイテム詳細ページ
グループ化された項目ページ
グループ詳細ページ
アイテムテンプレート
スナップ対応
ポートレイト対応
ランドスケープ対応
アイテムテンプレートの
基本構造
                  LayoutAwarePage
           XAML                 コードビハインド

Other               Data
Control            Context      DefaultVeiwModel
                                                   アプリケーションの
                                                     ロジック

GridView                                            データ構造
                   Collection
                                イベントハンドラ              通信
                  ViewSource
                                 UIロジック
ListView




           SuspensionManager(中断への対応)
DEMO
スナップとかへの対応
まとめ
用意されてるものを把握して使い倒そう
? BindableBase
? LayoutAwarePage
? 各種テンプレート

アプリケーションの構成はテンプレートから大きく変えない
? 楽が出来る。早く仕上がる。
  (本気で作りこむなら自作プロジェクトテンプレートやアイテムテンプ
  レートをそろえるという前準備が必要)

Blend for VSで自分の色を出す

More Related Content

Windows ストア アプリの上手な作り方