5.1.1. デザイナ画面の機能と各部の説明¶
ここではデザイナ画面の機能について説明します。
5.1.1.1. ヘッダ¶
アプリケーション画面を構成する要素をエレメントといいます。ヘッダにはエレメントの操作を行うためのアイコンが配置されています。各アイコンをクリックすると、その機能を利用できます。<画面項目>
- 上書き保存
デザイナ画面で編集した内容を保存します。
- 設計書出力
コンテンツ定義を Excel 形式のファイルでダウンロードします。詳細は「設計書出力の機能説明」を参照してください。
- 差分比較
他のバージョンや、コンテンツ定義との差分を比較し、異なる箇所を表示します。詳細は「差分表示機能を使用する」を参照してください。
- 元に戻す
変更内容を取り消します。ユーザの操作しているPCのOSがWindowsの場合、「Ctrl」+「Z」で同じ操作が可能です。Macintoshの場合、「command/control」+「Z」で同じ操作が可能です。
- やり直し
「元に戻す」の操作を取り消します。ユーザの操作しているPCのOSがWindowsの場合、「Ctrl」+「Y」で同じ操作が可能です。Macintoshの場合、「command/control」+「Y」で同じ操作が可能です。
- 切り取り
選択されているエレメントを削除します。削除するエレメントはクリップボードにコピーされます。ユーザの操作しているPCのOSがWindowsの場合、「Ctrl」+「X」で同じ操作が可能です。Macintoshの場合、「command/control」+「X」で同じ操作が可能です。
- コピー
選択されているエレメントをコピーします。コピーするエレメントはクリップボードにコピーされます。ユーザの操作しているPCのOSがWindowsの場合、「Ctrl」+「C」で同じ操作が可能です。Macintoshの場合、「command/control」+「C」で同じ操作が可能です。
- 貼り付け
クリップボードにコピーされているエレメントを貼り付けます。ユーザの操作しているPCのOSがWindowsの場合、「Ctrl」+「V」で同じ操作が可能です。Macintoshの場合、「command/control」+「V」で同じ操作が可能です。
- 範囲選択モード
クリックすると、エレメントの範囲選択ができます。マウスのドラッグ&ドロップで範囲選択を実行します。ユーザの操作しているPCのOSがWindowsまたはMacintoshの場合、「Shift」キーを押している間、同じ操作が可能です。
- コンテナを選択
クリックすると、全てのコンテナの選択を解除して、コンテナを選択します。コンテナのプロパティを簡単に設定できます。
- プレビュー
作成したアプリケーション画面の見た目や機能を確認できます。使用方法は「プレビュー画面の利用方法」を参照してください。
- CSS編集
クリックするとCSSエディタが表示されます。CSSエディタを利用すると、CSSを用いてエレメントにスタイルを適用できます。
- 削除
選択されているエレメントを削除します。削除するエレメントはクリップボードにコピーされません。ユーザの操作しているPCのOSがWindowsの場合、「Delete」キーで同じ操作が可能です。Macintoshの場合、「command/control」+「delete」で同じ操作が可能です。コラム
ユーザの操作しているPCのOSがWindowsの場合、エレメントを選択した状態で「Ctrl」キーを押しながらドラッグ&ドロップすると、エレメントを複製できます。Macintoshの場合、「command/control」キーを押しながらドラッグ&ドロップすると、エレメントを複製できます。
5.1.1.2. エレメントパレット¶
エレメントパレットにはエレメントが配置されています。エレメントパレットの概要とエレメントの配置方法は、「アプリケーション画面で利用するエレメントを配置する」を参照してください。
5.1.1.3. コンテナ¶
一つの「コンテナ」に対して一つアプリケーション画面が紐づきます。
5.1.1.4. コンテナヘッダ¶
アプリケーション画面のページを設定する画面です。ページごとにタブが表示され、ドラッグ&ドロップで順序を変更できます。アプリケーション画面を開いたときに、「main」と表示されているページが最初に表示されます。ページのタブをダブルクリックすると、「main」とするページを切り替えることが可能です。コラム
エレメントセットの編集中は、コンテナヘッダは表示されません。
5.1.1.4.1. プロパティタブ¶
コンテナに配置したエレメントに対し、エレメント固有の動作や見た目などを設定する画面です。設定方法は「プロパティの詳細と設定」を参照してください。
5.1.1.4.3. アクションタブ¶
エレメントに対して特定の操作が行われたときに実行される処理を設定する画面です。設定方法は「アクションエディタ画面の操作方法」を参照してください。
5.1.1.4.4. 画面構成タブ¶
コンテナに配置されているエレメントの並び順や構成を閲覧するための画面です。利用方法は「画面構成タブを使用する」を参照してください。