4.3.6. エレメントを配置する¶
次に、アプリケーション画面を構成する「エレメント」を配置し、アプリケーション画面を構成します。
4.3.6.1. エレメントとは¶
アプリケーション画面を構成する部品を「エレメント」といいます。
4.3.6.2. エレメントを配置する¶
本チュートリアルで作成するアプリケーションを構成するエレメントを配置します。
エレメントを配置するには、エレメントパレットからアプリケーション画面に表示させたいエレメントをコンテナにドラッグ&ドロップします。
「デザイナ」画面左部、コンテナヘッダから「New Page #1」を選択します。
「デザイナ」画面左部、エレメントパレットから「フォーム部品」を選択しクリックします。
図：エレメントパレット- 「フォーム部品」「フォーム部品」に分類されるエレメントの一覧が表示されます。
図：「フォーム部品」エレメントの一覧表示されたエレメントの一覧から、「テキスト入力」をドラッグ&ドロップでコンテナに配置します。
図：「テキスト入力」エレメントの配置同様に「フォーム部品」エレメントの一覧から、「ボタン」をドラッグ&ドロップでコンテナに配置します。
図：「ボタン」エレメントの配置
以上で、「New Page #1」ページのコンテナへのエレメントの配置が完了しました。
次に、「New Page #2」ページのコンテナへエレメントを配置します。
「デザイナ」画面左部、コンテナヘッダから「New Page #2」を選択します。
「デザイナ」画面左部、エレメントパレットから「レイアウト」を選択しクリックします。
図：エレメントパレット- 「レイアウト」「レイアウト」に分類されるエレメントの一覧が表示されます。
図：「レイアウト」エレメントの一覧表示されたエレメントの一覧から、「見出しレベル1」をドラッグ&ドロップでコンテナに配置します。
図：「見出しレベル1」エレメントの配置「New Page #1」ページの手順と同様に「フォーム部品」エレメントの一覧から、「ボタン」をドラッグ&ドロップでコンテナに配置します。
図：「ボタン」エレメントの配置
以上で、全てのページのコンテナへのエレメントの配置が完了しました。
次節「変数を定義する」では、作成するアプリケーションの変数を設定します。