次の方法で共有

XAML WPF 描画ブラシとリソース ディクショナリ

  • [アーティクル]

XAML Windows Presentation Foundation (WPF) リソース ディクショナリに、Microsoft Expression Design アートワークを描画ブラシとして保存し、Microsoft Expression Blend 2 プロジェクトにインポートできます。Expression Blend 2 プロジェクトでは、描画ブラシを使用してオブジェクトを描画できます。たとえば、Expression Design でボタンの外観に使用するアートワークを作成し、リソース ディクショナリにアートワークをブラシ リソースとしてエクスポートします。その後、Expression Blend 2 にリソース ディクショナリをインポートし、ブラシ リソースをボタン コントロールの [背景] プロパティに適用したり、四角形の [塗りつぶし] プロパティに適用することができます。

また、XAML WPF リソース ディクショナリに、アートワークの 1 つまたは複数のスライスを個別の XAML ブラシ リソースとしてエクスポートすることもできます。

リソース ディクショナリは、アプリケーション固有の外観を構成するすべてのリソースを 1 つのファイルに含めることができるので便利です。Expression Blend 2 では、任意の WPF プロジェクトにリソース ディクショナリを追加でき、このリソース ディクショナリ内のブラシ リソースを、プロジェクト内の任意のオブジェクトのブラシ プロパティに適用できます。

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

エクスポートした XAML コード内の色は RGB に基づいており、カラー マネジメントは適用されていません。カスタムのカラー モニタ プロファイルを使用している場合は、Expression Design で表示される色と、最終的に XAML の編集に使用するソフトウェアで表示される色が異なることがあります。

アートワークをブラシ リソースとしてエクスポートする

XAML WPF リソース ディクショナリでアートをブラシ リソースとしてエクスポートするには

  1. [ファイル] メニューで [エクスポート] をクリックします。[エクスポート] ダイアログ ボックスで、アートワークがプレビュー ウィンドウに表示されます。

  2. [エクスポートするアイテム] で、次のいずれかのオプションを選択します。

    • [ドキュメント全体]   Expression Design ドキュメント内のすべてのアートワークをリソース ディクショナリのブラシ リソースとして自動的にエクスポートするには、このオプションを選択します。

    • [選択したオブジェクト]   [エクスポート] ダイアログ ボックスを開く前に選択したオブジェクトのみをエクスポートするには、このオプションを選択します。

    • [スライス]   アートワークのスライスを複数の出力ファイルと出力形式でエクスポートするには、このオプションを選択します。スライスは、[エクスポート] ダイアログ ボックスを開く前に構成されます。プレビュー ウィンドウで各スライスが個別に表示され、スライスごとに異なるエクスポート設定を指定できます。また、[スライスのコンテンツ] ドロップダウン ボックスを使用して、スライスのオブジェクトの表示と非表示を切り替えることができます。詳細については、「スライス」を参照してください。

  3. [エクスポート] ダイアログ ボックスの [形式] リストで、次のいずれかを選択します。

    • [XAML WPF リソース ディクショナリ]   ドキュメント全体または選択したオブジェクトをエクスポートする場合に、このオプションを選択します。このオプションを選択すると、[グループ化] プロパティで、1 つのレイヤーに対して 1 つのリソース (レイヤー)、トップレベル オブジェクトに対して 1 つのリソース (オブジェクト)、ドキュメント全体または選択したオブジェクトに対して 1 つのリソース (ドキュメント) をエクスポートするよう設定できます。たとえば、ドキュメント内の各レイヤーが、後に使用する Expression Blend 2 プロジェクトでそれぞれボタンを表すように設定する場合は、[レイヤー] を選択します。

    • [XAML WPF 描画ブラシ]   スライスをエクスポートする場合は、スライスごとにこのオプションを選択します。[形式] プロパティを設定する前に、Shift キーを使用して複数のスライスを選択し、[形式] プロパティを複数のスライスに設定できます。

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

      Expression Design では、スライスごとに描画ブラシを作成することを前提としていません。たとえば、スライスを PNG 形式でエクスポートし、この PNG ファイルを XAML WPF リソース ディクショナリ コンテナにエクスポートするとします。PNG ファイルは、エクスポートしたリソース ディクショナリ ファイルと同じディレクトリ内のサブフォルダにエクスポートされ、PNG ファイルは描画ブラシ リソースではなくイメージ ブラシ リソースとして参照されます。Expression Blend 2 プロジェクトでは、描画ブラシ リソースと同じように、イメージ ブラシ リソースを使用してオブジェクトを描画できます。

      [コンテナ名] の横のリストから [XAML WPF リソース ディクショナリ] コンテナを選択し、[コンテナ名] テキスト ボックスにリソース ディクショナリ名を入力します。コンテナを選択しない場合は、各スライスは個別のリソース ディクショナリのブラシ リソースとしてエクスポートされます。

  4. [ライブ エフェクト] でブラシ リソースの次の設定を調整します。

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

    スライスをブラシ リソースとしてエクスポートする場合は、スライスごとに次のプロパティを設定する必要があります。

    • [すべてをラスタライズ]   アートワークに適用されたすべてのライブ エフェクトをラスタライズ (ビットマップ イメージに変換) するには、このオプションを選択します。このオプションを使用すると、アートワークの外観を最大限に維持できます。

    • [XAML エフェクトへの変換]   すべてのライブ エフェクトを XAML でサポートされるエフェクトに変換するには、このオプションを選択します。XAML でサポートされていないライブ エフェクトはラスタライズされます。

  5. [ファイル名] の横に、リソース ディクショナリの名前を入力します。

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

    スライスをエクスポートする場合は、[ファイル名] フィールドは表示されません。これは、エクスポートされるブラシ リソースのファイル名としてスライス名が使用されるためです。

  6. [場所] の横に、出力ファイルを保存する場所へのパスを入力するか、保存先を参照して指定します。

  7. [すべてをエクスポート] をクリックして、ファイルをエクスポートします。スライスをエクスポートする場合に、一部のスライスのみをエクスポートするには、プレビュー ウィンドウで Shift キーを押しながら複数のスライスを選択し、[すべてをエクスポート] の横にあるドロップダウン ボックスの矢印をクリックして、[選択されたスライスをエクスポート] をクリックします。または、実際にスライスをエクスポートせずに、各スライスのエクスポートのプロパティに加えた変更を保存するには、[すべてをエクスポート] の横にあるドロップダウンの矢印をクリックし、[設定を保存して閉じる] を選択します。

    [場所] プロパティで指定したパスにリソース ディクショナリがエクスポートされ、<resource_name>_files という名前のサブフォルダに、サポートされているすべてのアートワークがエクスポートされます。リソース ディクショナリを Expression Blend 2 プロジェクトに追加すると、Expression Blend によって <resource_name>_files フォルダも自動的にインポートされます。

