ルーラーおよびガイドの使用
Blend for Visual Studio では、ルーラーからガイドをドラッグして配置することにより、ページ上に要素を配置する作業をより正確に行うことができます。
また、カスタム レイアウトを作成するときにもルーラーとガイドを使用できます。Windows ストア アプリのデザイン ガイドラインと、アプリ ページをレイアウトする方法の詳細については、Windows デベロッパー センターで「アプリのページのレイアウト」を参照してください。
ヒント
[グリッド線にスナップ] がオンのときにデザイン サーフェイス上でオブジェクトをドラッグすると、オブジェクトは最も近い位置にある垂直または水平のグリッド線にスナップ (位置合わせ) されます。[グリッド線にスナップ] をガイドと組み合わせて使用すると、ページ上の要素を正確な場所に配置しやすくなります。
スナップを有効にするには、デザイン サーフェイスの左下隅にある [グリッド線にスナップ] をクリックします。
スナップの詳細については、「位置合わせの無効化または有効化 (Windows ストア アプリ)」を参照してください。
ルーラー、ガイド、および Windows のグリッド システム
Blend のルーラーは、Windows のグリッド システムに基づいて機能します。Windows ストア アプリにおける寸法の基本ユニットは 20 × 20 ピクセルです。さらに、このユニットが 5 × 5 ピクセルのサブユニットに分割されます。ルーラーもこれと同じく、基本ユニットは 20 ピクセルで、1 つのユニットが 5 ピクセルのサブユニット 4 つに分割されます。この 5 ピクセルのサブユニットが、ルーラーを使用して確認できる最小単位です。
ガイドを使用するには、ルーラーを表示しておく必要があります。
ルーラーを表示するには
- [表示] メニューの [ルーラーの表示] をクリックします。
ルーラーが表示されていると、オブジェクトがデザイン サーフェイス上に置かれているピクセル位置を知ることができます。
ヒント
ルーラー上のより細かい刻みを表示するには、デザイン サーフェイスをズーム インします。
ルーラーを表示したら、次に、[ガイドの表示] が選択されていることを確認します。
ガイドを表示するには
[表示] メニューの [ガイドの表示] をクリックします。
これで、ガイドを配置する準備ができました。
ガイドを配置するには
ガイドを配置するには、ルーラーをクリックし、次のいずれかの操作を行います。
ルーラー上のピクセル目盛りに合わせて、ガイドを目的の位置へドラッグします。
ガイドの上部に表示される値エディターで、目的のピクセル値を入力し、Enter キーを押します。
ガイドは、デザイン サーフェイスの上端、下端、左端、または右端を基準にすることができます。基準は、ガイド線の両端に表示されます。
上端揃えのガイドを示します。 |
|
下端揃えのガイドを示します。 |
|
左端揃えのガイドを示します。 |
|
右端揃えのガイドを示します。 |
ガイドの基準を変更するには
- ガイドをクリックし、次に、値エディターの右に表示される矢印をクリックします。使用する基準を選択します。
ガイドを削除するには
- ガイドをクリックし、次に、値エディターの右に表示される矢印をクリックします。[削除] をクリックします。
ガイドの管理
ガイドは、保存して他のプロジェクトで使用することもできます。使用するときは、保存されたガイド セットを現在のプロジェクトに読み込みます。ファイルは XML ファイルとして保存されているため、他の開発者とガイドを共有することもできます。
ガイドを保存するには
- ガイドを保存するには、[表示] メニューの [ガイドの管理] をポイントし、[ガイドの保存] をクリックします。
ガイドを読み込むには
- 保存されているガイド ファイルを開くには、[表示] メニューの [ガイドの管理] をポイントし、[ガイドの読み込み] をクリックします。
.guides ファイルを共有するには
エクスプローラーで、プロジェクト フォルダーを開き、共有するガイド ファイルを見つけます。
別のプロジェクトと共有するには、この .guides ファイルをコピーし、共有先となる新しいプロジェクトのフォルダー内に保存します。