ページ設計ツールについて

JDeveloperには同期化された統合設計ツール・セットが搭載されており、JSPページおよびHTMLページの作成および編集を行えます。ツールの1つを変更すると、その他のツールも自動的に更新されます。あるツールから別のツールに要素を移動またはコピーすることもできます。

ここでは、次の設計ツールについて説明します。

Javaソース・エディタ

ビジュアル・エディタでWebページを設計した後、ソース・エディタを使用して非ビジュアル・コンポーネントを追加するか、またはイベントおよびイベント・ハンドラに対するコードを作成して編集します。詳細

スプリッタを使用して別のエディタで2つ目のページ・ビューを開き、ページをソース・エディタとビジュアル・エディタで同時に編集します。ファイルを水平方向に分割するには、垂直スクロール・バーのすぐ上(ウィンドウの右上隅)でスプリッタをクリックし、下にドラッグします。ファイルを垂直方向に分割するには、水平スクロール・バーのすぐ右(ウィンドウの右下隅)でスプリッタをクリックし、左にドラッグします。

Javaソース・エディタには、JSPタグ・インサイト機能、EL式サポートおよびコード構文補完機能があります。

JSP/HTMLビジュアル・エディタ

JSPまたはHTMLページ内のユーザー・インタフェース要素を直接操作します。ビジュアル・エディタでファイルを開くと、ページはHTMLおよび関連するWeb形式で、デプロイしたときにWebブラウザに表示されるとおりにレンダリングされます。編集の結果を、ブラウザに表示される形式ですぐに確認できます。詳細

ビジュアル・エディタでのタグ、要素およびコンポーネントの操作

ビジュアル・エディタで実行できる基本操作は次のとおりです。

ビジュアル・エディタでの物理的位置の決定方法

Webページに要素を挿入する場合、構造ウィンドウのJSPまたはHTML設計ビューに表示される、ユーザー・インタフェース・コンポーネントの階層内での論理的な位置に挿入され、物理的な特定の位置ではありません。要素は、Webブラウザによって正しい物理的位置にレンダリングされます。ビジュアル・エディタでは要素は物理的位置にレンダリングされて表示されますが、ターゲット位置という表現はあくまでページ内での論理的位置を指します。この位置に要素を挿入した場合、実際には選択している要素の子または同レベルのコンポーネントとして挿入されます。

コンポーネント・パレット

コンポーネント・パレットには、設計中のWebページのファイル・タイプに対応するJDeveloperコンポーネント・ライブラリから、UIおよびデータのコンポーネントが表示されます。詳細

これらのコンポーネントは、アイコン・ビューまたはリスト・ビューで個々に表示されます。コンポーネントのビューを切り替えるには、右クリックして「アイコンで表示」または「一覧で表示」を選択します。コンポーネント名の上にマウスを置くと、そのコンポーネントの簡単な説明がツールチップに表示されます。詳しいヘルプを表示するには、リストからコンポーネントを右クリックして「ヘルプ」を選択します。

ビジュアル・エディタまたは構造ウィンドウにコンポーネントを挿入するには、次のいずれかを実行します。

コンポーネントの種類によっては、属性を設定するためのエディタが表示されます。コンポーネントを画面上でビジュアル・エディタまたは構造ウィンドウに追加すると、そのコンポーネントのソース・コードが自動的に生成されます。コンポーネントを削除すると、コード内の該当する行は削除されます。

コンポーネント・パレットをカスタマイズするには、「コンポーネント・パレットの設定」ダイアログを開き、メイン・メニューから「ツール」次の選択「パレットの設定」を選択するか、パレット内で右クリックして「プロパティ」を選択します。「コンポーネント・パレットの設定」ダイアログでページとコンポーネントを追加するか、パレットを右クリックして「ページの追加」または「コンポーネントの追加」を選択します。

「構造」ウィンドウ

構造ウィンドウを使用して、JSPまたはHTMLページのWebページ要素の階層構造を表示して編集します。Webページ要素を挿入、移動、コピー、貼付けおよび削除できます。構造ウィンドウで要素、タグまたはコンポーネントを右クリックすると、そのWebページ要素に関連したポップアップ・メニューが表示されます。詳細

プロパティ・インスペクタ

プロパティ・インスペクタを使用して、Webページ要素の属性を表示および設定します。設定済のプロパティ値には緑色のボックスが表示されます。

構造ウィンドウまたはビジュアル・エディタで要素を選択すると、プロパティ・インスペクタのタイトル・バーに選択した要素の名前が表示されます。プロパティ・インスペクタの左右の列には、選択中の要素のプロパティとプロパティ値が表示されます。プロパティを選択すると、最下部にそのプロパティの簡単な説明が表示されます。選択中のプロパティに関連するタスク(表のセルに対する「セルの分割」など)は、説明の上にあるタスク・リンク領域に表示されます。詳細

JSPおよびHTMLページの場合、プロパティ・インスペクタのツールバーには、次のオプションが表示されます。

「デフォルトに設定」ボタンデフォルトに設定

デフォルト値のあるプロパティをデフォルトにリセットする場合にクリックします。

「データにバインド」ボタン データにバインド

Webページ要素のプロパティに対してデータソースを設定または削除する場合にクリックします。データソースを設定する場合、プロパティ値のフィールドにEL式が表示され、省略記号省略記号ボタンボタンが使用できるようになります。省略記号ボタンをクリックすると「データにバインド」ダイアログが表示され、JSPオブジェクトで定義されるデータ・ソース、またはEL式に指定可能なアプリケーションのADFバインディング・コンテキストを選択できます。

複数の要素を選択してプロパティ・インスペクタを表示した場合、デフォルトでは、選択した要素のすべての属性が表示されます(統合して表示)。


Webページおよび設計ツールの操作
HTMLページの操作
JSPページの操作