要素タブ (Elements Tab)
テンプレートデザイナーで要素とレイヤーを管理します。
Elements (要素) タブは、テンプレートの構造を管理するためのコントロールセンターです。ここで、新しいビジュアルコンポーネントをキャンバスに追加したり、既存の要素の重なり順（レイヤー）を管理したりできます。
管理と設定の違い
要素タブ は、あくまで要素の 追加、順序変更、削除 を行う場所です。 位置、フォント、コンテンツ、サイズなどのプロパティを設定するには、Style (スタイル) タブを使用してください。
要素の追加
テンプレートにコンポーネントを追加するには、「Add Elements」グリッド内のボタンのいずれかをクリックするだけです。新しい要素がキャンバスに表示され、Layers (レイヤー) リストの一番上に追加されます。
| 要素タイプ | 説明 |
|---|---|
| Text (テキスト) | 標準的なテキストブロック。静的テキストまたはデータにマッピングされた変数を表示できます。 |
| Image (画像) | 静的画像（ロゴ、署名など）。 |
| Barcode (バーコード) | データからバーコード（Code39, Code128など）を生成します。 |
| QR Code (QRコード) | データから2次元QRコードを生成します。 |
| Static Table (静的テーブル) | ヘッダーや情報ボックスなどのレイアウト変更が少ない、固定行数のグリッド。 |
| Group Table (明細テーブル) | トランザクションデータを反復処理する動的テーブル。 |
レイヤーパネルとZオーダー
タブの下部にある Layers (レイヤー) リストには、現在のページ上のすべての要素が表示されます。このリストの順序は、描画順序 (Z-Index) および相対配置の フロー順序 を決定します。
レイヤーの管理
- 選択: レイヤーをクリックしてその要素を選択します。
- 並べ替え:
- 上矢印 (↑): 要素をリストの上へ移動します（視覚的には背面へ）。
- 下矢印 (↓): 要素をリストの下へ移動します（視覚的には前面へ）。
- 削除: ゴミ箱 アイコンをクリックして要素を削除します。
Zオーダー（重なり順）について
リスト内の要素の順序が重なり順（z-index）を決定します。
- リストの一番上 = 最初に描画される（背景）
- リストの一番下 = 最後に描画される（前面）
2つの要素が重なっている場合（例：画像の上にテキスト）、リストの 下の方にある 要素が、リストの上の方にある要素の 上に 表示されます。
ケーススタディ: 相対配置とレイヤー順序
Style (スタイル) タブで要素の位置を Relative (相対配置) に設定する場合、レイヤー順序 が非常に重要になります。
相対配置のルール
「相対配置」要素は、レイヤーリスト内の 前の要素 の左下隅を基準に自分自身を配置します。
シナリオ例
2つのテキスト要素があるとします：
- "Report Title" (静的テキスト、大フォント)
- "Date" (変数テキスト、小フォント)
タイトルがどれだけ長くても、Date が常に Report Title の 下 に自動的に表示されるようにしたい場合。
正しい設定
レイヤー順序:
- Report Title (リストの最初)
- Date (リストの2番目) -> Position設定: Relative
結果: Date は直前の要素（Report Title）を見て、タイトルがどこで終わるかを計算し、その直下に自分自身を配置します。
間違った設定
レイヤー順序:
- Date (リストの最初) -> Position設定: Relative
- Report Title (リストの2番目)
結果: Date には「前の要素」がない（またはページマージンを見る）ため、上部に留まります。Report Title は Date の 後 に描画されるため、Date と重なったり、間違った場所に表示されたりする可能性があります。
ベストプラクティス
フローベースのレイアウト（手紙の本文など）を作成するときは、レイヤーリストが 読む順序（上から下へ）と一致するようにしてください。