次の方法で共有


スタイル リソースの作成

このページは WPF および Silverlight 2 に適用されます

Microsoft Expression Blend 2 プロジェクトのコントロールのスタイルを使用して、そのスタイルを適用するコントロールが既定で使用するトリガ (WPF) または状態 (Silverlight 2)、およびプロパティを指定できます。プロパティ (背景ブラシの色など) はコントロールの外観に影響を与え、トリガまたは状態はプロパティの変化やイベントに対するコントロールの応答方法に影響を与えます。たとえば、ユーザーがマウスをコントロールの上に移動すると、IsMouseOver プロパティが False から True に変わり、MouseOver イベントが発生します。マウス ポインタがボタン上で移動したときに、ボタンの背景色を変更するボタンのスタイルを作成できます。コントロールの構造を変更する場合は、「コントロール テンプレートの作成または編集」を参照してください。

スタイルはリソースなので、ボタンとは別にスタイルを保存し、スタイル リソースを他のボタン オブジェクトに適用します。リソースの詳細については、このユーザー ガイドの「リソースの概要」を参照してください。

コントロールの新規スタイル リソースを作成するには

  1. アートボード上、または [組み合わせ] パネルの [オブジェクトとタイムライン] で、スタイルを作成するオブジェクトを選択します。

  2. [オブジェクト] メニューの [スタイルの編集] をポイントし、次のいずれかの操作を行います。

    • 空のスタイルを新規作成する場合は、[空アイテムの作成] をクリックします。シェイプ コントロール (Rectangle など) とテキスト コントロール (TextBox など) の場合、利用できるのはこのオプションだけです。

    • 選択したオブジェクトの現在のスタイル (オブジェクトの既定のスタイル、または以前に作成したカスタム スタイル) に基づいて新しいスタイルを作成するには、[コピーの編集] をクリックします。

    [スタイル リソースの作成] ダイアログ ボックスが表示されます。

  3. [リソース名 (キー)] で、次のいずれかの操作を行います。

    • 要素に対して新しい名前のスタイルを作成するには、キー名を入力します。これは、他の要素がスタイルを参照し、スタイルを適用するときに使用する名前です。

    • 同じ型のすべての要素によって使用されるスタイルを作成するには、[すべてに適用] を選択します。

      Cc294740.alert_tip(ja-jp,Expression.10).gifヒント :

      このスタイル要素に対して作成される XAML では、TargetType という名前の属性に、そのスタイルの作成対象の要素の型が設定されます。

      x:Key 属性は、キー名 (上記の最初のオプション) を入力した場合にのみ設定されます。x:Key 属性は、名前でスタイルを指定する要素に対して、スタイルを適用する場合にのみ使用できます。x:Key 属性が設定されていない場合は、同じ型のすべての要素にスタイルが適用されます。たとえば、次のスタイル要素は、アートボード上のすべてのボタンには適用されません。

      <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}"...

  4. [定義元] で、スタイルを定義する場所に該当するオプションを選択します。

    • アプリケーション内の任意ドキュメントでスタイルを使用できるようにする場合は、[アプリケーション] を選択します。

    • スタイルを現在のドキュメントでのみ使用できるようにする場合は、[このドキュメント] ([Window: Window]) を選択します。

    • 他のプロジェクトで再利用できるリソース ディクショナリ ファイルにスタイルを定義する場合は、[リソース ディクショナリ] を選択します。次に、既存のリソース ディクショナリ ファイルを選択するか、[新規] ボタンをクリックしてファイルを新規作成することができます。

      Cc294740.alert_note(ja-jp,Expression.10).gifメモ :

      リソース ディクショナリは、Silverlight 2 ではサポートされていません。

  5. [OK] をクリックしてダイアログ ボックスを閉じ、スタイルを開いて編集します。

    Cc294740.alert_tip(ja-jp,Expression.10).gifヒント :

    ここでは、事実上、新しいスタイル リソースを作成しています。このリソースはローカル リソースとなり、[リソース] パネルを使用して簡単に表示および変更することができます。

  6. アートボードの上部に新しい Expression Blend 2 階層リンク バーが表示されます。

    テンプレート編集モード選択時の階層リンク バー

    Cc294740.eb50efd9-44c6-41f9-8f50-7d40f6c42e61(ja-jp,Expression.10).png

    階層リンク バーのボタンをクリックすることで、選択済みのオブジェクトに対するテンプレート編集モード、スタイル編集モード、およびオブジェクト編集スコープを簡単に切り替えることができます。階層リンク バーは、選択したオブジェクトにカスタム スタイルまたはテンプレートが適用されている場合に表示されます。

  7. [組み合わせ] パネルにプロパティとイベント トリガを追加します。設定するトリガの例については、このユーザー ガイドの「オブジェクトからのボタン作成」、または「簡易スタイル」の「試してみよう」のトピックを参照してください。

  8. スタイルの編集スコープを終了するには、[オブジェクトとタイムライン] の [上へスコープ] Cc294740.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(ja-jp,Expression.10).png ボタンをクリックします。

    以前に作業していた編集スコープに戻ります。

    Cc294740.alert_tip(ja-jp,Expression.10).gifヒント :

    オブジェクトに対してスタイル リソースを作成または適用すると、選択したオブジェクトの [プロパティ] パネルで、Style プロパティが 緑色でハイライトされます。これは、オブジェクトがこのスタイル リソースにバインド (リンク) されていることを示します。

関連項目

概念

スタイル リソースの適用

スタイルとテンプレートの概要

簡易スタイル