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