.png "このページは WPF プロジェクトにのみ適用されます。")
Microsoft Expression Blend は、3D オブジェクトを作成、変更、アニメーション化するための便利なツールを備えています。
Expression Blend には、.obj ファイル形式の 3D コンテンツをインポートできます。これらのファイルを正しくレンダリングするには、3D オブジェクトで使用される素材を定義する素材ファイル (.mtl ファイル) をインポートし、素材ファイルで使用されるすべてのイメージ ファイルをインポートする必要もあります。
3D コンテンツは Viewport3D コントロール内に格納します。このビューポートは、3D コンテンツのラッパーまたはコンテナの一種として動作します。[プロパティ] パネルで素材、ライト、およびカメラを変更し、3D コンテンツに思いどおりの効果や視覚属性を適用することができます。
.png "Cc295225.eba8e7a7-0039-4fe7-a01f-d20734750a82(ja-jp,Expression.10).png")
.png "Cc295225.25182a96-9a69-478a-9cfe-5b360e6a9bea(ja-jp,Expression.10).png") |
Viewport3D |
ドキュメントに 3D コンテンツを表示する場合にコンテナとして動作する、楕円などの 2 次元要素 (コントロール)。 |
.png "Cc295225.05fe4b1d-f584-4bd2-99b6-8bc2d735a89d(ja-jp,Expression.10).png") |
カメラ |
ドキュメント上の視点を表し、ビデオ カメラと同様に動作します。カメラを使用して 3D コンテンツを撮影し、画面での表示用に 2D イメージ (通常の平面オブジェクト) に変換します。カメラには、遠近投影と正投影の 2 種類があります。 |
.png "Cc295225.f0c1ff71-7814-42ba-806b-7ea92d616e69(ja-jp,Expression.10).png") |
素材 |
3D コンテンツの素材は、色やテクスチャなど、実際の 3D オブジェクトの全体的な外観を表します。光源もオブジェクトの外観に影響を与えますが、実際に 3D オブジェクトの表面に直接影響するのは素材です。素材には、拡散、発色、鏡面の 3 種類があります。 |
.png "Cc295225.eb6fad93-f17e-4f62-a926-8c8651862891(ja-jp,Expression.10).png") |
ライト |
文字どおり、ライトは 3D コンテンツに照明を追加します。ライトを当てなければ、まったく光源がない状態で何かを見ようとする場合と同様であるため、3D コンテンツはほとんど見えなくなります。ライトには、環境光、スポット ライト、指向性ライト、およびポイント ライトの 4 種類があります。 |
3D モデル
ハンドルを使用して 3D オブジェクトの向きと位置を変更する方法はいくつかあります。たとえば、[選択内容] .png "Cc295225.2ff91340-477e-4efa-a0f7-af20851e4daa(ja-jp,Expression.10).png")
ツールを使用して、3D オブジェクトをダブルクリックして選択し、マウスで再配置カーソル .png "Cc295225.eff911a7-b891-4315-a86c-cc4cd088e647(ja-jp,Expression.10).png")
を表示中にアートボード上で任意の位置にドラッグできます。この操作で 3D オブジェクトをドラッグしても、オブジェクトの奥行き方向の位置は変化しません。Alt キーを押しながらマウスを上下にドラッグすると、3D オブジェクトが前面に近づいたり背面に遠のいたりします。
また、[プロパティ] パネルの [変換] では、他のオブジェクトと同じように 3D オブジェクトを回転、位置変更、拡大縮小することができます。
.gif "ヒント") ヒント : |
|---|
拡大縮小とサイズの変更は、オブジェクトのサイズを変更するまったく別の方法です。拡大縮小は、元のサイズに対する拡大縮小率を指定して、オブジェクトとその全プロパティのサイズを指定率で変更します。たとえば、ストローク オブジェクトのストロークも同様に拡大縮小され、特定のストローク幅には対応しなくなります。サイズの変更では、単にオブジェクトの Height プロパティと Width のプロパティ (寸法) を変更します。 |
変換ハンドルは 3D に固有です。したがって、次のように各ハンドルを有効活用する方法を理解しておくと便利です。
すべてのハンドルが表示されている 3D オブジェクト
.png "Cc295225.0aa7c80e-8ae9-492f-808b-91661c79b0ef(ja-jp,Expression.10).png")
軸 |
説明 |
ハンドル |
|---|---|---|
X 軸 |
X 軸の回転ハンドル |
.png "Cc295225.05557e99-7e25-4fe9-b654-46d5fc6aad11(ja-jp,Expression.10).png")
X 軸ハンドル
回転
位置 |
Y 軸 |
Y 軸の回転ハンドル |
.png "Cc295225.1fd95e6e-9274-462d-83e9-cc0a472b140b(ja-jp,Expression.10).png")
Y 軸ハンドル
回転
位置 |
Z 軸 |
Z 軸の回転ハンドル |
.png "Cc295225.19369f35-ddcf-4d84-b365-a36559a116b8(ja-jp,Expression.10).png")
Z 軸ハンドル
回転
位置 |
.png "Cc295225.188962b3-2c72-4ef1-968a-cc7293731734(ja-jp,Expression.10).png")
(赤の弧) をクリックしてからドラッグすると、X 軸 (赤のハンドル) を中心にオブジェクトを回転できます。回転ハンドルを使用すると、オブジェクトを X 軸を中心に回転できます。位置ハンドル .png "Cc295225.31416d04-8419-46e4-9e7f-40ba237ba11e(ja-jp,Expression.10).png")
(赤の矢印) を使用すると、オブジェクトを X 軸に沿って移動できます。拡大縮小ハンドル .png "Cc295225.ae0eb9fb-170a-44f8-a9ef-cf7e2b7313cc(ja-jp,Expression.10).png")
(赤のボックス) を使用すると、オブジェクトを X 軸に沿って拡大縮小できます。.png "Cc295225.215fc14e-368f-4a1f-8c64-1e12229321e8(ja-jp,Expression.10).png")
(緑の弧) をクリックしてからドラッグすると、Y 軸 (緑のハンドル) を中心にオブジェクトを回転できます。回転ハンドルを使用すると、オブジェクトを Y 軸を中心に回転できます。位置ハンドル .png "Cc295225.39165395-57a3-49e2-adf7-5de41da5656c(ja-jp,Expression.10).png")
(緑の矢印) を使用すると、オブジェクトを Y 軸に沿って移動できます。拡大縮小ハンドル .png "Cc295225.a666c7c7-1ed8-4733-bc82-d12b3bd1c58c(ja-jp,Expression.10).png")
(青の弧) をクリックしてからドラッグすると、Z 軸 (青のハンドル) を中心にオブジェクトを回転できます。回転ハンドルを使用すると、オブジェクトを Z 軸を中心に回転できます。位置ハンドル .png "Cc295225.54265b96-4329-4435-942d-e5ed6e61e0da(ja-jp,Expression.10).png")
(青の矢印) を使用すると、オブジェクトを Z 軸に沿って移動できます。拡大縮小ハンドル .gif "メモ") メモ : |
|---|
Shift キーを押しながら操作すると、15°の間隔で回転します。 |
.gif "Cc295225.7e183f1f-37d8-4dcb-980c-19a5d61ca087(ja-jp,Expression.10).gif")
先頭に戻る
素材
3D コンテンツの素材は、色やテクスチャなど、実際の 3D オブジェクトの全体的な外観を表します。光源もオブジェクトの外観に影響を与えますが、3D オブジェクトの表面に直接影響するのは素材です。3 種類の素材から選択することにより、次のように、3D コンテンツに対してさまざまな変更を行うことができます。
[拡散マテリアル]
.png "Cc295225.f4276d84-0e9b-439e-a6f1-dc2db7128d0f(ja-jp,Expression.10).png")
は、直接光 (白いライト) が適用された 3D オブジェクトの色を決定します。壁のペンキ塗りと同様です。[発色マテリアル]
.png "Cc295225.49e7cf0c-4177-496a-9732-59526b554c52(ja-jp,Expression.10).png")
を使用すると、オブジェクトが光を放っているように見えます。光の色は素材の色によって決まります。[鏡面マテリアル]
.png "Cc295225.de37968c-c6c7-43b8-9ada-8ca0c9998b5c(ja-jp,Expression.10).png")
は、3D オブジェクトの反射ハイライトの色を制御します。反射ハイライトは、クロムなど光沢のある表面に見える明るいスポットです。
先頭に戻る
カメラ
3D コンテンツのカメラは視点を表し、ビデオ カメラと同様に動作します。カメラを使用して、3D コンテンツを画面での表示用に 2D イメージ (通常の平面オブジェクト) に変換します。各 Viewport3D のカメラは、そのビューポートのプロパティとして表示されます。[組み合わせ] パネルの [オブジェクトとタイムライン] の下にあるオブジェクト表示でカメラを選択すると、[プロパティ] パネルの [カメラ] の下でカメラのプロパティを変更できます。各ビューポートにはカメラ プロパティが 1 つしか関連付けられていませんが、カメラの種類を遠近投影カメラと正投影カメラの間で切り替えて、アプリケーションでのオブジェクトの表示方法を変更できます。
遠近投影カメラは通常のカメラ レンズと同様に機能します。つまり、オブジェクトはカメラから離れるほど小さく見えます。[プロパティ] パネルの [カメラ] の下にある [遠近投影カメラ]
.png "Cc295225.3cacfb92-e2f5-4f68-a478-e79ff491201d(ja-jp,Expression.10).png")
をクリックすると、遠近投影カメラに切り替わります。正投影カメラは通常のカメラの遠近を考慮しません。正投影カメラからオブジェクトが離れても、オブジェクトは小さくなったり変形したりしません。[プロパティ] パネルの [カメラ] の下にある [正投影カメラ]
.png "Cc295225.035d804b-9193-4c84-aca2-308c24e87563(ja-jp,Expression.10).png")
をクリックすると、正投影カメラに切り替わります。
遠近投影カメラ
.png "Cc295225.6122adef-3582-4de3-8868-fb21a23bf0ce(ja-jp,Expression.10).png")
正投影カメラ
.png "Cc295225.ffa3ca6d-a4b1-4900-b501-decc2c1747d8(ja-jp,Expression.10).png")
[カメラの移動] .png "Cc295225.0f80cb0b-7405-4759-9e97-fcde9a53cbb5(ja-jp,Expression.10).png")
ツールを使用して、カメラを移動できます。[プロパティ] パネルの [カメラ] の下で、カメラの移動や各種類のカメラへの変更も行うことができます。
視野角 遠近投影カメラの場合にのみ、この属性を使用して、カメラを通して見えるコンテンツの量と、ドキュメント内のオブジェクトがカメラによって変形される程度を変更できます。値を小さくすると、遠近法によってオブジェクトが変形する程度が低くなり、大きくすると、魚眼レンズを通した場合のようにオブジェクトが大幅に変形します。
幅 正投影カメラの場合にのみ、この属性を使用して、表示するコンテンツの量を指定できます。この数値を大きくすると、表示されるコンテンツの量が増えます。
位置 3 次元仮想空間内のカメラの位置。
方向 3 次元仮想空間でカメラが向いている方向。
上方向の指定 カメラで "上" と認識されている方向への移動。
遠クリップ面/近クリップ面 カメラからオブジェクトまでの距離の最大値と最小値を指定します。オブジェクトは指定の距離以上カメラに近づいたり離れたりすると、表示されなくなります。
カメラの変更方法の詳細については、「カメラの移動」を参照してください。
先頭に戻る
ライト
文字どおり、ライトは 3D コンテンツに光を追加します。ライトを当てなければ、まったく光源がない状態で何かを見ようとする場合と同様の外観になるため、3D コンテンツはほとんど見えなくなります。ライトは Viewport3D コントロールのプロパティであり、[組み合わせ] パネルの [オブジェクトとタイムライン] の下にあるオブジェクト表示で選択して設定を変更できます。
ライトを選択したときに表示される変換ハンドル (次の「ライトの種類」のセクションの図中の赤、緑、および青のハンドル) を使用して、ライトを変換できます。ライトを移動する方法の詳細については、「ライトの方向の変更」参照してください。
また、ライトの複数の属性を変更できますが、一般に変更頻度の高い属性はライトの色と種類です。
先頭に戻る
ライトの色
ライトの色の変更は、2D オブジェクトの色を変更する場合と同様に簡単です。ライトの色は、Viewport3D 内で Light オブジェクトが選択されている状態であれば変更できます。その状態で [プロパティ] パネルの [ライト] の下にあるカラー エディタを使用して、ライトの色を変更できます。例については、「ライトの色の変更」を参照してください。
先頭に戻る
ライトの種類
次の表に、3D オブジェクトに適用できるライトの種類を示します。ライトの種類は、Viewport3D 内で Light オブジェクトが選択されている状態であれば変更できます。その際、[プロパティ] パネルの [ライト] で、さまざまなライトの種類を選択することができます。例については、「ライトの種類の変更」を参照してください。
ライトの種類と説明 |
アートボード上のライトの操作 |
|
|---|---|---|
環境光 ヒント :
環境光のみを使用する場合、オブジェクトが色あせ、1 色のみで照射されているように見えることがあります。最良の効果を得るには、環境光以外のライトも追加します。
|
環境光は、すべての方向から光が当たっているように光を投射します。このオプションは、すべてのオブジェクトに均等に光を当てる場合に使用します。 |
.png "Cc295225.a6d6e8c5-0307-45a6-aff0-c3972353e92b(ja-jp,Expression.10).png") |
スポット ライト |
スポット ライトは、実際のスポット ライトのように光を投射します。光はライトの位置から投射され、円錐状に広がります。この円錐状の光の外にある 3D オブジェクトの部分は、スポット ライトの影響を受けません。 |
.png "Cc295225.66eb0a06-7bfc-4c9e-976e-f2be9cc4446d(ja-jp,Expression.10).png") |
指向性ライト |
指向性ライトは、太陽光と同様に、特定方向に均等に光を投射します。 |
.png "Cc295225.5af771b3-e0bd-4798-988f-f8e5ed3df458(ja-jp,Expression.10).png") |
ポイント ライト |
ポイント ライトは、標準的な電球と同様に、1 点からすべての方向に向けて外側に光を投射します。 |
.png "Cc295225.261f55a3-4604-4474-915f-c88665bf8aab(ja-jp,Expression.10).png") |
.png "Cc295225.33fe619a-83c5-4222-b630-d0a9a5e8bae4(ja-jp,Expression.10).png")
.png "Cc295225.24318e46-617e-47c3-b48e-f65646451411(ja-jp,Expression.10).png")
.png "Cc295225.81621350-905c-445d-a2e2-dea51ec347cd(ja-jp,Expression.10).png")
.png "Cc295225.665e0a3e-928b-408b-a01f-cb2d57ac2bbf(ja-jp,Expression.10).png")
| ヒント : |
|---|
すべての種類のライトをオブジェクトに同時に当てた結果を確認するには、[表示] メニューの [3D] をポイントし、[ライトの切り替え] をクリックします。 |
先頭に戻る
その他のライトのプロパティ
[プロパティ] パネルの [ライト] の下で次の属性を変更して、各種類のライトに変更を加えることもできます。
減衰 照射されるオブジェクトがライトから離れるにつれて光力が衰える方法を指定します。次の減衰のプロパティを変更することができます。
ConstantAttenuation 照射されるオブジェクトがライトから離れても光力は変化しません。
LinearAttenuation 照射されるオブジェクトがライトから離れるにつれて光力が一定率で衰えます。
QuadraticAttenuation 照射されるオブジェクトがライトから離れるにつれて光力が衰えますが、最初は大幅に低減し、徐々にゆっくりと減衰していきます。
メモ :減衰のプロパティは、[スポット ライト] および [ポイント ライト] のみに適用されます。
方向 ライトが向いている方向。方向のプロパティは、[スポット ライト] および [指向性ライト] のみに適用されます。
円錐の角度 選択されたライトから円錐状に伸びる光の円錐角。地面に懐中電灯を当てた場合、地面に均等に光が当たるわけではなく、中心から離れるほど光が淡くなります。円錐の角度を指定することで、このような光の減衰の程度を指定できます。次の円錐の角度のプロパティを変更することができます。
InnerConeAngle ライトの最も明るい中央部分の角度です。
OuterConeAngle ライトの薄暗くなった外側部分の角度です。強い光にするには、内側と外側の円錐の角度を同じにします。内側の円錐の角度の値が、外側の円錐の角度よりも大きい場合は、外側の円錐の角度と同じ値として処理されます。
メモ :円錐の角度のプロパティは、[スポット ライト] のみに適用されます。
位置 所属グループ内でのライトの位置。3 つの値はライトの X 軸、Y 軸、および Z 軸上の位置を表します。位置のプロパティは、[スポット ライト] および [ポイント ライト] のみに適用されます。
範囲 ライトの照射範囲。指定範囲内にあるオブジェクトがライトによって照らされます。ライトの範囲外にあるオブジェクトには光は当たりません。範囲のプロパティは、[スポット ライト] および [ポイント ライト] のみに適用されます。
先頭に戻る
新しい 3D オブジェクトのサポート
NET Framework 3.5 では、次の新しい 3D オブジェクトが導入されています。
UIElement3D (XAML ではサポートされていません)
ContainerUIElement3D
ModelUIElement3D
Viewport2DVisual3D
Expression Blend 2 のアセット ライブラリに新しい 3D オブジェクトは含まれていません。ただし、XAML を手動で変更することによって、または Microsoft Visual Studio 2008 を使用してオブジェクトを追加し、Expression Blend 2 でプロジェクトを開くことによって、新しい 3D オブジェクトを使用できます。新しい 3D オブジェクトが Expression Blend 2 で認識され、3D ガイドを使用してシーン内の各オブジェクトを調整できます。新しいオブジェクトのサンプル コードが MSDN ライブラリにあります。
先頭に戻る