レイヤーとオブジェクトの選択
はじめに
この機能を使用できるユーザー
すべてのプランで利用できます。
ファイルの閲覧のみまたは編集可の権限を持つユーザーは誰でも、キャンバスまたはレイヤーパネルでオブジェクトを選択できます。
ファイルの編集可の権限があれば、誰でもマッチングレイヤーを選択できます。
オブジェクトまたはレイヤーに関連付けられたプロパティを更新するには、オブジェクトまたはレイヤーを事前に選択する必要があります。この記事では、オブジェクト選択の基本のすべてを説明するとともに、あまり知られていないヒントやコツについても触れていきます。
個々のレイヤーの選択
レイヤーは、キャンバスで直接、またはレイヤーパネルで選択することができます。選択するには、キャンバス内のオブジェクトをクリックします。
ネストしたレイヤーの選択
複雑なデザインを扱っている場合は、グループまたはフレーム内でオブジェクトがネストしていることがあります。
ネストしたオブジェクトを子と呼び、オブジェクトが内側でネストしているフレームまたはグループを親と呼びます。親、子、および兄弟の関係については、こちらを参照してください。
グループまたはフレームの一部であるオブジェクトをクリックすると、デフォルトで親が選択されます。
オブジェクトをダブルクリックするか、またはenterキーを押して、ひとつ下のネストを選択します。正しい子要素を選択するまで、この操作を繰り返します。
ネスト選択
多層にわたってネストされている場合は、ネスト選択を使用してネストした子レイヤーまたは最上位フレームを選択できます。装飾キーを長押しして、キャンバスで最上位フレーム、あるいはネストしたレイヤーまたはオブジェクトをクリックして選択します。
- Mac: ⌘ Command
- Windows: Control
レイヤー選択メニュー
そのほか、ネストしたオブジェクトを選択するにはいくつかの方法あります。レイヤー選択メニューを使用すると、キャンバス上でどのレイヤーを選択するかを選べます。
- 右クリックしてコンテキストメニューを開きます。
- [レイヤーを選択]にカーソルを合わせます
- カーソルの位置の下にあるレイヤーのリストからレイヤーを選択します。レイヤーパネルと同じ順序でレイヤー名とアイコンが表示されます。
ヒント: ネストしたオブジェクト間を移動するには、次のキーボードショートカットを使用します。
- 子を選択: enter
- 親を選択: shift enter
- 次の兄弟を選択: tab
- 前の兄弟を選択: shift tab
レイヤーパネル
キャンバスのすべてのオブジェクトには、対応するレイヤーがレイヤーパネルにあります。
レイヤーパネルを開くには、左のサイドバーの[レイヤー]タブをクリックするか、次のキーボードショートカットを使用します。
- Mac: Option 1
- Windows: Ctrl 1
パネルでレイヤーにカーソルを合わせると、キャンバス上でそのレイヤーの位置が青いボックスでハイライトされます。
レイヤーパネルのレイヤー名をクリックして選択します。
キャンバスにフレームまたはグループがある場合、子オブジェクトは親の内側でネストされます。フレーム、グループ、またはコンポーネントの横の矢印をクリックすると子レイヤーが表示されます。
カーソルを合わせてもレイヤーがハイライトされない場合は、メニューの設定を調整します。それには、[設定] > [カーソルを合わせてハイライト]を選択します。
複数のレイヤーの選択
一度に複数のオブジェクトまたはレイヤーを選択することもできます。
次のような場合に大変便利です。
- プロパティを複数のレイヤーで更新する
- 複数のレイヤーのサイズを一括して変更する
- オブジェクトのコレクションを移動する
- 選択範囲から、グループ、フレーム、またはコンポーネントを作成する
注: 複数のレイヤーを選択すると、右サイドバーの[選択範囲の色]が利用可能になります。
これを使用すると、選択範囲内の個々の塗り、スタイル、および線を更新できます。詳細については、記事「選択範囲内の色の表示と調整」を参照してください。
キャンバス
- キャンバスのオブジェクトを選択します。
- Shiftキーを押しながら別のオブジェクトをクリックします。
- 好きなだけオブジェクトを選択することができます。
ヒント: Shiftを押しながら、オブジェクトをもう一度クリックすると、そのオブジェクトは現在の選択範囲から外れます。
選択マーキー
マーキーツールを使用すると、キャンバスの特定の領域内のすべてのオブジェクトを選択できます。
- キャンバスの何もない部分をクリックして長押しします。
- 選択するすべてのオブジェクトをカーソルでドラッグします。
- 選択範囲内のそれぞれのオブジェクトの周囲に青いボックスが表示されます。
- ネストしたレイヤーを選択するには、次の修飾キーを押したまま、選択する最初のオブジェクトから最後のオブジェクトまでマーキーでドラッグします。
- Mac: ⌘
- Windows: Ctrl
- 選択範囲内のオブジェクトの選択を解除するには、Shiftキーを押しながらそのオブジェクトをクリックします。
注: 親オブジェクトを選択することなく、ネストしたオブジェクトを選択することができます。このことは、特に移動するオブジェクトを選択する場合に重要なので、覚えておいてください。
最上位フレームを選択すると、他の最上位レイヤーだけが選択されます。
親オブジェクトを選択すると、子オブジェクトもすべて選択されます。これにより、すべてを同時に移動できます。
レイヤーパネルでの複数のレイヤーの選択
レイヤーパネルで複数のレイヤーを選択する場合には、次のようなさまざまな規則があります。
2つのレイヤーの間にあるすべてのレイヤーを選択するには、次の操作を行います。
- 最初のレイヤーをクリックして選択します
- Shiftキーを押したままにします
- 最後のレイヤーを選択します。
- レイヤーパネルで、2つのレイヤーの間のすべてのレイヤーが選択されます。
個々のレイヤーを選択するには、次の操作を行います。
- 最初のレイヤーをクリックして選択します
- 修飾キーを押したままにします
- Mac: ⌘
- Windows: Ctrl
- 選択する他のレイヤーを選択します
一致するオブジェクトの選択
一致するオブジェクトとは、複数のフレームまたはグループにまたがって存在する同一のレイヤーです。
オブジェクトの編集やプロトタイピングでは、一致するオブジェクトをすべて選択することで作業時間を短縮できます。たとえば、多くのアプリデザインで、それぞれのフレームの上部に検索バーが使用されています。それらをすばやく選択して、同時に編集することができます。
一致するオブジェクトを選択するには、次の操作を行います。
- フレームまたはグループの内側のオブジェクトを選択します。フレームまたはグループはキャンバス上またはセクション内の最上位に置かれている必要があります。
- 次の操作の1つを行い、マッチングレイヤーを選択します。
- ツールバーの[マッチングレイヤーを選択]をクリックします。
- 次のキーボードショートカットを使用します。
- Mac: ⌥ Option ⌘ Command A
- Windows: Alt ⌃ Control A
- ⇧ Shiftを押したまま、キャンバスをクリックしている状態で、一致するフレームを覆うようにカーソルをドラッグして、選択マーキーを作成します。一致するオブジェクトだけが選択または選択解除されます。
- ⇧ Shiftを押したまま、一致するオブジェクトをクリックして選択範囲に追加します。他のグループまたはフレームの中に 深くネストされているオブジェクトをダブルクリックする必要はありません。
選択したオブジェクトがすべて青いバウンディングボックスで囲まれます。これで、オブジェクトを同時に編集できるようになりました。オブジェクトを一括編集する方法→
注: セクション内のオブジェクトは、そのセクションのオブジェクトとだけ一致します。
すべてのレーヤーの選択
編集メニューから、複数のオブジェクトをそのプロパティに基づいて選択できます。これによって、同じプロパティを持つ、ファイル内のすべてのレイヤーを選択できます。
この方法は、すべてのレイヤーのプロパティを同時に調整する場合に非常に便利です。
-
レイヤーパネルで1つまたは複数のレイヤーを選択します。
-
[ファイルメニュー☰に移動し、オプションから[編集]を選択します。
-
[すべて選択]を選びます。以下が同じ他のすべてのレイヤーが選択されます。
- プロパティ
- 塗り
- 線
- エフェクト
- テキスト型プロパティ
- フォント
- または別のインスタンス
キャンバス上のすべてを選択する場合
キーボードショートカット⌘ Command / Ctrl Aを使用します。
ロックされたレイヤーと非表示のレイヤー
レイヤーを非表示にすると、レイヤー選択メニューに表示されなくなります。選択するには、表示をオンに切り替える必要があります。
ロックされたオブジェクトやレイヤーは通常の左クリックによる選択プロセスでは選択できませんが、レイヤー選択メニューによって選択できます。
ロックされたレイヤーはレイヤー選択メニューに含まれており、南京錠のアイコンが付けられています。
ヒント: スマートセレクション を使用すると、キャンバスで2つ以上のオブジェクトを選択できます。キャンバスで、 レイヤーの配置またはレイヤー間の間隔を調整できます。
列や行のように1つの軸に沿って並べられたオブジェクトのリストから、1Dスマートセレクションを作成します。または、グリッドまたはギャラリーのような構造のオブジェクトの2Dスマートセレクションを作成します。
オブジェクトまたはレイヤーの選択解除
選択を完全に解除するには、次の操作を行います。
- キャンバスの任意の場所をクリックします
- キーボードショートカットEscを使用します
オブジェクトを選択範囲から外すには、次の操作を行います。
- Shiftキーを押したまま、オブジェクトを再度クリックします。
注: 親オブジェクトをクリックすると、親とその中の子オブジェクトがすべて選択解除されます。
現在選択されていない項目を選択するには、次の操作を行います。
-
次のキーボードショートカットを使用します。
Mac: ⌘ A Shift
Windows: Ctrl A Shift
これにより、現在の選択が解除され、キャンバス上の選択されていなかったすべての項目が選択されます。
閲覧のみモードでのオブジェクトの選択
閲覧のみ
アクセス権を持つコラボレーターには、オブジェクトを選択する体験は少し違ったものとなります。
キャンバスで選択をすると、次のようになります。
- 選択範囲が紫の実線のボックスで囲まれます。
- 現在の選択範囲の親が紫の破線のボックスで囲まれます。
- 選択したレイヤーの名前が右サイドバーのプロパティパネルの上部に表示されます。
- 該当する場合には、プロパティパネルの選択したレイヤーの下に親コンポーネントが表示されます。プロパティパネルのをクリックして親コンポーネントを選択します。
- 選択したレイヤーのプロパティ、レイアウト、および色が表示されます。