14 ページでのリソース・カタログ・コンポーネントの使用

この章では、リソース・カタログからページにコンポーネントを追加する方法、コンポーネントでプロパティをカスタマイズしたり設定したりする方法およびコンポーネントを削除する方法について説明します。

WebCenterポータルの様々なタイプのページに関する概念情報については、第1.3.7項「ページとは」を参照してください。

この章の内容は、次のとおりです。

• 第14.1項「リソース・カタログへのアクセス」

• 第14.2項「ページへのコンポーネントの追加」

• 第14.3項「コンポーネント・プロパティの変更」

• 第14.4項「ページからのコンポーネントの削除」

権限: この章のタスクを実行するには、ポータルレベルの権限Basic Services: Edit Page Access, Structure, and Content (標準権限)またはPages: Edit Pages (アドバンスト権限)が必要です。ポータル・モデレータは、デフォルトでこの権限を持っています。 権限の詳細は、第29.1項「ポータルのロールと権限について」を参照してください。

14.1 リソース・カタログへのアクセス

リソース・カタログは、ポータルに追加できるコンポーネントや接続を公開するポータル・アセットです。リソース・カタログを使用して、ページ、ページ・テンプレートおよびタスク・フローを移入できます。リソース・カタログにリストされたアイテムは、総称してリソースと呼ばれます。詳細は、第23章「リソース・カタログの使用」を参照してください。

ページ、ページ・テンプレートまたはタスク・フローの編集時に使用できるリソース・カタログは、ポータル管理設定によって作成され、組込みリソース・カタログまたはカスタム・リソース・カタログを使用できます。詳細は、第7.3.5項「ポータルのページおよびページ・テンプレートのリソース・カタログの変更」を参照してください。

ページの編集時に、リソース・カタログを表示するには、(「デザイン」ビューおよび「選択」ビューで)インラインで行うか、(「デザイン」ビューで)インライン・リソース・カタログを非表示にしているときに「コンテンツの追加」ボタンをクリックするか、または「構造」ビューで「選択したコンポーネントにコンテンツを追加」アイコンをクリックします。詳細は、第14.2項「ページへのコンポーネントの追加」を参照してください。

注意: ポータルがWebCenter Portalリリース11.1.1.8.0より前のリリースのポータル(スペース)テンプレートに基づいていて、リリース11.1.1.8.0以降にアップグレードしていない場合(たとえば、11.1.1.8.0以前のリリースからスペースをそのままインポートした場合)、図6-7のようなビューが表示されます。階層ページ(サブページ)、ページ・バリアントまたはデバイス・プレビューがなく、ポータル管理には「デバイス設定」ページがありません。11.1.1.8.0以前のリリースのスペースでのページの使用については、http://www.oracle.com/technetwork/middleware/webcenter/portal/documentation/index.htmlにある、OTNのWebCenter Portalドキュメントを参照してください。 ポータルがこのリリースのWebCenter Portalリリース1.1.1.8.0以降のポータル・テンプレート(デフォルトのテンプレート(表3-1「すぐに使用できるポータル・テンプレートおよびカテゴリ」を参照)またはカスタムのテンプレート)に基づいている場合は、この項の手順を続行してください。

14.2 ページへのコンポーネントの追加

ページにコンポーネントを追加する方法は、リソース・カタログの各コリソースについて同一です。ページ・エディタの任意のビューで、ページにコンポーネントを追加できます。

• 第14.2.1項「「デザイン」ビューでのページへのコンポーネントの追加」

• 第14.2.2項「「選択」ビューでのページへのコンポーネントの追加」

• 第14.2.3項「「構造」ビューでのページへのコンポーネントの追加」

注意: ページにコンポーネントを追加するときは、追加のアクションを行う前にアプリケーションのステータス・インジケータでの処理が終了するのを待つ必要があります。 リソース・カタログのコンテンツは、ポータルに統合されているサービス、カタログを開いている場所および管理者が提供するリソースによってが異なります。たとえば、カタログに表示されるコンポーネントは、ホーム・ポータルから開いた場合とポータルから開いた場合では異なります。詳細は、第23.1項「リソース・カタログについて」を参照してください。 WebCenter Portalで使用できるすべてのコンポーネントの完全なリストについては、リソース・レジストリ(第23.2項「リソース・レジストリについて」)を参照してください。ページで表示可能になっているリソース・カタログに、求めるコンポーネントが存在しない場合は、その追加が必要なことがあります。詳細は、第23.5.1項「リソース・カタログへのリソースの追加」および第7.3.5項「ポータルのページおよびページ・テンプレートのリソース・カタログの変更」を参照してください。

14.2.1 「デザイン」ビューでのページへのコンポーネントの追加

「デザイン」ビューでページにコンポーネントを追加する手順は次のとおりです(第12.4.1.1項「コンポーザの「デザイン」ビューについて」を参照してください)。

1. 編集モードでページを開きます(第12.4.3項「ページ・エディタ(コンポーザ)でのページのオープン」を参照してください)。

   
   

   注意: デフォルトで、ビュー・スイッチャはに設定され、コンポーザの「デザイン」ビューには、インライン・リソース・カタログを示したページが表示されます(図14-1)。

   
   

   図14-1 「デザイン」ビューのインライン・リソース・カタログ

   
   「図14-1 「デザイン」ビューのインライン・リソース・カタログ」の説明
   
   

2. (オプション)インライン・リソース・カタログを非表示にして、かわりにコンポーネントを追加できる場所を識別できるように「コンテンツの追加」ボタンとともにページの各領域を表示するには、「カタログの非表示」をクリックします(図14-2)。「コンテンツの追加」ボタンをクリックすると、スタンドアロン・リソース・カタログが開きます。スタンドアロン・リソース・カタログでは、コンポーネントをページにドラッグ・アンド・ドロップして追加することはサポートされていません。

   「カタログの表示」をクリックして、インライン・リソース・カタログを再度公開します。

   図14-2 「デザイン」ビューの「コンテンツの追加」ボタン

   
   「図14-2 「デザイン」ビューの「コンテンツの追加」ボタン」の説明
   
   

3. リソース・カタログで、フォルダの横の「開く」をクリックして、関連コンポーネントにドリルダウンするか、検索することによって、ページに追加するコンポーネントに移動します。1つの例として、図14-3は、インライン・リソース・カタログの「Web開発」フォルダからアクセスできるコンポーネントを示しています。

   
   

   注意: デフォルトのリソース・カタログからアクセスできるコンポーネントの説明は、第23.1項「リソース・カタログについて」を参照してください。現在のページからアクセスできるリソース・カタログを、デフォルトのリソース・カタログより少ないまたは多くのコンポーネントを含めるようカスタマイズできます。

   
   

   ページに追加する必要があるコンポーネントが、ページで使用されているリソース・カタログに含まれていない場合、必要なコンポーネントが含まれる新規バージョンのリソース・カタログを作成して、そのリソース・カタログをページに割り当てることができます。第23章「リソース・カタログの使用」の特に第23.5.1項「リソース・カタログへのリソースの追加」を参照してください。

   図14-3 リソース・カタログのWeb開発コンポーネント

   
   「図14-3 リソース・カタログのWeb開発コンポーネント」の説明
   
   