[エクスポート] ダイアログ ボックス : Expression Design ドキュメントの各レイヤーを XAML WPF リソース ディクショナリの描画ブラシ リソースとしてエクスポートするように設定した場合

Cc294785.61ec612d-c046-4f16-b547-4b52d9ab8fb3(ja-jp,Expression.10).png

[エクスポート] ダイアログ ボックス : Expression Design ドキュメントのスライスを XAML WPF リソース ディクショナリの描画ブラシ リソースとしてエクスポートするように設定した場合

Cc294785.3b9a3c99-79a2-4a6c-a462-68c64f8b1db7(ja-jp,Expression.10).png

リソース ディクショナリを Expression Blend プロジェクトにインポートする

リソース ディクショナリを Expression Blend プロジェクトにインポートするには

  1. Expression Blend 2 で WPF プロジェクトが開いている状態で、[プロジェクト] メニューの [既存のアイテムを追加] をクリックします。

  2. [既存のアイテムを追加] ダイアログ ボックスで、エクスポートした XAML WPF リソース ディクショナリ ファイルを参照して選択し、[開く] をクリックします。ファイルが、[プロジェクト] パネルの [ファイル] の下に追加されます。リソース ディクショナリで <resource_name>_files フォルダにエクスポートされたイメージ ファイルが含まれている場合は、このフォルダもインポートされます。リソース ディクショナリの名前の下の [リソース] パネルに、すべての描画ブラシ リソースが表示されます。

  3. インポートされたブラシ リソースを使用するには、次のいずれかの操作を行います。

    • [リソース] パネルで、リソース ディクショナリの名前を展開し、開いているドキュメントのアートボードの上にリソースをドラッグします。ポップアップ メニューが表示され、アートボード上の既存のオブジェクトでリソースをブラシ プロパティとして適用するか、または四角形 など新しいオブジェクトを作成して、ブラシ リソースをオブジェクトの [塗りつぶし] プロパティとして適用するかを選択できます。また、Expression Blend 2 では、描画ブラシをキャンバスにコピーして変更することもできます。

      Cc294785.0803c32d-29ae-42f9-ac9d-6448bcb49604(ja-jp,Expression.10).png

    • [オブジェクトとタイムライン] で、オブジェクトを選択してから、[プロパティ] パネルの [ブラシ] で [ブラシ リソース] タブをクリックし、表示されるリストから適用するブラシ リソースの名前を選択します。

      Cc294785.42bc72ac-c334-448d-b1bc-3a34bf3231f2(ja-jp,Expression.10).png

    • [オブジェクトとタイムライン] で、オブジェクトを選択してから、[プロパティ] パネルの [ブラシ] で、ブラシ プロパティの横にある [詳細プロパティ オプション] ボタンをクリックし、次に [ローカル リソース] をクリックして、適用するブラシ リソースの名前を選択します。

      Cc294785.128d8a3c-637f-4501-a146-48f62eed3873(ja-jp,Expression.10).png

    リソースの適用方法の詳細については、Expression Blend 2 ユーザーガイドのリソースの適用と削除についてのトピックを参照してください。

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

    インポートするブラシ リソースの名前は、Expression Blend 2 プロジェクトの他の場所にあるリソースとは異なるものにする必要があります。リソース オブジェクトの名前を変更するには、[リソース] パネルで名前を右クリックしてから [名前の変更] を選択します。

関連項目

概念

印刷とエクスポートのオプション

ドキュメント サイズ

ライブ エフェクト

スライス

スライスのエクスポート

ビットマップ イメージ