SimpleButton

  • [アーティクル]

このページは WPF プロジェクトにのみに適用

ボタンは、Click イベントに反応するコンテンツ コントロールです。Microsoft Expression Blend でボタンにコンテンツを配置するには、ボタンをダブルクリックして、そのボタン内にオブジェクトを描画します。ボタンに複数のオブジェクトを配置する場合は、最初に Grid または Canvas などのレイアウト パネルに追加する必要があります。ボタンには、既定でテキストを表示することもできます。既定のテキストを編集するには、ボタンを右クリックして、[テキストの編集] をクリックします。

アートボード上の SimpleButton コントロール

Cc295207.de21bfee-f104-48ff-9f8a-b6cbf92a9fa7(ja-jp,Expression.40).png

コントロール テンプレートの構成要素

SimpleButton コントロール テンプレートは、次の要素で構成されています。

  • Grid レイアウト パネル   複数の子オブジェクトをボタン内に保持するために使用されます。また、Grid パネルを使用すると、テンプレートに複数のオブジェクトを簡単に追加できるので便利です。たとえば、ルート オブジェクトが Border であるときに別のオブジェクトを追加しようとした場合、Border には子を 1 つしか含めることができないため、新たに追加したオブジェクトで ContentPresenter オブジェクトが置換されてしまいます。

  • Border オブジェクト: BorderThickness プロパティが含まれています。このプロパティは、テンプレートの適用先ボタン コントロールの BorderThickness プロパティにテンプレート バインドできます。

  • ContentPresenter   テンプレートの適用先ボタンの Content プロパティを表示するために使用されます。このオブジェクトはボタンのコンテンツを表示するために必要です。

使用されるプロパティ トリガー

コントロール テンプレートのプロパティ トリガーは、プロパティの変更にコントロールを対応させるために使用されます。[トリガー] パネルのアイテムをクリックすると、トリガーがアクティブになると変更されるプロパティを表示できます。たとえば、SimpleButton テンプレートでは、IsMouseOver プロパティが True のときに、Border 要素の背景色が MouseOverBrush リソースに合わせて変わります。

使用されるブラシ

SimpleButton テンプレートでは、SimpleStyles.xaml リソース ディクショナリ内の次のブラシ リソースが使用されます。

  • Background プロパティは、アクティブなトリガーがないときは NormalBrush、IsMouseOver が True のときは MouseOverBrush、IsPressed が True のときは PressedBrush、IsEnabled が False のときは DisabledBackgroundBrush を使用して設定されます。

  • Border プロパティは、アクティブなトリガーがないときは NormalBorderBrush、IsKeyboardFocused が True のときは DefaultBorderBrush、IsPressed が True のときは PressedBorderBrush、IsEnabled が False のときは DisabledBorderBrush を使用して設定されます。

  • Foreground プロパティは、DisabledForegroundBrush (IsEnabled が False のとき) を使用して設定されます。

ベスト プラクティスおよびデザイン ガイドライン

  • 一般に、コントロールにビジュアル要素を追加する予定がある場合は、テンプレートのルートとして Grid コントロールを使用してください。Expression Blend は、既定では Grid コントロールなどのレイアウト パネルを検索してアクティブにします。これにより、アートボードに追加される新しいオブジェクトがレイアウト パネルの子オブジェクトになります。

  • ボタンのクリックなどのユーザー操作に応じてコントロールの外観を変更するには、プロパティ トリガーを使用します。通常は、イベント トリガーよりもプロパティ トリガーを使用した方が得策です。1 つのプロパティ トリガー (IsPressed 状態など) で実行できる処理を行うために、イベント トリガーが 2 つ (MouseDown イベントと MouseUp イベントに対して指定) 必要になるためです。ただし、イベント トリガーを使用すると、複雑なコントロールでアニメーション タイムラインを開始できます。

  • 一般に、IsMouseOver、IsPressed、および IsEnabled (False) の各状態に対して、ブラシやその他の視覚上の変化を設定します。また、IsKeyboardFocused 状態も便利です。この状態は、通常、コントロールの周囲に破線を表示するために使用されます。

関連項目

タスク

試してみよう: 効果を使用したボタンのスタイル
試してみよう: ボタンへのアニメーションの追加
試してみよう: ロールオーバー ボタンの作成

Copyright ©2011 by Microsoft Corporation. All rights reserved.