4. 次の方法でページに新しいコンポーネントを追加します。

   • リソース・カタログのコンポーネントの横にある「追加」をクリックすると、デフォルトでページの上部にそのコンポーネントが追加されます。

     
     

     注意: 「選択」ビューで対象のページに対してすでに既存のコンポーネントが選択されている場合、新しいコンポーネントは選択されているコンポーネントの後ろに追加されます。

     
     

   • (インライン・リソース・カタログの場合のみ)インライン・リソース・カタログからコンポーネントのアイコンを、ページ上の目的の位置にドラッグします(図14-4)。

     図14-4 「デザイン」ビューでのインライン・リソース・カタログを使用したページへのコンポーネントの追加

     
     「図14-4 「デザイン」ビューでのインライン・リソース・カタログを使用したページへのコンポーネントの追加」の説明
     
     

5. ページ上でコンポーネントを移動するには、コンポーネント・ヘッダーの「アクション」アイコンをクリックして、コンポーネントを上または下に移動するか、コンポーネント・ヘッダーをクリックしてコンポーネントを新しい位置にドラッグします。

6. 「保存」をクリックして変更を保存します。

14.2.2 「選択」ビューでのページへのコンポーネントの追加

「選択」ビューでページにコンポーネントを追加する手順は次のとおりです(第12.4.1.2項「コンポーザの「選択」ビューについて」を参照してください)。

1. 編集モードでページを開きます(第12.4.3項「ページ・エディタ(コンポーザ)でのページのオープン」を参照してください)。

2. ビュー・スイッチャをクリックしてに設定し、「選択」タブをクリックして、「選択」ビューに、インライン・リソース・カタログを示したページを表示します(図14-5)。

   図14-5 ページ・エディタの「選択」ビュー

   
   「図14-5 ページ・エディタの「選択」ビュー」の説明
   
   

3. (オプション)インライン・リソース・カタログを非表示にするには、「カタログの非表示」をクリックします。「デザイン」ビューとは異なり、「選択」ビューには、インライン・リソース・カタログを非表示にしたときに「コンテンツの追加」ボタンは表示されません。

   
   

   ヒント: 「デザイン」ビューの「コンテンツの追加」ボタンと同じように「選択」ビューで新しいコンポーネントの目的の位置を指定するには、「選択」ビューで既存のレイアウト・コンテナ(ボックス・コンポーネントや移動可能ボックス・コンポーネントなど)を選択して、リソース・カタログ内のコンポーネントの横の「追加」をクリックし、選択したレイアウト・コンテナ内にそのコンポーネントを追加します。

   
   

   「カタログの表示」(図14-6)をクリックして、インライン・リソース・カタログを再度公開します。

   図14-6 「選択」ビューで非表示になっているインライン・リソース・カタログ

   
   「図14-6 「選択」ビューで非表示になっているインライン・リソース・カタログ」の説明
   
   

4. リソース・カタログで、フォルダの横の「開く」をクリックして、関連コンポーネントにドリルダウンするか、検索することによって、追加するコンポーネントに移動します。

   
   

   注意: デフォルトのリソース・カタログからアクセスできるコンポーネントの説明は、第23.1項「リソース・カタログについて」を参照してください。現在のページからアクセスできるリソース・カタログを、デフォルトのリソース・カタログより少ないまたは多くのコンポーネントを含めるようカスタマイズできます。

   
   

   ページに追加する必要があるコンポーネントが、ページで使用されているリソース・カタログに含まれていない場合、必要なコンポーネントが含まれる新規バージョンのリソース・カタログを作成して、そのリソース・カタログをページに割り当てることができます。第23章「リソース・カタログの使用」の特に第23.5.1項「リソース・カタログへのリソースの追加」を参照してください。

5. 次の方法でページに新しいコンポーネントを追加します。

   • リソース・カタログのコンポーネントの横にある「追加」をクリックすると、デフォルトでページの上部にそのコンポーネントが追加されます。

   • ページ上で既存のレイアウト・コンテナ(ボックス・コンポーネントや移動可能ボックス・コンポーネントなど)を選択して、リソース・カタログ内のコンポーネントの横の「追加」をクリックし、選択したレイアウト・コンテナ内にそのコンポーネントを追加します。

   • レイアウト・コンテナ以外の他のコンポーネントを選択して、リソース・カタログ内のコンポーネントの横の「追加」をクリックし、選択したコンポーネントの下にコンポーネントを追加します。

   • インライン・リソース・カタログからコンポーネントのアイコンを、ページ上の目的の位置にドラッグします(図14-7)。

   図14-7 「選択」ビューでのページへのコンポーネントの追加

   
   「図14-7 「選択」ビューでのページへのコンポーネントの追加」の説明
   
   

6. 「保存」をクリックして変更を保存します。

14.2.3 「構造」ビューでのページへのコンポーネントの追加

「構造」ビューでページにコンポーネントを追加する手順は次のとおりです(第12.4.1.3項「コンポーザの「構造」ビューについて」を参照してください)。

1. 編集モードでページを開きます(第12.4.3項「ページ・エディタ(コンポーザ)でのページのオープン」を参照してください)。

2. ビュー・スイッチャをクリックしてに設定し、「構造」タブをクリックして、「構造」ビューにページを表示します(図14-8)。

   図14-8 ページ・エディタの「構造」ビュー

   
   「図14-8 ページ・エディタの「構造」ビュー」の説明
   
   

3. ページ・コンポーネントの階層リストで、コンテンツを配置するコンポーネントを選択します。

   
   

   ヒント: コンポーネントは、ページのWYSIWYGセクションでクリックして選択することもできます。選択したコンポーネントはアウトラインが青色で表示されます。

   
   

4. 「選択したコンポーネントにコンテンツを追加」アイコンをクリックして、リソース・カタログを開きます(図14-9)。

   図14-9 ページ・エディタの「構造」ビューでのリソース・カタログの表示

   
   「図14-9 ページ・エディタの「構造」ビューでのリソース・カタログの表示」の説明
   
   

5. リソース・カタログで、フォルダの横の「開く」をクリックして、関連コンポーネントにドリルダウンするか、検索することによって、追加するコンポーネントに移動し、その横の「追加」リンクをクリックします。このリソース・カタログ・ダイアログでは、ドラッグ・アンド・ドロップはサポートされていません。

6. 「保存」をクリックして変更を保存します。

14.3 コンポーネント・プロパティの変更

リソース・カタログからページに追加可能なコンポーネントには、コンポーネントの外観および動作を制御する構成可能なプロパティがあります。使用可能なプロパティは、コンポーネントによって異なります。

この項では、ページ・コンポーネントでプロパティをカスタマイズおよび設定する方法について説明します。

• 第14.3.1項「コンポーネントのプロパティについて」

• 第14.3.2項「コンポーネントのプロパティの設定」

• 第14.3.3項「コンポーネント・パラメータの使用」

• 第14.3.4項「コンポーネントの表示オプションの使用」

• 第14.3.5項「子コンポーネントの使用」

• 第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」

• 第14.3.7項「コンポーネントのコンテキスト・イベントの使用」

14.3.1 コンポーネントのプロパティについて

コンポーネント・プロパティを使用して、コンポーネント・インスタンスの外観および動作を調整したり、コンポーネントを相互に結び付けたり、ページ・パラメータおよびページ定義変数に結び付けたりできます。

関連項目: 第19章「ページ、タスク・フロー、ポートレットおよびADFコンポーネントの結付け」

コンポーネントの「コンポーネント・プロパティ」ダイアログは次の複数のタブに分割されています。

• パラメータ: コンポーネント・タイプに固有で、コンポーネント・コンテンツのソースなどを制御できる設定。第14.3.3項「コンポーネント・パラメータの使用」を参照してください。

