IM-BloomMaker for Accel Platform IM-BloomMaker チュートリアルガイド 第6版 2024-06-01

4.2.3. デザイナ画面を開く

次に、アプリケーション画面を作成するための「デザイナ」画面を確認していきます。

4.2.3.1. デザイナ画面を開く

コラム

前節の操作で既にデザイナ画面が開いている場合はスキップしてください。
  1. 「サイトマップ」→「BloomMaker」→「コンテンツ一覧」から、「コンテンツ一覧」画面を表示します。

  2. デザイン編集を行うコンテンツをコンテンツツリーから選択しクリックします。

  3. 「レイアウト編集」をクリックします。

    ../../../../_images/open_designer_screen_011.png
    図:「レイアウト編集」
  4. 「デザイナ」画面が表示されます。

    ../../../../_images/open_designer_screen_021.png
    図:「デザイナ」画面 - 初期表示

4.2.3.2. デザイナ画面の詳細

デザイナ画面は、用途に応じて複数のペイン(区画)に分かれています。
各ペインの詳細は以下のとおりです。
../../../../_images/open_designer_screen_03.png
図:「デザイナ」画面 - 各ペインの役割
  1. ヘッダ

    デザイナに対する基本的な操作を提供するヘッダです。
    以下の操作が可能です。
    • 上書き保存といったコンテンツに対する操作
    • コピー、切り取り、貼り付けといった部品の操作
    • ページに部品を追加
  2. コンテナ

    エレメントを配置しアプリケーションを構成する画面です。
  3. コンテナヘッダ

    アプリケーション画面のページを設定する画面です。

コラム

ヘッダから、「プレビュー」アイコンをクリックして「プレビュー」画面を表示することで、チュートリアルを実施中にいつでもアプリケーションの確認ができます。
次節「レイアウトを設定する」では、アプリケーションのレイアウトを設定します。