SimpleScrollBar
.png "このページは WPF プロジェクトにのみ適用されます。")
スクロール バーは、Value プロパティに応じた位置にバーのマーカーを表示する簡易コントロールです。Microsoft Expression Blend では、[プロパティ] パネルの [レイアウト] にある Orientation プロパティを使用して、スクロール バーの方向を設定できます。[プロパティ] パネルの [共通プロパティ] で、スクロール バーの最小値、最大値、および 現在の値を設定できます。現在の値は、最小値と最大値の間にする必要があります。
SimpleScrollBar コントロールのアートボード ビュー
.png "Cc295211.db3af5e5-8b09-42e7-b541-543b3b2bbcb3(ja-jp,Expression.10).png")
コントロール テンプレートの構成要素
SimpleScrollBar コントロール テンプレートには、次のアイテムが含まれます。
GridRoot という名前のグリッド パネル : スクロール バー内に複数の子要素を保持するために使用します。また、グリッドを使用すると、複数の要素を簡単にテンプレートに追加できます。グリッドは 3 行で構成され、上の行と下の行は最大サイズが設定され、18 ピクセルを超えて拡張できません (ピクセルとは、デバイスに依存しない単位であり、約 1/96 インチです)。中央の行のサイズはアスタリスク (*) で表され、ウィンドウの拡張に合わせて拡張されます。
DecreaseRepeat および IncreaseRepeat という名前の 2 つの RepeatButton 要素 : バー上のマーカーの位置を移動するために使用します。RepeatButton 要素には、矢印を表示する内容が含まれます。グリッドがそれぞれのルートとして使用されるので、Path 要素 (DecreaseArrow および IncreaseArrow) の編集と、その他の内容の追加を簡単に行えます。
PART_Track という名前の Track 要素 : バーに沿って Thumb 要素を表示するために使用します。バーに表示されるパーツは、PageDown および PageUp という 2 つの RepeatButton として機能します。どちらも、個別に編集可能な SimpleScrollRepeatButtonStyle テンプレートを使用します。Track の IncreaseRepeatButton および DecreaseRepeatButton セクションでは、Command バインドを使用してスクロール バー クラスのコマンドを呼び出すことができます。Thumb 要素では、個別に編集可能な SimpleThumbStyle テンプレートを使用します。
レイアウト変換 : スライダ バーを水平方向に表示するために使用します。この方法は、2 つの異なるテンプレートを編集する必要がある場合と比べて、編集が簡単です。ただし、2 つの方向のデザインを区別する必要がある場合は、個別のテンプレートが必要になります。この場合、Expression Blend の [XAML] ビューの <Style> 要素で Setter を使用し、方向に基づいてテンプレートを切り替えることができます。この例については、システム ScrollBar コントロールの既定のテンプレートを参照してください。
.gif "注意")
注意 :名前が "PART_" で開始する要素は、コントロールを実装するコードから参照されるため、名前を変更しないでください。
オブジェクト ビュー : SimpleScrollBar コントロールの基本パーツ (テンプレート)
.png "Cc295211.24716500-e135-474f-80cf-7091061569da(ja-jp,Expression.10).png")
.gif "Cc295211.7e183f1f-37d8-4dcb-980c-19a5d61ca087(ja-jp,Expression.10).gif")
先頭に戻る
使用されるプロパティ トリガ
コントロール テンプレートのプロパティ トリガは、プロパティの変更にコントロールを対応させるために使用されます。[組み合わせ] パネルの [トリガ] のアイテムをクリックすると、トリガがアクティブなときに変更されるプロパティを表示できます。たとえば、SimpleScrollBar テンプレートでは、Orientation プロパティが "水平方向" のときは、複数のプロパティが進行状況バーの新しい方向に合わせて変更されます。
先頭に戻る
使用されるブラシ
SimpleScrollBar テンプレートは、Foreground プロパティ用にシステム ブラシ リソースを 1 つだけ使用します。他のブラシ リソースは、SimpleRepeatButton、SimpleThumbStyle、SimpleScrollRepeatButtonStyle テンプレートなど、SimpleScrollBar が使用するテンプレートで参照されます。これらのテンプレートで使用されるブラシを変更して、SimpleScrollBar の外観を変えたり、新たにテンプレートを作成することができます。
先頭に戻る
ベスト プラクティスおよびデザイン ガイドライン
一般に、コントロールにビジュアル要素を追加する予定がある場合は、テンプレートのルートとして Grid コントロールを使用してください。Expression Blend は、既定では Grid コントロールなどのレイアウト パネルを検索してアクティブにします。これにより、アートボードに追加される新しい要素がレイアウト パネルの子要素になります。
SimpleScrollBar テンプレート は、ScrollViewer 用のテンプレートで使用されるスクロール バーに適用することができます。
SimpleScrollBar テンプレートでは他のテンプレートを使用するため、変更対象のテンプレートを見つけるまでに、さまざまなレベルのテンプレートを確認することが不便な場合があります。直接テンプレートを編集するには、[リソース] パネルのテンプレート名の横の [リソースの編集] ボタンをクリックします。次に、スタイルの編集モードで、[オブジェクトとタイムライン] の [スタイル] を右クリックし、[コントロール パーツ (テンプレート) の編集] をポイントして [テンプレートの編集] または [コピーの編集] をクリックします。別の簡単な方法として、サブテンプレートへの参照を削除 ([プロパティ] パネルの [その他] にある Style プロパティをリセット) し、第 1 レベルでテンプレートをデザインすることもできます。
コントロールを動作させるには、コントロールのクラスのコマンドを実行するコマンド バインドを保持し、コントロールとこれを表すクラスをバインドするための別の手段を備えておく必要があります。このようなバインドは、IncreaseRepeat、DecreaseRepeat、PageUp、および PageDown 要素の Command プロパティとトリガ (Orientation=Horizontal) にあります。
必要に応じて、SimpleScrollBar テンプレートにトリガを追加するか、PART_Track 要素内の要素を変更して、バーの外観を工夫することができます。ただし、PART_Track 要素またはその子要素は、コントロールを実装するコードから参照されているため、名前を変更しないでください。PART_Track 要素のパーツは Track.IncreaseRepeatButton、Track.DecreaseRepeatButton、Track.Thumb などの特定のコントロール ヘッダー下に配置されているため、PART_Track 要素はそれらのパーツを見つけることができます。Thumb も、ドラッグ可能な特定の WPF (Windows Presentation Foundation) コントロールです。
先頭に戻る