• 表示オプション: コンテンツの方向の決定、ヘッダーの非表示および表示、アクション・メニューの表示方法の選択などの設定。第14.3.4項「コンポーネントの表示オプションの使用」を参照してください。

• 子コンポーネント: 親コンポーネントに含まれるすべてのコンポーネントのリスト。第14.3.5項「子コンポーネントの使用」を参照してください。

• スタイル: 親コンポーネント、ページおよびアプリケーションの値をオーバーライドする、コンポーネントのフォント、色およびディメンションの設定。「スタイル」の値は、コンポーネントのコンテンツおよびそのコンテンツを取り巻く要素に影響を与えます。ただし、この値は、コンポーネントの要素(スキンなど)がこれらの設定の変更をサポートするかどうかにより、公開される場合と公開されない場合があります。第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」を参照してください。

• コンテンツ・スタイル: コンポーネントのコンテンツで、「スタイル」に指定された値をオーバーライドするフォント、色およびディメンションの設定。これらの設定は、コンポーネントの要素(スキンなど)がこれらの設定の変更をサポートするかどうかによって、公開される場合と公開されない場合があります。第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」を参照してください。

• イベント: 現在選択されているコンポーネントで使用可能な、現在のページ上のすべてのコンポーネントを対象にしたコンテキスト・イベントおよびイベント・ハンドラ。イベントは現在のコンテキスト内で定義された発生事項で、イベント・ハンドラはその発生の結果を表示するエンジンです。第14.3.7項「コンポーネントのコンテキスト・イベントの使用」を参照してください。

14.3.2 コンポーネントのプロパティの設定

この項では、任意のページ・コンポーネントでプロパティを設定する場合の一般的な手順の概要を示します。

関連項目: 特定のコンポーネントに関連付けられたプロパティの詳細は、該当するコンポーネントについて説明する項を参照してください。たとえば、ボックス・コンポーネントに関連付けられたプロパティの詳細は、第15.3.2項「ボックス・コンポーネントのプロパティの設定」を参照してください。

コンポーネントの「コンポーネント・プロパティ」ダイアログには、ページ・エディタのいずれのビューからでもアクセスできます。

• 第14.3.2.1項「「デザイン」ビューでのコンポーネント・プロパティの設定」

• 第14.3.2.2項「「選択」ビューでのコンポーネント・プロパティの設定」

• 第14.3.2.3項「「構造」ビューでのコンポーネント・プロパティの設定」

