Room metro #28 XAML Day

XAML Advent Calendar、今年も始まりました!
http://qiita.com/advent-calendar/2014/xaml

さっそく 1 日目担当ということで、この辺のライブラリ作成 で得たコントロール作成周りのネタを放出します。

…が、なんと Room metro #28 XAML Day にてすべて話してきてしまったので、今回はその資料を公開! ということで。。。

[slideshare id=42207950&doc=roadtouilibrary-141201043432-conversion-gate02]

セッション中、半分くらいの時間はスライドではなく実際に Visual Studio を動かしてコードを書くデモを行っていたので、スライドだけ見ると物足りないかも… (これでも、デモしたコーディングや操作の手順はなるべくスライドに記載しました)。

以下、重要な部分等の抜粋などなど。

UI の再利用のために

以前からこのブログでも何度も書いているのですが、最近の Windows Desktop アプリでは、標準 Chrome を使用せずモダンな外観になっているものが多くなっています。
標準コントロールの組み合わせだけで作るのではなく、Style や Template、そしてコントロールを自作するというシチュエーションも増えてきているのではないでしょうか。

そこで、せっかく自作するのであればライブラリとして再利用できる形にまとめることを意識しよう、ということで、今回のセッションではコントロールの自作に焦点を絞り、その方法の選択や注意点などをまとめています。

コントロールの選択、自作するのか否か

WPF や WinRT、その他 Toolkit 等で提供されていない UI (外観や操作) を実現する手段は複数考えられます。

  • Style / ControlTemplate の変更
  • Trigger + Action / Behavior の使用
  • 新たなコントロールの作成

セッションではかなり後半 (スライド 47 ページ目) になってしまいましたが、実現したいコントロールの価値命題が何なのかをハッキリさせることが重要です。
そして、XAML Platform におけるコントロールの価値命題とはその原理や振る舞いであり、外観は含まれません (なぜなら、Style や Template といった仕組みによって、見た目はいくらでも変更できるからです)。

よって、今から作ろうとしているコントロールがどういう振る舞いをするのかを考えましょう。
マウスのクリックによる On/Off を表現したいのであれば、大抵は ToggleButton の外観を変更するだけで何とかなります。
同様に、何らかの項目を並べて表示したいのであれば、ItemsControl (またはその派生型) を使いましょう (去年の XAML Advent Calendar 参照)。

このように、もし既存コントロールの振る舞いと同じで、見た目だけが異なるものが欲しい場合、それは Style や Template で実現できます。

既存コントロールにない振る舞いを求められる場合は、新たにコントロールを作成することになります。
スライドでは NumericUpDown を例にしています (WinForms にはあって WPF にないコントロールの鉄板ネタですね)。

再利用可能なコントロール

新たなコントロールを作ることになったとして、UserControl 型から派生して作成する方法と、Control 型から派生して作成する方法 (= Custom Control) があります。

それぞれの特徴はスライドの通りです。

  • User Control
    • UserControl 型から派生
    • Window や Page と同じ感覚で作れる
    • 複雑なカスタマイズはできない
  • Custom Control
    • Control 型から派生 (WPF や WinRT が提供するコントロールと同じ実装方法)
    • ロジックと外観を分離させた作り
    • 複雑なカスタマイズもサポートできる

ライブラリにするのであれば、再利用時に複雑なカスタマイズが可能な Custom Control で作った方がよい場合が多いです。
カスタマイズを阻害しないために、ロジックと外観をしっかり分離させることが重要です (スライド 32-33 ページ目)。


XAML Advent Calendar 2014、明日は @KatsuYuzu さんです。
よろしくお願いします!

This entry was posted in 未分類. Bookmark the permalink.

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です