カスタムコントロールを開発・ビルドして配布したあとで、外観をカスタマイズしたいとそのカスタムコントロールの利用者から要望を受けることがよくあります。Parts&Statesモデルはカスタムコントロール開発者のベストプラクティスで、カスタムコントロールの利用者が外観をExpression Blendでカスタマイズできるようにするためのものです。このモデルはWPFのカスタムコントロールにもSilverlightのテンプレートコントロールにも使えます。

詳しいコードは「外観をカスタマイズできるコントロールの作成」を参照してください。またTech-Ed 2010 ブレイクアウトセッション「T7-404 Windows Presentation Foundation 4 ~ ControlTemplate と Parts & States モデルによるカスタム コントロールの作り方 ~」のストリーミングが公開されたらご覧ください。

ベストプラクティス

  1. ControlTemplate を使ってデザインする
  2. コードではベストプラクティスに従う
  3. コード内でコントロール コントラクトを提供

1.ControlTemplateを使ってデザインする

ControlTemplateはControlクラスが提供するコントロールの外観と機能を分離する強力なプロパティです。Expression Blendを使えば、容易に画像や図形のような既存のビジュアルにボタンのようなコントロールの機能を与えることができます。

カスタムコントロールのUIをデザインするとき、コードの部分クラスとなるXAMLはありませんが、Themas\Generic.xamlにあるControlTemplateはBlendでデザインできます。リソースタブのGeneric.xamlに[リソースの編集]を使います。外観とUIのふるまいをコードで記述してはいけません。

image

2.コードではベストプラクティスに従う

  1. FrameworkElementが存在しない可能性を想定
    • 各FrameworkElementにx:Name属性を付与
    • 各FrameworkElementをプライベート プロパティで定義
    • イベントのサブスクライブとアンサブスクライブをsetアクセサーで行う
    • OnApplyTemplateメソッドでx:Nameとプライベート プロパティとを関連付ける
    • FrameworkElementが null でないことを確認
  2. Visual State Managerを使って状態を管理
    • プロパティを使用してその状態を追跡
    • 状態を遷移させるためのヘルパーメソッドを作成
    • ヘルパーメソッドを呼び出すタイミング
      • ControlTemplateが適用されたとき
      • プロパティが変化したとき
      • イベントが発生したとき

3.コード内でコントロール コンストラクトを提供

こんな感じです。ここではpartsとして2つのボタン要素、statesとしてpositive状態とnegative状態を提供しています。

    [TemplatePart(Name = "UpButtonElement", Type = typeof(RepeatButton))]
    [TemplatePart(Name = "DownButtonElement", Type = typeof(RepeatButton))]
    [TemplateVisualState(Name = "Positive", GroupName = "ValueStates")]
    [TemplateVisualState(Name = "Negative", GroupName = "ValueStates")]

 

するとBlendに以下のように状態とパーツが表示され、利用できます。

image image

 

 

例えば、左がコントロールテンプレート（Generic.xaml）で、右が使用者がカスタマイズしたものです。

image image