7.2.2 ページ・デザイナの左ペイン

ページ・デザイナの左ペインを使用して、ページ上のコンテナおよびコンポーネントを選択または追加します。

選択したら、右ペインにあるプロパティ・エディタでコンテナまたはコンポーネントの属性を編集します。

7.2.2.1 ページ・デザイナの左ペインについて

ページ・デザイナの左ペインには、「レンダリング」、「動的アクション」、「プロセス」および「ページ共有コンポーネント」の4つのタブが表示されます。

各タブには、現在のページに作成された、対応するコンポーネント・タイプとコンポーネントのリストが表示されます。

左ペインの主な機能は次のとおりです。

  • コンテキスト・メニュー。コンポーネントまたはコントロールを右クリックすると、コンテキスト・メニューが表示されます。「レンダリング」メニューをクリックして、選択したコンポーネントのオプションを選択することもできます。
  • プロパティ・エディタへの迅速なアクセス。1つのコンポーネントまたは複数のコンポーネントを選択すると、右ペインのプロパティ・エディタに対応する属性が表示されます。
  • ドラッグ・アンド・ドロップ。コンポーネントをツリー内で上下にドラッグし、選択したコンポーネントの位置または順序を変更します。
  • ツールチップ。コンポーネントまたはコントロールの上にマウスをあわせると、リージョン・タイプ、アイテム・タイプなどの基本情報のツールチップが表示されます。

7.2.2.2 「レンダリング」タブ

ページ・デザイナの左ペインの「レンダリング」タブについて説明します。

「レンダリング」タブには、ページにレンダリングされるコンポーネントが表示されます。コンポーネントには、リージョン、ページ・アイテムおよびボタンが含まれます。動的アクションや検証などのアプリケーション・ロジックは、リージョン、ページ・アイテムおよびボタン内(該当する場合)に表示されます。

コンポーネントは、特定のページ位置でページ・レベルに配置することも、特定のリージョン位置でリージョン内でネストすることもできます。さらに、「レンダリング」タブには、プロセス、計算、ブランチなどのレンダリング前およびレンダリング後のアプリケーション・ロジックが表示されます。「レンダリング」タブでは、コンポーネントは実行時のOracle APEXでの処理方法に基づいてグループ化され、順序付けされます

新しいコンポーネントを作成するには、右クリックしてコンテキスト・メニューからオプションを選択します。または、「レンダリング」メニューからオプションを選択します。

pg_rendering.pngの説明が続きます
図pg_rendering.pngの説明

7.2.2.3 「動的アクション」タブ

ページ・デザイナの左ペインの「動的アクション」タブについて説明します。

「動的アクション」タブには、カレント・ページに対して定義された動的アクションが表示されます。動的アクションを作成することによって、JavaScriptを必要としないで複雑なクライアント側の動作を宣言的に定義できます。新しい動的アクションを作成するには、右クリックしてコンテキスト・メニューからオプションを選択します。

pg_dynamic_action.pngの説明が続きます
図pg_dynamic_action.pngの説明

7.2.2.4 「プロセス」タブ

ページ・デザイナの左ペインの「プロセス」タブについて説明します。

「プロセス」タブには、このページに対して定義されたアプリケーション・ロジックが表示され、コンポーネントがAPEXでの処理方法に基づいてグループ化され、順序付けされます。新しいプロセスを作成するには、右クリックしてコンテキスト・メニューからオプションを選択します。

図pg_processing.pngの説明が続きます
図pg_processing.pngの説明

7.2.2.5 「ページ共有コンポーネント」タブ

ページ・デザイナの左ペインの「ページ共有コンポーネント」タブについて説明します。

「ページ共有コンポーネント」タブには、現在のページに関連付けられている共有コンポーネントが表示されます。共有コンポーネントを編集するには、「ページ共有コンポーネント」タブでそのコンポーネントを選択し、右側のペインで「コンポーネントの編集」をクリックします。

次の例では、左側のペインで「ナビゲーション・バー」が選択され、右側のペインの「コンポーネントの編集」ボタンにカーソルが配置されます。

pg_shared_components.pngの説明が続きます
図pg_shared_components.pngの説明