注意: 「コンポーネント・プロパティ」ダイアログにプロパティ値を入力して「適用」をクリックすると、ほとんどのタイプのプロパティ値では、ダイアログが開いたままになります。予測した値タイプ以外の値の場合は、ダイアログが閉じて、新しい値を反映するためにページがリフレッシュされます。たとえば、コンポーネントがjava.awt.Colorクラスのjava.util.ArrayListを取る場合、その値の追加後に「コンポーネント・プロパティ」ダイアログが閉じて、新しいプロパティでページがリフレッシュされます。 リテラル・テキスト(value)の入力に加えて、式言語(EL)式(#{value})も入力できます。EL式に関してサポートが必要な場合、アプリケーション開発者がEL式を提供できます。詳細は、Oracle WebCenter PortalおよびOracle JDeveloperでのポータルの開発の式言語式に関する付録を参照してください。 「コンポーネント・プロパティ」ダイアログの汎用の「表示オプション」タブでELを入力する際、閉じ大カッコがないなど無効な構文が検出された場合にのみ、パーサーはエラーを報告します。検証は構文に対してのみ行われ、式の値に対しては行われません。汎用の表示オプションとは、表14-1「表示オプション・プロパティ」に掲載されているオプションです。 汎用以外の表示オプションには、ELの検証は行われません。

14.3.2.1 「デザイン」ビューでのコンポーネント・プロパティの設定

「デザイン」ビューでページ上のコンポーネントのプロパティを設定する手順は次のとおりです。

1. 編集モードでページを開きます(第12.4.3項「ページ・エディタ(コンポーザ)でのページのオープン」を参照してください)。

   
   

   注意: デフォルトで、ビュー・スイッチャはに設定され、コンポーザの「デザイン」ビューには、インライン・リソース・カタログを示したページが表示されます(図14-1)。

   
   

2. 対象のコンポーネントで「編集」アイコン(図14-10)をクリックして、「コンポーネント・プロパティ」ダイアログを開きます。

   図14-10 コンポーネントの「編集」アイコン

   
   「図14-10 コンポーネントの「編集」アイコン」の説明
   
   

3. 「コンポーネント・プロパティ」ダイアログで、タブをクリックしてコンポーネント・プロパティを表示し、編集します。カテゴリの詳細は、次を参照してください。

   次に「OK」をクリックして、「コンポーネント・プロパティ」ダイアログを閉じます。

   
   

   ヒント: 「コンポーネント・プロパティ」ダイアログの「ヘルプ」アイコンをクリックすると、現在のコンポーネントのプロパティの説明に移動できます。

   
   

4. 「コンポーネント・プロパティ」ダイアログで、タブをクリックしてコンポーネント・プロパティを表示し、編集します。

   
   

   ヒント: 「コンポーネント・プロパティ」ダイアログの「ヘルプ」アイコンをクリックすると、現在のコンポーネントのプロパティの説明に移動できます。

   
   

   コンポーネント・プロパティの様々なカテゴリの詳細は、次を参照してください。

   • 第14.3.3項「コンポーネント・パラメータの使用」

   • 第14.3.4項「コンポーネントの表示オプションの使用」

   • 第14.3.5項「子コンポーネントの使用」

   • 第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」

   • 第14.3.7項「コンポーネントのコンテキスト・イベントの使用」

5. 「OK」をクリックしてプロパティ・ダイアログを閉じます。

14.3.2.2 「選択」ビューでのコンポーネント・プロパティの設定

「選択」ビューでページ上のコンポーネントのプロパティを設定する手順は次のとおりです。

1. 編集モードでページを開きます(第12.4.3項「ページ・エディタ(コンポーザ)でのページのオープン」を参照してください)。

2. ビュー・スイッチャをクリックしてに設定し、「選択」タブをクリックして、「選択」ビューにページを表示します。

3. ページでコンポーネントをクリックして選択し(青い枠線で強調表示されます)、ポップアップ・メニューから次のいずれかを選択します(図14-11)。

   • 「コンポーネントの編集」を選択すると、対象のコンポーネントの「コンポーネント・プロパティ」ダイアログが開きます。

   • 「親コンポーネントの編集」を選択すると、対象のコンポーネントが含まれる親コンポーネントの「コンポーネント・プロパティ」ダイアログが開きます。

   図14-11 「選択」ビューでのコンポーネント・プロパティの設定

   
   「図14-11 「選択」ビューでのコンポーネント・プロパティの設定」の説明
   
   

4. 「コンポーネント・プロパティ」ダイアログで、タブをクリックしてコンポーネント・プロパティを表示し、編集します。

   
   

   ヒント: 「コンポーネント・プロパティ」ダイアログの「ヘルプ」アイコンをクリックすると、現在のコンポーネントのプロパティの説明に移動できます。

   
   

   コンポーネント・プロパティの様々なカテゴリの詳細は、次を参照してください。

   • 第14.3.3項「コンポーネント・パラメータの使用」

   • 第14.3.4項「コンポーネントの表示オプションの使用」

   • 第14.3.5項「子コンポーネントの使用」

   • 第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」

   • 第14.3.7項「コンポーネントのコンテキスト・イベントの使用」

5. 「OK」をクリックしてプロパティ・ダイアログを閉じます。

14.3.2.3 「構造」ビューでのコンポーネント・プロパティの設定

「構造」ビューでページ上のコンポーネントのプロパティを設定する手順は次のとおりです。

1. 編集モードでページを開きます(第12.4.3項「ページ・エディタ(コンポーザ)でのページのオープン」を参照してください)。

2. ビュー・スイッチャをクリックしてに設定し、「構造」タブをクリックして、「構造」ビューにページを表示します。

3. WYSIWYGペインでコンポーネントをクリックするか、または階層リスト・ペインでコンポーネントのエントリをクリックすることによって、コンポーネントを選択します。

4. 階層リスト・ペインの上にある「コンポーネント名のプロパティの表示」アイコン(図14-12)をクリックして、「コンポーネント・プロパティ」ダイアログを開きます。

   図14-12 「プロパティの表示」アイコン

   
   「図14-12 「プロパティの表示」アイコン」の説明
   
   

5. 「コンポーネント・プロパティ」ダイアログで、タブをクリックしてコンポーネント・プロパティを表示し、編集します。

   
   

   ヒント: 「コンポーネント・プロパティ」ダイアログの「ヘルプ」アイコンをクリックすると、現在のコンポーネントのプロパティの説明に移動できます。

   
   

   コンポーネント・プロパティの様々なカテゴリの詳細は、次を参照してください。

   • 第14.3.3項「コンポーネント・パラメータの使用」

   • 第14.3.4項「コンポーネントの表示オプションの使用」

   • 第14.3.5項「子コンポーネントの使用」

   • 第14.3.6項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用」

   • 第14.3.7項「コンポーネントのコンテキスト・イベントの使用」

6. 「OK」をクリックしてプロパティ・ダイアログを閉じます。

14.3.3 コンポーネント・パラメータの使用

コンポーネントのパラメータは、「コンポーネント・プロパティ」ダイアログの「パラメータ」タブに表示されます(図14-13)。

図14-13 コンポーネントのパラメータ: 「アクティビティ・ストリーム」タスク・フロー

「図14-13 コンポーネントのパラメータ: 「アクティビティ・ストリーム」タスク・フロー」の説明

関連項目: 第14.3.2項「コンポーネントのプロパティの設定」

コンポーネント・パラメータは、コンポーネントごとに異なります。たとえば、一部のコンポーネントでは、タスク・フロー・コンテンツのソースおよび範囲を指定できるようになり、他のコンポーネントでは、タスク・フロー・インスタンスとそのカスタマイズとの関連付けの維持に使用される、アプリケーションで生成された読取り専用の識別子が提供されます。このガイドでは、各コンポーネントを説明するセクションにパラメータの説明が記載されています。また、「パラメータ」ダイアログで使用できるオンライン・ヘルプから、パラメータの詳細な説明にアクセスできます。

パラメータ値を入力するか、パラメータ・フィールドの横にあるアイコンをクリックし、式言語(EL)エディタを選択して開きます。EL式に関してサポートが必要な場合、アプリケーション開発者がEL式を提供できます。詳細は、Oracle WebCenter PortalおよびOracle JDeveloperでのポータルの開発の式言語式に関する付録を参照してください。

このエディタでは、あるパラメータ値を現在のユーザー名または現在のアプリケーション・スキン名にする場合など、ある値が検出はできるものの不明な場合に式を入力する手段を提供します。

14.3.4 コンポーネントの表示オプションの使用

「コンポーネント・プロパティ」ダイアログの「表示オプション」タブでは、指定のコンポーネント・インスタンスの表示関連の動作範囲を制御するプロパティにアクセスできます(図14-14)。

図14-14 コンポーネントの「表示オプション」: 「基本」プロパティ

「図14-14 コンポーネントの「表示オプション」: 「基本」プロパティ」の説明

関連項目: 第14.3.2項「コンポーネントのプロパティの設定」

たとえば、イメージ・ソースのURLおよびそのオプションのリンク・ターゲットを指定するには、イメージ・コンポーネントの表示オプションを使用します。ヘッダーを非表示または表示してそのヘッダーでメニューその他のオプションを有効または無効にするには、お知らせマネージャ・タスク・フローの表示オプションを使用します。

一部のコンポーネントには、「表示オプション」タブがあり、「基本」および「詳細設定」の2つのサブタブに分割されています。

これにより、表示オプションの長いリストを、より管理しやすく関連性のあるグループに分割できます。ページ・エディタの「デザイン」ビューではわかりにくいですが、通常、showDetailFrameコンポーネントは、様々なサービスによって指定されたタスク・フローをラップします。その結果、タスク・フローの表示オプション・プロパティおよびshowDetailFrameにラップされたその他のコンポーネントでは、「表示オプション」タブに「基本」および「詳細設定」のサブタブが存在します。

showDetailFrameでラップされるもう1つの結果が、「表示オプション」タブのプロパティの共有です。showDetailFrameにラップされているタスク・フローおよびその他のコンポーネントでは、同じ表示オプション・プロパティを共有します。

「表示オプション」タブの多くのプロパティでは、テキスト文字列、式言語(EL)式などのカスタム値の入力に式エディタを使用できます。プロパティ・フィールドの横にあるアイコンをクリックし(図14-15)、「式ビルダー」を選択してエディタを開きます。EL式に関してサポートが必要な場合、アプリケーション開発者がEL式を提供できます。詳細は、Oracle WebCenter PortalおよびOracle JDeveloperでのポータルの開発の式言語式に関する付録を参照してください。

図14-15 式エディタの「編集」アイコン

「図14-15 式エディタの「編集」アイコン」の説明

注意: 「コンポーネント・プロパティ」ダイアログの汎用の「表示オプション」タブでELを入力する際、閉じ大カッコがないなど無効な構文が検出された場合にのみ、パーサーはエラーを報告します。検証は構文に対してのみ行われ、式の値に対しては行われません。汎用の表示オプションとは、表14-1「表示オプション・プロパティ」に掲載されているオプションです。 汎用以外の表示オプションには、ELの検証は行われません。

通常、「表示オプション」タブには、コンポーネント・コンテンツを囲む表示要素(つまり、クロム)に影響を与える設定が表示されます。クロムには、ヘッダー、「アクション」メニュー、「展開」アイコン、「縮小」アイコンなどが含まれます。

表14-1は、通常、ほとんどのコンポーネントに適用される「表示オプション」のプロパティをリストして説明しています。バリエーションがある場合は、特定のコンポーネントについて説明する章で説明しています。

表14-1 表示オプション・プロパティ

プロパティ	説明
Allow Minimize	コンポーネント・ヘッダーの最小化アクション(つまり、コンポーネント・クロムの「縮小」アイコン)を表示するかどうかを選択します。 チェック・ボックスを選択すると「縮小」アイコンが表示されます。 チェック・ボックスを選択解除すると「縮小」アイコンが非表示になります。 最小化アイコンでは、ブラインドを巻き上げるようにコンポーネントを縮小し、ビューにそのヘッダーのみを表示します。 コンポーネントを最小化すると、アイコンが「展開」アイコンに切り替わります。このアイコンを使用すると、表示するコンポーネント全体をリストアできます。
Allow Move	ユーザーによるページ上のコンポーネントの移動を可能にするかどうかを選択します。次から選択します: 有効: コンポーネントの「アクション」メニューの「移動」オプション(「上へ移動」、「下へ移動」、「左へ移動」および「右へ移動」)を使用してコンポーネントを移動できます。 表示される「移動」オプションは、親コンテナの向き(水平または垂直)によって異なります。「移動」オプションは状況に依存します。たとえば、垂直方向の親コンテナで、現在のタスク・フロー上にコンポーネントがない場合は、「アクション」メニューに「上へ移動」オプションが表示されません。 ドラッグ・アンド・ドロップのみ: ドラッグ・アンド・ドロップのみを使用してコンポーネントを移動できます。 無効: コンポーネントは移動できません。
Allow Remove	ページがビュー・モードのときに、コンポーネント・ヘッダー(つまり、コンポーネント・クロム)に「削除」アイコンを表示するかどうかを選択します。次から選択します: チェック・ボックスを選択すると、ビュー・モードのコンポーネント・ヘッダーに「削除」アイコンが表示されます。 チェック・ボックスを選択解除すると、ビュー・モードで「削除」アイコンは表示されません。 ページ・ビュー・モードでこの方法によるコンポーネントの削除を選択した場合は、ページを編集して別のコンポーネント・インスタンスを追加すること以外にコンポーネントのリストア方法がないことに注意してください。ページ作成者は、エンド・ユーザーに、ページの表示時にコンポーネントを削除することを許可したくない場合があります。ページの編集権限があるユーザーは、編集モードでコンポーネントを削除できます。
Allow Resize	コンポーネント・インスタンスにウィンドウ・リサイザを表示するかどうかを選択します。このウィンドウ・リサイザにより、コンポーネントの高さを増やすことができます。 チェック・ボックスを選択すると、コンポーネントに「サイズ変更」オプションが表示されます。 チェック・ボックスを選択解除すると、「サイズ変更」オプションが非表示になります。 注意: このプロパティを選択すると、showDetailFrameコンポーネントの高さが固定されるため、コンテンツでは、サイズ変更されたshowDetailFrameコンポーネントよりコンテンツが大きいか小さいかに基づいて、スクロールバーまたは領域を満たすための空白が表示されます。コンテンツ・フローを許可するにはAllow Resizeを選択解除することをお薦めします。これによって、コンテンツが追加された場合に、showDetailFrameコンポーネントが大きくなります。
Chrome Style	コンポーネントの背景の濃淡を選択して指定します。 次を入力します: light: 淡色は透過で、優先される背景色が透けて表示されます。 medium: 中間では、ヘッダー領域の下に淡色の線が引かれます。 dark: 濃淡のある影がヘッダー領域の下部からコンポーネントの上部にかけて透過から濃色に段階的に移り変わります。 coreDefault: 濃色よりやや淡い、濃淡のある影。
Display Header	このチェック・ボックスを選択すると、コンポーネント・インスタンスにヘッダーが表示されます。
Display Shadow	コンポーネント・インスタンスの背後にシャドウを選択してレンダリングします。
Font	コンポーネント・ヘッダーに表示されるテキストに使用するフォントを指定します。 1つまたは複数のフォントを入力します。arial,helvetica,sans serifなど、複数の値をカンマ(,)で区切ります。'Times New Roman'など、空白を含むフォント名は一重引用符で囲みます。ブラウザでは、最初の値の使用を試み、ローカル・システムで使用可能なフォントに応じて、順に他の値を使用します。
Font Color	コンポーネント・ヘッダーに表示されるテキストの色を選択します。 次のいずれかの手法を使用して色を選択します。 色をクリックして選択します。 色のRGBに相当する値を「フォントの色」フィールドに入力します。RGB値は、RRGGBB、#RRGGBBまたはr,g,bの形式で入力します。 カスタム色を作成するには、ピッカーで「カスタム色」をクリックし、提供されているセレクタおよびスライダを使用して色および彩度のレベルを選択します。
Font Size	コンポーネント・ヘッダーに表示されるテキストのサイズを指定します。 次のいずれかのタイプの値を使用して値を入力します。 length: フォント・サイズを固定サイズに設定します。たとえば、14px、1.5emなどと入力します。 xx-small、x-smallまたはsmall medium: デフォルトです large、x-largeまたはxx-large smaller: フォント・サイズを親要素より小さなサイズに設定します。 larger: フォント・サイズを親要素より大きなサイズに設定します。 %: 現在のフォント・サイズを親要素のフォント・サイズの指定の割合に設定します。たとえば、75%と入力します
Font Style	フォント・スタイルをコンポーネント・ヘッダーのテキストに適用するオプションを選択します。次から選択します: 太字 イタリック 下線 取消線
Short Desc	コンポーネント・インスタンスのツールチップ・テキストを入力します。コンポーネント・インスタンス上にマウス・ポインタを置くと、ここで入力するテキストがポップアップで表示されます。
Show Actions On Hover	選択すると、コンポーネント・ヘッダーにマウス・ポインタを置いたときにアクションが表示されます。 チェック・ボックスを選択すると、コンポーネント・ヘッダーにマウス・ポインタを置いたときのみアクションが表示されます。 チェック・ボックスを選択解除すると、アクションが常にコンポーネント・ヘッダーに表示されます。 このオプションを適用するには、Display Headerを選択する必要があります。
Show Component	ページ上のコンポーネント・インスタンスを表示または非表示にするオプション 選択すると、コンポーネントが表示されます。 選択解除すると、コンポーネントは非表示になります。 この方法でコンポーネントを非表示にした場合、コンポーザの「構造」ビューで使用可能なコントロールを使用してそのコンポーネントを再表示できます。「構造」ビューで、非表示のコンポーネントを右クリックし、表示されるコンテキスト・メニューから「コンポーネントの表示」を選択します。
Text	コンポーネント・ヘッダーに表示するテキストを入力します。ヘッダーを選択して非表示にすると、ここで入力する値は無視されます。

14.3.5 子コンポーネントの使用

「コンポーネント・プロパティ」ダイアログの「子コンポーネント」タブ(図14-16)には、現在の(親)コンポーネント内に含まれるコンポーネントの非表示、表示および再配置を行うためのコントロールが提供されています。

図14-16 「コンポーネント・プロパティ」ダイアログの「子コンポーネント」タブ

「図14-16 「コンポーネント・プロパティ」ダイアログの「子コンポーネント」タブ」の説明

関連項目: 第14.3.2項「コンポーネントのプロパティの設定」

「子コンポーネント」タブを使用して行う変更は、コンポーネント・インスタンスのすべてのユーザーのビューに影響を与えるカスタマイズとなります。

この項では、「子コンポーネント」タブでの作業の詳細を説明します。

• 第14.3.5.1項「子コンポーネントの表示名のカスタマイズ」

• 第14.3.5.2項「子コンポーネントの非表示および表示」

• 第14.3.5.3項「子コンポーネントの再配置」

14.3.5.1 子コンポーネントの表示名のカスタマイズ

複数の子コンポーネントのタイプが同じ場合、子コンポーネントのリスト内でお互いに区別が付かない可能性があります。たとえば、panelGroupLayoutコンポーネントが表示名としてそのlayout属性の値(verticalなど)を使用している場合、図14-17の「構造」ビューに示すように、複数のpanelGroupLayoutコンポーネントが、子コンポーネントのリストに同じ名前で表示される可能性があります。

図14-17 子コンポーネントの名前

「図14-17 子コンポーネントの名前」の説明

特定の子コンポーネントを識別して使用する必要がある場合は、ページのソース・コードを編集してコンポーネントの固有の表示名を指定し、簡単に区別できるようにします。この表示名は、ヒント・テキストおよび「コンポーネント・プロパティ」ダイアログに表示されます。これは、Oracle WebCenter PortalおよびOracle JDeveloperでのポータルの開発の子コンポーネントの表示名のカスタマイズに関する項に記載されている、開発者のタスクです。

14.3.5.2 子コンポーネントの非表示および表示

非表示は、コンポーネント・インスタンスを一般のビューからは外すものの、ページ上にその存在を維持する場合に役に立ちます。「コンポーネント・プロパティ」ダイアログを使用して子コンポーネントを非表示にすると、ページのすべてのユーザーのビューで非表示になります。コンポーネント・インスタンスを表示する用意ができている場合、表示するには、「子コンポーネント」タブを使用して表示するコンポーネントを再選択するのみです。

子コンポーネントを非表示または表示するには、次の手順を実行します。

1. 「子コンポーネント」タブで、次のいずれかを実行します。

   • 非表示にする任意のコンポーネントの左側にあるチェック・ボックスを選択解除します。

   • 表示する任意のコンポーネントの左側にあるチェック・ボックスを選択します。

2. 「OK」をクリックしてダイアログを終了します。

3. 「保存」をクリックして変更を保存します。

14.3.5.3 子コンポーネントの再配置

「子コンポーネント」タブでは、ボックス・コンポーネントなど、特定のコンテナ内でコンテンツを再配置する、便利で効率的な方法が提供されています。「コンポーネント・プロパティ」ダイアログを使用して子コンポーネントを再配置すると、ページのすべてのユーザーのビューでも再配置されます。

ヒント: ページ・コンポーネントのヘッダーをクリックして、それをコンポーザ内の新しい位置にドラッグすることにより、そのページ・コンポーネントをすべてのユーザーのビューで再配置することもできます。

注意: ボックス・コントロールを使用してボックスを分割すると、「子コンポーネント」タブの「コンポーネント・プロパティ」ダイアログで再配置機能が無効化されます。そのようなボックスでも、ページ自体でドラッグ・アンド・ドロップすることでコンテンツを再配置できます。

子コンポーネントを再配置するには、次の手順を実行します。

1. 「子コンポーネント」タブで、移動するコンポーネントの横にある上矢印または下矢印をクリックします。

   
   

   ヒント: 子コンポーネントを移動する方向は、その親コンテナの向きによって異なります。たとえば、コンテナの向きが垂直の場合は、子コンポーネントは上に移動(上矢印)するか、下に移動(下矢印)します。コンテナの向きが水平の場合は、子コンポーネントは右に移動(上矢印)するか、左に移動(下矢印)します。

   
   

2. 「OK」をクリックしてダイアログを終了します。

3. 「保存」をクリックして変更を保存します。

14.3.6 スタイル・プロパティおよびコンテンツ・スタイル・プロパティの使用

「コンポーネント・プロパティ」ダイアログの「スタイル」タブおよび「コンテンツ・スタイル」タブ(図14-18および図14-18)では、アプリケーションのルック・アンド・フィールをコンポーネント・レベルで最適に調整できます。「スタイル」プロパティおよび「コンテンツ・スタイル」プロパティの値を入力するか、両方のタブに表示されているOther CSSプロパティを使用して独自の値を指定します。

図14-18 「コンポーネント・プロパティ」ダイアログの「スタイル」タブ

「図14-18 「コンポーネント・プロパティ」ダイアログの「スタイル」タブ」の説明

図14-19 「コンポーネント・プロパティ」ダイアログの「コンテンツ・スタイル」タブ

「図14-19 「コンポーネント・プロパティ」ダイアログの「コンテンツ・スタイル」タブ」の説明

関連項目: 第14.3.2項「コンポーネントのプロパティの設定」

この項では、Other CSSプロパティを含め、スタイル・プロパティとコンテンツ・スタイル・プロパティについて説明します。

• 第14.3.6.1項「スタイル・プロパティおよびコンテンツ・スタイル・プロパティ」

• 第14.3.6.2項「Other CSSプロパティの使用」

• 第14.3.6.3項「Other CSSプロパティの例」

14.3.6.1 スタイル・プロパティおよびコンテンツ・スタイル・プロパティ

コンポーネントの「スタイル」の設定は、コンポーネントの親コンテナ、ページ、アプリケーションなどの上位階層コンポーネントのスタイル設定をオーバーライドします。「コンテンツ・スタイル」設定は、「スタイル」設定をオーバーライドします。たとえば、移動可能ボックス・コンポーネントでは、「スタイル」設定によって移動可能ボックスのルック・アンド・フィールが制御され、「コンテンツ・スタイル」設定によって移動可能ボックス内に含まれるコンポーネントのルック・アンド・フィールが制御されます。このルック・アンド・フィールは、個々のコンポーネントに設定されているスタイル設定によってオーバーライドされる場合もあります。

ただし、コンテナ内のコンポーネントがそのコンポーネント独自のコンテンツ・スタイル・プロパティ以外の手段でコンテナのコンテンツ・スタイル・プロパティをオーバーライドした場合は、移動可能ボックスなどのコンテナに設定されているコンテンツ・スタイル・プロパティが有効にならない場合があることに注意してください。たとえば、タスク・フローの背景色が設計時にコンテナから継承するように設定されずに、ハードコードされた値で設定された場合には、タスク・フローを含む移動可能ボックスに設定されている背景色が有効にならない可能性があります。

また、「スタイル」設定および「コンテンツ・スタイル」設定は、コンポーネントの要素(スキンなど)がこれらの設定の変更をサポートするかどうかによって、公開される場合と公開されない場合があります。

このため、表14-2に示しているように、コンポーネントにスタイル・プロパティおよびコンテンツ・スタイル・プロパティを設定できますが、そのコンポーネントに適用される他の設定によっては、これらの設定が適用されない場合があります。

表14-2 「スタイル」のプロパティおよび「コンテンツ・スタイル」のプロパティ(他の設定によってオーバーライドされる場合あり)

プロパティ	説明
Background Color	コンポーネントの背景色を選択します。 「コンテンツ・スタイル」の背景色を指定した場合は、「スタイル」プロパティに指定した背景色は適用されません。
Background Image	コンポーネントの背景にレンダリングするイメージのURLを入力します。標準のCSS構文を使用します。例: url(http://www.abc.com/image.jpg)
Color	コンポーネント・インスタンスに含まれる任意のテキストのデフォルトの色を選択します。たとえば、テキスト・コンポーネントをボックス・コンポーネントに追加したとします。ボックスの「スタイル」プロパティを設定すると、テキスト・コンポーネントの「色」の値を定義しないかぎり、ボックスに適用するデフォルトのテキストの色もテキスト・コンポーネントに自動的に適用されます。 次のいずれかの手法を使用して色を選択します。 色をクリックして選択します。 色のRGBに相当する値を「色」フィールドに入力します。RGB値は、RRGGBB、#RRGGBBまたはr,g,bの形式で入力します。 カスタム色を作成するには、ピッカーで「カスタム色」をクリックし、提供されているセレクタおよびスライダを使用して色および彩度のレベルを選択します。
Font	コンポーネント・ヘッダーに表示されるテキストに使用するフォントを指定します。 1つまたは複数のフォントを入力します。arial,helvetica,sans serifなど、複数の値をカンマ(,)で区切ります。'Times New Roman'など、空白を含むフォント名は一重引用符で囲みます。ブラウザでは、最初の値の使用を試み、ローカル・システムで使用可能なフォントに応じて、順に他の値を使用します。
Font Size	ブラウザのデフォルトのフォント・サイズまたは親要素のフォント・サイズのいずれかに相対するコンポーネント・テキストのサイズを入力します。次のいずれかのタイプの値を入力します。 length: フォント・サイズを固定サイズに設定します。たとえば、14px、1.5emなどと入力します。 xx-small、x-smallまたはsmall medium: デフォルトです large、x-largeまたはxx-large smaller: フォント・サイズを親要素より小さなサイズに設定します。 larger: フォント・サイズを親要素より大きなサイズに設定します。 %: 現在のフォント・サイズを親要素のフォント・サイズの指定の割合に設定します。たとえば、75%と入力します。
Font Style	コンポーネント・フォントのスタイルを選択します。次から選択します: 太字 イタリック 下線 取消線 ここで選択するフォント・スタイルは、コンポーネント内の任意のテキストに適用されます。
Height	コンポーネント・コンテンツの高さを指定します。 コンポーネント・コンテンツの固定の高さを設定します。任意の標準的なCSS測定単位(pt、px、pc、liなど)を使用できます。 Heightの値を割合で表示しないでください。ブラウザ間およびレイアウト・コンテナ間で違いがあるため、割合が予測したとおりに機能しません。コンポーネントでページの100%を占有する必要がある場合は、ストレッチ・ページ・スタイルを使用してページを作成し、コンポーネントをそのページに追加することを検討してください(詳細は、第25.1項「ページ・スタイルについて」を参照してください)。 Heightプロパティでは、「表示オプション」タブで使用可能なStretch Contentプロパティと連携します。Stretch Contentにより、コンテナではそのコンテンツを指定した高さにストレッチできます。
Margin	コンポーネントの周囲に引く空白の境界を指定します。次のいずれかのタイプの値を入力します。 絶対値。任意の単位を含めます。 例: 2px 標準のCSSでサポートされる測定単位(pt、px、pc、liなど)のみを使用してください。 親コンポーネントの余白の割合(10%のように、値にパーセント記号を付けます)。 auto: ブラウザのデフォルト値に応じて自動的に値が設定されます。
Other CSS	コンポーネントの追加のCSSを指定します。 他の「スタイル」プロパティまたは「コンテンツ・スタイル」プロパティで扱われない必要なその他のCSSエンコーディングを追加します。この値を有効にするには、標準のCSS構文を使用する必要があります(Other CSSの詳細は、「Other CSSプロパティの使用」を参照してください)。 たとえば、padding:0を設定すると、ボックス・コンポーネントのすべてのパディングが削除されます。これは、ボックス内にボックスをネストするときに役に立ちます。 ここの説明とStyle Classの説明を比較してください。
Style Class	CSSスタイル・クラスをこのコンポーネントに使用するように指定します。たとえば、このプロパティを使用して、個々のボックス・コンポーネントの特定のスキン設定をターゲット指定できます。 スタイル・クラスは、jspxまたはスキニングCSSファイルで定義されます。 注意: スタイル・クラスは、スタイルをまとめたセットで、名前が指定されています。これに対し、Other CSSに入力された値は個別のスタイルです。Style Classの値は、コンポーネントのstyleClass属性に追加されます。Other CSSの値は、コンポーネントのinlineStyle属性に追加されます。 このプロパティは、「スタイル」タブにのみ表示されます。
Width	コンポーネント・コンテンツの幅を指定します。 コンポーネント・コンテンツの固定の幅を設定します。任意の標準的なCSS測定単位(pt、px、pc、li、%など)を使用できます。

14.3.6.2 Other CSSプロパティの使用

「スタイル」タブおよび「コンテンツ・スタイル」タブの「その他のCSS」フィールドでは、他のプロパティで指定されないCSSスタイルを適用できます。標準のCSS構文を使用します(http://www.w3.org/TR/CSS2/propidx.htmlを参照してください)。複数のエントリは、セミコロン(;)で区切ります。コンポーネントで使用するCSSスタイル・クラスを指定するには、Style Classプロパティを使用します(表14-2を参照してください)。

例:

background: #00FF00 url(http://www.google.com/intl/en_ALL/images/logo.gif) no-repeat fixed top; font-size: xx-small

注意: 一部のCSSスタイルは、一般的なブラウザでサポートされていません。さらに、一部のスタイルは、1つのブラウザに固有であり、別のブラウザでは適切に動作しない可能性があります。

表14-3には、「その他のCSS」フィールドで使用可能なCSSの例がいくつか示されています。

表14-3 「その他のCSS」の値の例(他の設定によってオーバーライドされる場合あり)

値	説明および例
font-size	ブラウザのデフォルトのフォント・サイズまたは親要素のフォント・サイズのいずれかに相対するコンポーネント・テキストのサイズ。 構文: font-size:value ここで、valueは次のいずれかです。 length: 固定フォント・サイズ。例: font-size: 14px。 xx-small x-small small medium—default. large x-large xx-large smaller: 親要素より小さいサイズのフォント。 larger: 親要素より大きいサイズのフォント。 x%: 親要素のフォント・サイズに対する割合。例: font-size: 75%。
background-position	背景イメージの開始位置。 構文: background-position:value1 value2
	通常、2つの値を入力します。特に記述がなければ、1つの値のみを指定すると、2番目の値はcenterと解釈されます。 value1 value2は、次のいずれかの組合せの水平位置と垂直位置を表します。 top left top center top right center left center center center right bottom left bottom center bottom right x% y%: 割合で表した水平位置(x)および垂直位置(y)。左上隅は0% 0%です。右下隅は100% 100%です。1つの値のみを指定すると、もう1つの値は50%と解釈されます。割合(%)と位置は混在させることもできます。 x y: 測定単位で表した水平位置(x)および垂直位置(y)。左上隅は0 0です。単位としてピクセル(0px 0px)またはその他のCSS単位を使用できます。1つの値のみを指定すると、もう1つの値は50%と解釈されます。割合(%)と位置は混在させることもできます。 例: background-position: top left
background-repeat	背景イメージの繰返し値。 構文: background-repeat:value ここで、valueは次のいずれかです。 no-repeat: イメージを繰り返しません。 repeat: コンテナを埋めるようにイメージを繰り返します。 repeat-x: イメージを垂直方向ではなく水平方向に繰り返します。 repeat-y: イメージを水平方向ではなく垂直方向に繰り返します。
padding	コンポーネントの周りの空白(または空きスペース)。 最大で4つの値を入力できます。任意の標準のCSS測定単位(pt、px、pc、li、%など)を使用して、特定の長さまたは最も近い要素の割合で値を表します。 4つのすべてのサイドのパディングを1つの値で設定します。たとえば、padding: 10pxとします。 上/下および左/右のパディングを2つの値で設定します。たとえば、padding: 10px 15pxとします。 上、左/右および下のパディングを3つの値で設定します。たとえば、padding: 10px 5% 10pxとします。 上、右、下、左の順にパディングを4つの値で設定します。たとえば、padding: 5px 10px 15px 20pxとします。
padding-bottom	要素の下の空白(または空きスペース)。 特定の長さまたは最も近い要素の割合で値を表します。 たとえば、padding-bottom: 10pxとします。
padding-left	要素の左側の空白(または空きスペース)。 特定の長さまたは最も近い要素の割合で値を表します。 たとえば、padding-left: 2%とします。
padding-right	要素の右側の空白(または空きスペース)。 特定の長さまたは最も近い要素の割合で値を表します。 たとえば、padding-right: 1pcとします。
padding-top	要素の上の空白(または空きスペース)。 特定の長さまたは最も近い要素の割合で値を表します。 たとえば、padding-top: 16ptとします。

14.3.6.3 Other CSSプロパティの例

Other CSSプロパティの適用の一例として、タスク・フロー、ポートレットおよび一部のWeb開発コンポーネントへの様々な枠線の提供があります。

たとえば、図14-20には、枠線のない「最近のアクティビティ」タスク・フローが示されています。

図14-20 枠線のないタスク・フロー

「図14-20 枠線のないタスク・フロー」の説明

タスク・フローの周りに枠線を作成するには、図14-21に示しているように、そのタスク・フローのプロパティにアクセスして(第14.3.2項「コンポーネントのプロパティの設定」を参照)、「コンポーネント・プロパティ」ダイアログの「スタイル」タブの「その他のCSS」フィールドでCSSエンコーディングを追加します。

図14-21 コンポーネントへのCSSエンコーディングの追加

「図14-21 コンポーネントへのCSSエンコーディングの追加」の説明

図14-22はその結果を示しています。

図14-22 Other CSSプロパティで作成した枠線

「図14-22 Other CSSプロパティで作成した枠線」の説明

14.3.7 コンポーネントのコンテキスト・イベントの使用

イベントは、現在のコンテキスト内で定義された発生事項です。イベント・ハンドラは、その発生の結果としての処理を実行するエンジンです。

たとえば、2つのコンポーネントがあり、1つがなんらかのコンテンツのプロデューサ(ペイロード)で、もう1つがそのコンテンツを使用するコンポーネントであるとします。これらのコンポーネントを相互に結び付けた場合は、イベントの使用により、プロデューサでイベントがトリガーされたら、プロデューサがpayLoadパラメータを持つコンテキスト・イベントをブロードキャストし、これをコンシューマ・コンポーネントがイベント・ハンドラを介して使用するように指定できます。

「コンポーネント・プロパティ」ダイアログの「イベント」タブでは、コンテキスト・イベントをアクション・ハンドラに結び付けて、プロデューサでのイベントのトリガー時に、プロデューサ・コンポーネントからコンシューマ・コンポーネントに値を受け渡すことができます(図14-23)。

図14-23 「コンポーネント・プロパティ」ダイアログの「イベント」タブ

「図14-23「コンポーネント・プロパティ」ダイアログの「イベント」タブ」の説明

関連項目: 第14.3.2項「コンポーネントのプロパティの設定」

注意: コンテキスト・イベントは、ADFビジネス・コンポーネントで生成可能なビジネス・イベントとは異なります。また、コンテキスト・イベントは、UIコンポーネントで生成されるイベントとも異なります。コンテキスト・イベントは、UIイベントとの関連付けに使用できます。この場合、UIイベントにより起動されるアクション・リスナーが、メソッド・アクション・バインディングを起動し、これによりイベントを生成できます。

関連項目: ビジネス・イベントの詳細は、『Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド』を参照してください。

すべてのコンポーネントでコンテキスト・イベントをサポートするわけではありません。これは、すべてのコンポーネントがこれらを組み込むように作成されたわけではないためです。したがって、「イベント」タブは、コンポーネントによって表示されない場合があります。実行時に使用可能なイベントでは、コンポーネントの開発時にイベント機能をコンポーネントに組み込む必要があります。

表14-4は、「イベント」タブに表示されるプロパティをリストし、それらについて説明しています。

表14-4 「イベント」タブのプロパティ

プロパティ	説明
Events	現在のページ上のコンポーネントに関連付けられているすべてのコンテキスト・イベントのリスト。イベントには、値の受渡しなど、別のアクションをトリガーするアクションのタイプが記述されています。リストされるイベントは、コンポーネントの作成時にコンポーネントに組み込まれたものです。すべてのコンポーネントがイベントを組み込むわけではないため、コンポーネントによっては、初めから他のコンポーネントに結び付けられないものも存在します。
Actions	選択したコンシューマ・コンポーネントに関連付けられたアクション・ハンドラのリスト リストされるアクションは、選択されたコンシューマ・コンポーネントによって異なります。アクションにより、イベントをイベント・ハンドラに関連付けることで、イベント発生のトリガー時のアクションを指定できます。リストされるアクションは、コンポーネントの作成時にコンポーネントに組み込まれたものです。
Enable Action	選択したイベントおよびアクションを有効または無効にするチェック・ボックス。 このチェック・ボックスを選択すると、選択したアクション・ハンドラのパラメータのリストが表示されます。
選択されたアクション・ハンドラ・パラメータのリスト	イベントが発生するたびにプロデューサ・コンポーネントからコンシューマ・コンポーネントにペイロードを配信するために使用する値を入力するフィールド パラメータ・フィールドは、Enable Actionチェック・ボックスを選択した場合にのみ表示されます。

コンポーネントの結付けの詳細は、第19章「ページ、タスク・フロー、ポートレットおよびADFコンポーネントの結付け」を参照してください。

14.4 ページからのコンポーネントの削除

コンポーネントを削除するコントロールは、「デザイン」ビュー内のコンポーネントそのもの、および「構造」ビュー内の階層リスト・ペインのヘッダーに配置されています。この項では、「デザイン」ビューおよび「構造」ビューでのコンポーネントの削除方法について説明します(「選択」ビューでコンポーネントを削除することはできません)。

• 第14.4.1項「「デザイン」ビューでのコンポーネントの削除」

• 第14.4.2項「「構造」ビューでのコンポーネントの削除」

14.4.1 「デザイン」ビューでのコンポーネントの削除

「デザイン」ビューのページからコンポーネントを削除する手順は次のとおりです。

1. 編集モードでページを開きます(第12.4.3項「ページ・エディタ(コンポーザ)でのページのオープン」を参照してください)。

   
   

   注意: デフォルトで、ビュー・スイッチャはに設定され、コンポーザの「デザイン」ビューには、インライン・リソース・カタログを示したページが表示されます。

   
   

2. コンポーネント・ヘッダーか、またはヘッダーが非表示の場合はコンポーネントのフローティング・パレットで「削除」アイコンをクリックします(図14-24)。

   図14-24 「リンク」コンポーネントの「削除」アイコン

   
   「図14-24 「リンク」コンポーネントの「削除」アイコン」の説明
   
   

3. 表示される確認ダイアログで、「削除」をクリックします。

   ページからコンポーネントが完全に削除されます。コンポーネントに子コンポーネントが含まれていた場合は、その子コンポーネントも削除されます。

4. 「保存」をクリックして変更を保存します。

14.4.2 「構造」ビューでのコンポーネントの削除

「構造」ビューのページからコンポーネントを削除する手順は次のとおりです。

1. 編集モードでページを開きます(第12.4.3項「ページ・エディタ(コンポーザ)でのページのオープン」を参照してください)。

2. ビュー・スイッチャをクリックしてに設定し、「構造」タブをクリックして、「構造」ビューにページを表示します。

3. コンポーネントのリストで、削除するコンポーネントを選択します。

4. リスト・ヘッダーで「削除」アイコンをクリックします(図14-25)。

   図14-25 「構造」ビューの「削除」アイコン

   
   「図14-25 「構造」ビューの「削除」アイコン」の説明
   
   

5. 表示される確認ダイアログで、「削除」をクリックします。

   ページからコンポーネントが完全に削除されます。コンポーネントに子コンポーネントが含まれていた場合は、その子コンポーネントも削除されます。

6. 「保存」をクリックして変更を保存します。