このレッスンでは、Adobe XDのリピートグリッドを使って、繰り返し要素の配置作業を効率化する方法を解説します。
Adobe XDを起動し、「ファイル」→「開く」からダウンロードしたサンプルファイルを選択して「開く」をクリックします。ファイルが開くと、動画と同じサンプル画面が表示されます。
リピートグリッドの作成
まず、繰り返し配置したい要素を選択します。必須ではありませんが、この時点でグループ化しておくと、何が繰り返し配置されるのか分かりやすくなります。
次にプロパティインスペクターの「リピートグリッド」ボタンをクリックします。すると、選択されていたオブジェクトがリピートグリッドになります。リピートグリッドに変換されたグループは周囲の線が緑になり、右と下にハンドルが表示されます。ハンドルをドラッグすると、選択されていた要素が、ドラッグした方向に自動的に繰り返し配置されます。
リピートグリッド内のどこか一か所を編集すると、他のすべての繰り返し箇所に反映されます。そのため、同じ修正作業を何回も繰り返す必要がありません。また、余白をカーソルでドラッグすれば、余白もまとめて設定できます。
リピートグリッドには画像やテキストを一括更新する機能もあります。複数の画像をリピートグリッド内にドラッグ&ドロップすると、繰り返し要素の同じ位置に順番に画像が挿入されます。テキストを自動挿入する場合は、改行で区切ったテキストファイルを用意します。ファイルをテキストフィールドにドラッグ&ドロップすると、ファイル内に記述された順にテキストが挿入されます。