変換の基本事項
Microsoft Expression Blend では、オブジェクトの位置変更、サイズ変更、平行移動、拡大縮小、回転、傾斜、反転、中心点の変更によって、ベクタ オブジェクトとテキスト オブジェクトの両方を簡単に変更することができます。オブジェクトを変更するには、アートボード上で変更を加えるか、[プロパティ] パネルの [レイアウト] カテゴリおよび [変換] カテゴリでプロパティを変更します。また、[ブラシの変更] ツールを使用すると、テキスト オブジェクトおよびベクタ オブジェクトのブラシ プロパティのみを変更できます。
アートボードでのオブジェクトの変更
ツールボックスの [選択内容] .png "Cc294973.2ff91340-477e-4efa-a0f7-af20851e4daa(ja-jp,Expression.10).png")
ツールを使用してアートボード上のオブジェクトを選択すると、Expression Blend によって、そのオブジェクトの周りにハンドルが付いた境界ボックスが表示されます。これらのハンドルを使用して、選択したオブジェクトを変更できます。Ctrl キーを押したまま選択することで、複数のオブジェクトを一度に選択することもできます。この場合、境界ボックスは、選択されたすべてのオブジェクトを囲むように表示されます。ハンドルを使用する場合の簡単なヒントを以下に紹介します。オブジェクトの変換前後の外観を表す図も示します。
変更 |
変換前後のオブジェクト |
|---|---|
位置変更 オブジェクトを X 軸、Y 軸、または Z 軸 (3D オブジェクトのみ) に沿って移動します。 オブジェクトの位置を変更するには、オブジェクトの上にポインタを移動し、カーソルが小さい 4 方向の矢印 オブジェクトの位置を変更すると、[プロパティ] パネルの [レイアウト] のオブジェクトのプロパティも変わります。位置の変更は、単にオブジェクトの最初の位置を変更するだけです。位置を変更しても、トリガまたはアニメーション タイムラインのオブジェクトを変更するとき以外は、オブジェクトに変換が適用されません。そのような変更に限り、位置の変更によって、[プロパティ] パネルの [変換] にある [平行移動] |
アートボード上のオブジェクトの位置の変更 .png "Cc294973.c7c8c2bc-c934-4dd5-a121-94d4ca82f294(ja-jp,Expression.10).png") |
サイズ変更 オブジェクトの高さ、幅、および奥行き (3D オブジェクトのみ) を変更します。 オブジェクトのサイズを変更するには、オブジェクトの角のハンドルまたは中点ハンドルの上にポインタを移動し、ポインタが両方向矢印 ( オブジェクトのサイズを変更すると、[プロパティ] パネルの [レイアウト] にあるオブジェクトのプロパティも変わります。サイズの変更は、単にオブジェクトの最初のサイズを変更するだけです。サイズを変更しても、トリガまたはアニメーション タイムラインのオブジェクトを変更するとき以外は、オブジェクトに変換が適用されません。そのような変更に限り、サイズの変更によって、[プロパティ] パネルの [変換] にある [拡大縮小] |
アートボード上のオブジェクトのサイズの変更 .png "Cc294973.1bf7361c-1d19-47e0-981b-222d7a8d69d4(ja-jp,Expression.10).png") |
回転 オブジェクトを中心点を基準として回転します。 オブジェクトを回転するには、オブジェクトの角のハンドルの上にポインタを移動し、ポインタが回転ハンドル オブジェクトを回転すると、[プロパティ] パネルの [変換] にある [回転] |
アートボード上のオブジェクトの回転 .png "Cc294973.0ec39880-288d-4083-90f0-26b05c094977(ja-jp,Expression.10).png") |
傾斜 オブジェクトを X 軸、Y 軸、または Z 軸 (3D オブジェクトのみ) に沿って傾斜 (変形) させます。 オブジェクトを傾けるには、オブジェクトの中点ハンドルの上にポインタを移動し、ポインタが分割された両方向矢印 オブジェクトを傾けると、[プロパティ] パネルの [変換] にある [傾斜] |
アートボード上のオブジェクトの傾斜 .png "Cc294973.b5b43b8b-dd44-4d42-a0d2-f7fab35e6f33(ja-jp,Expression.10).png") |
反転 オブジェクトを X 軸、Y 軸、または Z 軸 (3D オブジェクトのみ) に沿って反転します。 オブジェクトを反転するには、オブジェクトの角のハンドルまたは中点ハンドルの上にポインタを移動し、ポインタが両方向矢印 ( オブジェクトの反転は、[プロパティ] パネルの [変換] の下の [反転] |
アートボード上のオブジェクトの反転 .png "Cc294973.8bfb0802-a741-429c-9608-03d706a3328c(ja-jp,Expression.10).png") |
.png "Cc294973.eff911a7-b891-4315-a86c-cc4cd088e647(ja-jp,Expression.10).png")
に変わったら、ポインタをドラッグしてオブジェクトを移動します。位置を変更するときに移動方向を X 平面または Y 平面に制限するには、Shift キーを押したまま操作します。.png "Cc294973.962807da-746d-41bd-878c-0f89500f3907(ja-jp,Expression.10).png")
タブのプロパティが変更されます。.png "Cc294973.5b735d0c-fdc1-4d8b-a592-0e762cc7c635(ja-jp,Expression.10).png")
、.png "Cc294973.b1472e4f-1959-485d-901f-df5583a77bcb(ja-jp,Expression.10).png")
、.png "Cc294973.ec88bf27-dad4-4869-9146-0c9647c29cdc(ja-jp,Expression.10).png")
、または.png "Cc294973.7d350cd4-6d4f-40bc-9d04-d46d2d54ebee(ja-jp,Expression.10).png")
) に変わったら、ポインタをドラッグしてオブジェクトのサイズを変更します。Shift キーを押しながらサイズを変更すると、オブジェクトの縦横比を維持できます。Alt キーを押しながら変更すると、中心点を維持できます。.png "Cc294973.7a93944e-a7f5-4607-babd-768bb5f56185(ja-jp,Expression.10).png")
] タブのプロパティが変更されます。.png "Cc294973.888cbf6b-c442-424d-977d-61d942703c4a(ja-jp,Expression.10).png")
に変わったら、ポインタをドラッグしてオブジェクトを回転します。Shift キーを押しながら回転させると、オブジェクトが 15 度ずつ回転します。中心点の位置は、オブジェクトの回転に影響します。オブジェクトの中心点を移動するには、オブジェクトの中心にあるハンドル上にポインタを移動し、ポインタが 4 方向の矢印 .png "Cc294973.9003164f-1dd4-4a3b-8a4c-21a70d4b3ffb(ja-jp,Expression.10).png")
に変わったら、ポインタをドラッグします。中心点を移動すると、[プロパティ] パネルの [変換] にある [中心点] .png "Cc294973.49772b0c-095e-450b-967e-75dc1858966f(ja-jp,Expression.10).png")
タブのプロパティが変更されます。.png "Cc294973.321b430b-5c8e-47dc-93f8-0e85ac32cca5(ja-jp,Expression.10).png")
タブのオブジェクトのプロパティが変更されます。回転によって、オブジェクトに変換が適用されます。.png "Cc294973.2be41f49-8a61-4966-bf08-598f4253b610(ja-jp,Expression.10).png")
に変わったら、ポインタをドラッグしてオブジェクトを傾斜 (変形) させます。反対側の角または辺の位置を維持するのではなく、中心点の位置を維持する場合は、Alt キーを押しながら操作します。.png "Cc294973.90c478da-1e6b-4b59-8322-445053058a6d(ja-jp,Expression.10).png")
タブのオブジェクトのプロパティが変更されます。傾斜によって、オブジェクトに変換が適用されます。.gif "Cc294973.7e183f1f-37d8-4dcb-980c-19a5d61ca087(ja-jp,Expression.10).gif")
先頭に戻る
個別のプロパティ設定によるオブジェクトの変更
オブジェクトを正確に変更するには、[プロパティ] パネルの [レイアウト] または [変換] でプロパティに特定の値を入力します。[プロパティ] パネルを使用すると、オブジェクトの高さ、幅、配置、余白の初期値や、回転、傾斜および反転の角度、拡大縮小および平行移動の値、中心点などの変換について、その詳細を簡単に操作することができます。特定の変換のプロパティの設定方法については、「変換」の「操作方法」のトピックを参照してください。
.gif "メモ") メモ : |
|---|
[プロパティ] パネルの [レイアウト] および [変換] のプロパティのほとんどで、Expression Blend の数値エディタが使用されます。数値エディタをアクティブにするには、プロパティのテキスト ボックスの上にマウス ポインタを移動し、数値調整 |
.png "Cc294973.1ac1b6df-d5d6-4ad9-aba5-0712dc9a9036(ja-jp,Expression.10).png")
カーソルが表示されたら、クリックしてからドラッグすると値を調節できます。先頭に戻る
テキスト オブジェクトの変更
ベクタ オブジェクトに適用できる変更は、テキスト オブジェクトにも適用できます。
変更を適用したテキスト オブジェクト
.png "Cc294973.f98cfe86-514a-42a0-b31d-57fa7e00e602(ja-jp,Expression.10).png")
先頭に戻る
オブジェクトの変換
変換とは、ある座標空間上の点を決められた方法で別の座標空間に対応付けることです。たとえば、オブジェクトを平行移動する場合、オブジェクトに適用される変換によって、オブジェクトの最初の X、Y、および Z (3D オブジェクトのみ) 座標から目的の座標に移動します。オブジェクトを拡大縮小する場合、オブジェクトに適用される変換により、オブジェクトの最初の X、Y、および Z (3D オブジェクトのみ) の値に対する拡大縮小率に基づいてサイズが変更されます。
オブジェクトを変換するには、[プロパティ] パネルの [変換] で特定の値を入力するか、アートボード上でオブジェクトの中心点、回転、傾斜角度、または反転角度を変更します。アニメーション タイムラインまたはトリガのオブジェクトを変更する場合は、アートボード上でオブジェクトの位置またはサイズを変更する場合でも自動的に変換が適用されます。これによって、オブジェクトの元の値が保持されます。
変換プロパティには、2 つのカテゴリがあります。
- RenderTransform レイアウト パスの完了後に、変換が適用されます。[選択内容] ツールを使用してアートボード上のオブジェクトを変換すると、RenderTransform プロパティが変更されます。
| メモ : |
|---|
RenderTransform プロパティを使用する方がアプリケーションのパフォーマンスが高いため、オブジェクト変換に適しています。 |
- LayoutTransform レイアウト中にメモリ内で変換が適用された後、画面にアプリケーションが表示されます。子要素に適用される変換に親要素を整合させる必要がある場合は、LayoutTransform プロパティを使用します。
先頭に戻る
オブジェクトに適用されたブラシの変換
オブジェクトに適用する塗りつぶし、ストローク、不透明度マスク、またはその他のブラシを変換するには、[プロパティ] パネルでブラシのプロパティを選択してから、ツールボックスの [ブラシの変更] .png "Cc294973.8dc54a0d-02cc-44cd-b802-5a78309f4503(ja-jp,Expression.10).png")
ツールを選択します。ブラシ変更矢印がアートボードに表示され、マウス ポインタで変更できるようになります。グラデーション ブラシを使用している場合、変換矢印の終点は、カラー バーのいずれか一方の端のグラデーション境界に対応しています。次の方法で、ブラシ変更ツールの動作を変更できます。
エンドポイントをドラッグするときに、その移動をエンドポイント間の直線上に制限するには、Shift キーを押したまま操作します。
矢印全体を移動するときに、その移動を X 平面または Y 平面に制限するには、Shift キーを押したまま操作します。
エンドポイントを回転させるときに、15 度の間隔で回転させるには、Shift キーを押したまま操作します。
エンドポイントをドラッグするときに、中心点の位置を維持したまま反対側のエンドポイントも同時に移動させるには、Alt キーを押したまま操作します。
次のイメージは、Fill プロパティのグラデーション ブラシにさまざまな変換を適用した後の四角形の外観を示すものです。
四角形の塗りつぶし : 線状グラデーション ブラシに適用された変換
.png "Cc294973.ddadfdb4-f9f5-4239-8e56-d04014592af4(ja-jp,Expression.10).png")
四角形の塗りつぶし : 放射状グラデーション ブラシに適用された変換
.png "Cc294973.06d84067-19a1-4699-af39-18d0b11679a0(ja-jp,Expression.10).png")
必要に応じて、[プロパティ] パネルの [ブラシ] にある [オプション] ボタンをクリックすると表示されるプロパティを設定することができます。前のイメージでは、[パディング] オプションが選択されています。[反転] または [繰り返し] オプションを選択し、次に、変換矢印をオブジェクトよりも短くすると、波形になって表示されます。
グラデーション ブラシ以外のブラシの種類を変更することができます。ブラシの変更の詳細については、「外観の概要」と「グラデーション ブラシまたはタイル ブラシの変更」の「ブラシ」のセクションを参照してください。
先頭に戻る
クリッピング
オブジェクトを変換するとき、オブジェクトの一部が切り取られ、境界ボックスの外側が部分が表示されなくなることがあります。切り取りの問題を解決するには、次の方法で行います。
[プロパティ] パネルの [外観] で、ClipToBounds プロパティのチェック ボックスをオフにします。
[プロパティ] パネルの [変換] で、[RenderTransform] カテゴリではなく、[LayoutTransform] カテゴリのプロパティを使用します。これは、表示ブラシを変換するときに特に有効です。
変換を適用する前、または、アニメーション タイムラインまたはトリガのオブジェクトを変更する前に、[プロパティ] パネルの [レイアウト] のプロパティを使用して、既定のタイムラインのオブジェクトを変更します。これにより、変換が適用される前に、境界ボックスのサイズと位置が変更されます。
先頭に戻る