Expression Design からエクスポートされた XAML のインポート

Microsoft Expression Design で作成したアートワークを XAML ファイル形式で保存し、Blend for Visual Studio で使用することができます。 これは、アートワークをアニメーションで使用する場合や、背景イメージなどのユーザー インターフェイス (UI) 要素に変換する場合などに便利な機能です。

ヒント

Expression Design からのアートのエクスポートの詳細については、『Expression Design ユーザー ガイド』の「XAML ファイルのエクスポート」を参照してください。

注意

このトピックでは Blend と Expression Designについて説明します。

Expression Design からアートをエクスポートするには

1. Expression Design でアート ファイルを開きます (または、[ヘルプ] メニューから Expression Design のサンプルを開きます)。

2. スライスをエクスポートする場合、[ツール] パネルから [スライス] ツールを選択し、エクスポートするアートワーク領域の周囲に四角形を描画し、[プロパティ] パネルの [スライスの編集] でスライスのプロパティ ([名前] など) を設定します。 スライスの詳細については、『Expression Design ユーザー ガイド』の「スライスの作成とエクスポート」を参照してください。

3. [ファイル] メニューの [エクスポート] をクリックします。 [エクスポート] ダイアログ ボックスが表示されます。

4. [エクスポートする項目] で、次のいずれかを選択します。

   • ドキュメント全体   ドキュメント内のすべてのアートがエクスポートされます。

   • 選択したオブジェクト   アートボード上で選択した項目のみがエクスポートされます。

   • スライス   作成したスライスのみがエクスポートされます。 表示される各スライスのプロパティを必要に応じて変更できます。

5. [書式設定] の横にある次のオプションのいずれかをクリックします。

   • [XAML Silverlight キャンバス]   ドキュメント全体または選択したオブジェクトを 1 つの XAML Silverlight キャンバス ドキュメントとしてエクスポートするには、このオプションを選択します。

   • [PNG]、[JPEG]、または [XAML Silverlight キャンバス]   スライスをエクスポートする場合は、スライスごとにこれらのいずれかのオプションを選択します。 [形式] プロパティを設定する前に、Shift キーを使用して複数のスライスを選択し、複数のスライスを対象にして [形式] プロパティを設定することもできます。

     [コンテナー名] の横のリストから [XAML Silverlight キャンバス] コンテナーを選択し、[コンテナー名] テキスト ボックスに XAML Silverlight キャンバス ドキュメントの名前を入力します。 コンテナーを選択しない場合、各スライスは [形式] プロパティに従って個別のファイルにエクスポートされます。

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

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

     注意

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

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

   • [XAML WPF キャンバス]   ドキュメント全体または選択したオブジェクトを 1 つの XAML WPF キャンバス ドキュメントとしてエクスポートするには、このオプションを選択します。

   • [PNG]、[JPEG]、[GIF]、[TIFF]、[BMP]、[XAML WPF キャンバス]   スライスをエクスポートする場合は、スライスごとにこれらのオプションのいずれかを選択します。 [形式] プロパティを設定する前に、Shift キーを使用して複数のスライスを選択し、複数のスライスを対象にして [形式] プロパティを設定することもできます。

     [コンテナー名] の横のリストから [XAML WPF キャンバス] コンテナーを選択し、[コンテナー名] テキスト ボックスに XAML WPF キャンバス ドキュメントの名前を入力します。 コンテナーを選択しない場合、各スライスは [形式] プロパティに従って個別のファイルにエクスポートされます。

6. [Text] オブジェクトを Blend にインポートした後で編集可能にするなど、その他のプロパティを必要に応じて設定します。 このダイアログ ボックスのプロパティの詳細については、Expression Design のユーザー ガイドで XAML のトピックを参照してください。

7. ダイアログ ボックス下部の [場所] で、ファイルのエクスポート先フォルダーのパスを入力します。 また、次のオプションを設定します。

   • [ドキュメント全体] または [選択したオブジェクト] を選択した場合、エクスポートするファイル名も入力します。

   • [スライス] を選択した場合、レイアウト パネルを選択してすべてのオブジェクトを含めることもできます。

8. [すべてエクスポート] をクリックして、ファイルをエクスポートします。

Blend にアートをインポートするには

1. Blend でプロジェクトを開き、[プロジェクト] メニューの [既存のアイテムを追加] をクリックします。

2. [既存のアイテムを追加] ダイアログ ボックスで、エクスポートした 1 つまたは複数の XAML ファイルを参照して選択し、[開く] をクリックします。

   注意

   エクスポートした XAML Silverlight キャンバスのみを Silverlight プロジェクトにインポートできます。

   ファイルが [プロジェクト] パネルに追加されます。 エクスポートしたアートが XAML WPF 描画ブラシ形式の場合、[リソース] パネルにも表示されます。

3. インポートしたアセットをアートボードに追加するには、以下のいずれかを実行します。

   • [XAML Silverlight キャンバス] オプションを選択した場合は、ドキュメントを追加するか、またはオブジェクトを別の XAML ドキュメントにコピーして貼り付けることができます。

   • [XAML WPF 描画ブラシ] を選択した場合、リソースをプロジェクト内のオブジェクトのブラシ プロパティに適用します。 たとえば、DrawingBrush リソースを TextBlock オブジェクトにドラッグし、Background プロパティとして設定します。

     

     リソースの適用方法の詳細については、「Blend でリソースを適用または削除する」を参照してください。

     ヒント

     インポートした描画ブラシ リソースの名前が Blend プロジェクト内のリソースと重複していないことを確認してください。[リソース] パネル内のリソース オブジェクトの名前を変更するには、オブジェクト名を右クリックし、[名前の変更] を選択します。

   • [XAML WPF キャンバス] を選択した場合は、ドキュメントに追加してそのドキュメントをアプリケーションのスタートアップ ページとして使用したり (「Blend におけるプロジェクトの開始ドキュメントの設定」を参照)、オブジェクトを別の XAML ドキュメントにコピーして貼り付けることができます。 このファイルを Blend の [デザイン] ビューで開くには、1 つまたは複数のオブジェクトを右クリックし、ボタンまたはユーザー コントロールを作成します (「既存のオブジェクトからのユーザー コントロールの作成」を参照してください)。