| Oracle® Fusion Middleware Oracle Application Development Frameworkスキン・エディタ・ユーザーズ・ガイド 11gリリース2(11.1.2.3.0) B66161-03 |
|
 前 |
 次 |
| Oracle® Fusion Middleware Oracle Application Development Frameworkスキン・エディタ・ユーザーズ・ガイド 11gリリース2(11.1.2.3.0) B66161-03 |
|
前 |
次 |
この章では、ADFスキンが完成した後に行う必要のあるタスクの実行方法について説明します。ADFスキンのテスト方法、完成したADFスキンをADFライブラリJARにパッケージ化する方法、完成したADFスキンが使用されるようにADFアプリケーションを構成する方法についての情報を示します。
この章には、次の項があります。
1つ以上のADFスキン・セレクタのスタイルのプロパティを定義するADFスキンを作成した後、ADFスキンに加えた変更をテストできます。ADFスキンの変更のテストを完了し、完成したADFスキンに問題がない場合は、ADFスキンと関連ファイル(イメージ、リソース・バンドルおよび構成ファイル)をADFライブラリJARにパッケージ化して、完成したADFスキンを使用するアプリケーション・プロジェクトに含めるために配布できます。完成したADFスキンの配布が完了したら、そのADFスキンを適用するアプリケーションを構成します。
ADFスキンを作成し、1つ以上のセレクタに使用するスタイルのプロパティを定義したら、これらのスタイルのプロパティが実行時にブラウザでどのようにレンダリングされるかをテストできます。このことを行うには、ADFスキンをアプリケーションに適用し、セレクタを公開したADF Facesコンポーネントをレンダリングするページを実行します。
アプリケーションを実行するとき、Mozilla FirefoxブラウザのFirebugなどのツール(または使用している特定のブラウザ用の類似のツール)を使用することを検討してください。これらのツールでは、ADFスキンを繰り返し開発する場合に役立つ有用な情報を提供します。たとえば、これらのツールを使用して、すでに行った変更をインスペクトすることに加え、特定のDOM要素に対応するADFスキン・セレクタを判別できます。
アプリケーションで次のことができるように、web.xmlファイルのコンテキスト初期化パラメータを構成することもできます。
アプリケーションを再起動しなくても、ADFスキンの変更を表示します。
次のコンテキスト初期化パラメータの値をtrueに設定します。
org.apache.myfaces.trinidad.CHECK_FILE_MODIFICATION
非圧縮のCSSスタイル・クラスの完全な名前を実行時に表示します。
次のコンテキスト初期化パラメータの値をtrueに設定します。
org.apache.myfaces.trinidad.DISABLE_CONTENT_COMPRESSION
CHECK_FILE_MODIFICATIONをtrueに設定した場合に、Fusion WebアプリケーションのADFスキンに加えたすべての変更がすぐに表示されるわけではないことに注意してください。アイコンとADFスキンのプロパティに加えた変更を表示するには、Fusion Webアプリケーションを再起動する必要があります。
コンテキスト初期化パラメータの詳細は、『Oracle Fusion Middleware Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド』(スキニングするアプリケーションに関連するリリース)のADF Facesの構成に関する付録を参照してください。
図10-1に、ADFスキンで定義され、ADF Faces commandLinkコンポーネントのstyleClass属性を使用してこのコンポーネントに適用されたスタイル・クラスの名前(fndGlobalSearchCategory)が、ブラウザでレンダリングされるときにどのように圧縮されるかを示します。
図10-2に、DISABLE_CONTENT_COMPRESSIONパラメータをtrueに設定した場合に、スタイル・クラスの非圧縮の完全名とADF Facesコンポーネントがブラウザでどのようにレンダリングされるかを示します。図10-2の非圧縮のスタイル・クラスaf_commandLinkは、Oracle Fusion Middleware Oracle ADF Facesスキン・セレクタ・タグ・リファレンス(スキニングするアプリケーションに関連するリリース)に記載されているaf|commandLinkセレクタに該当します。
ADFスキン・セレクタが公開する擬似要素に対応する非圧縮のスタイル・クラスも指定できます。たとえば、af|panelTabbedセレクタにより公開されるtab-end擬似要素(af|panelTabbed::tab-end)は、実行時に非圧縮のaf_panelTabbed_tab-endスタイル・クラスに変換されます。
同様に、コンポーネントが特定の状態にあるときに、そのコンポーネントの外観に加えた変更を、ブラウザ・ツールを使用して識別またはインスペクトすることもできます。たとえば、ADFスキンのソース・ファイルにある次のエントリを使用すると、ADF Faces panelTabbedコンポーネントの右側を選択して、このコンポーネントのスタイルを定義できます。
af|panelTabbed::tab:selected af|panelTabbed::tab-end
実行時には、非圧縮のスタイル・クラス名は次のように変換されます。
.af_panelTabbed_tab.p_AFSelected .af_panelTabbed_tab-end
:selectedはp_AFSelectedに変換されますが、生成されるCSSにはp_AFSelectedに相当するものが含まれていない場合があることに注意してください。これは、:hoverのような他の擬似クラスの場合と同様、ブラウザによっては、その特定の状態に対する組込みサポートが備えられているためです。
Oracle Fusion Middleware Oracle ADF Facesデータ視覚化ツール・タグ・リファレンスおよびOracle Fusion Middleware Oracle ADF Facesスキン・セレクタ・タグ・リファレンス(スキニングするアプリケーションに関連するリリース)に記載されているADFスキン・セレクタ、擬似要素と擬似クラスのみをカスタマイズすることをお薦めします。その他のADFスキン・セレクタをカスタマイズすると、アプリケーションで予期しない動作や一貫性のない動作が発生する場合があります。
アプリケーションのweb.xmlファイルで、CHECK_FILE_MODIFICATIONとDISABLE_CONTENT_COMPRESSIONコンテキスト初期化パラメータをtrueに設定します。
ADFスキンのテストのためにパラメータを設定するには、次のようにします。
アプリケーション・ナビゲータで、「web.xml」をダブルクリックし、ファイルを開きます。
次のコンテキスト初期化パラメータ・エントリを追加し、trueに設定します。
org.apache.myfaces.trinidad.CHECK_FILE_MODIFICATION
org.apache.myfaces.trinidad.DISABLE_CONTENT_COMPRESSION
変更を保存して、web.xmlファイルを閉じます。
例10-1に示すように、アプリケーションのweb.xmlファイルにエントリが表示されます。
例10-1 web.xmlのエントリ
<context-param> <param-name>org.apache.myfaces.trinidad.CHECK_FILE_MODIFICATION</param-name> <param-value>true</param-value> </context-param> <context-param> <param-name>org.apache.myfaces.trinidad.DISABLE_CONTENT_COMPRESSION</param-name> <param-value>true</param-value> </context-param>
ADF Facesコンポーネントのセレクタに加えた変更(アイコンとスキンのプロパティへの変更を除く)は、ADF FacesコンポーネントをレンダリングするFusion Webアプリケーションのページをリフレッシュするとすぐにレンダリングされます。Firebug (ブラウザがMozilla Firefoxの場合)またはGoogle Chromeのデベロッパ・ツールを使用して、実行時にレンダリングされる非圧縮のスタイル・クラス名を表示し、対応するADFスキン・セレクタを確立できます。org.apache.myfaces.trinidad.DISABLE_CONTENT_COMPRESSIONをtrueに設定すると、Fusion Webアプリケーションでパフォーマンス上のコストが発生するため、変更のテストが完了した後は、falseに設定してください。
ADFスキンと関連ファイル(たとえば、イメージ・ファイル、構成ファイルおよびリソース・バンドル)をADFライブラリJARにデプロイできます。これにより、アプリケーションにADFスキンを適用するために必要なファイルをパッケージ化できます。次に、アプリケーションにバンドルする場合と比較して、ADFスキンをADFライブラリJARにパッケージ化することの利点を示します。
アプリケーションとは別に、ADFスキンをデプロイおよび開発できます。これにより、ADFスキンへの変更の適用が必要な場合に、確認するファイル数を減らすこともできます。
ADFスキンとイメージのソース・ファイルは、それぞれのADFライブラリJARに分けることができます。このため、すべてのアプリケーションにすべてのファイルをデプロイする必要がないように、イメージ・ベースを個別のADFライブラリJARに分けることができます。
ADFスキンをADFライブラリJARにパッケージ化するためのADFライブラリJARファイルのデプロイメント・プロファイルを作成します。
ADFライブラリJARファイルのデプロイメント・プロファイルを作成するには、次のようにします。
アプリケーション・ナビゲータで、ADFスキンが含まれるプロジェクトを右クリックし、「デプロイ」→「新規デプロイメント・プロファイル」を選択します。
「デプロイメント・プロファイルの作成」ダイアログで、「プロファイル・タイプ」ドロップダウン・リストから「ADFライブラリのJARファイル」を選択します。
「デプロイメント・プロファイル名」入力フィールドにデプロイメント・プロファイルの名前を入力し、「OK」をクリックします。
表示される「ADFライブラリJARデプロイメント・プロファイルのプロパティの編集」ダイアログのオプションを確認します。詳細は、「ヘルプ」をクリックしていつでも確認できます。
「OK」をクリックします。
ADFスキンをADFライブラリJARにパッケージ化するには、次のようにします。
アプリケーション・ナビゲータで、ADFスキンが含まれるプロジェクトを右クリックし、「デプロイ」→deploymentを選択します。deploymentは、ADFライブラリJARファイルのデプロイメント・プロファイルの名前です。
「デプロイ」ダイアログの「デプロイメント・アクション」ページで、「次」をクリックしてから、「終了」をクリックします。
ADFライブラリJARファイルは、デプロイメント・プロファイルによって指定されたディレクトリに書き込まれます。このADFライブラリJARには、ADFスキンのソース・ファイル、trinidad-skins.xmlファイル、イメージ・ファイルおよびリソース文字列を定義するため、またはADF Facesコンポーネントに定義されているデフォルト文字列をオーバーライドするために作成したすべてのリソース・バンドルが含まれます。ADFライブラリJARファイルには、スキニングに関係のないADFスキンのプロジェクトの他のファイルも含まれます。
例10-2に、ADFスキンの次のアイテムを含むプロジェクトのディレクトリ構造を示します。
trinidad-skins.xmlファイル
ADFスキン・プロジェクトにコピーされるイメージ・ファイル(sort_des_ena.png)
ADFスキンのソース・ファイル(skin1.css)
ADFライブラリJARをプロジェクトにインポートするときにそのコンテンツをインスペクトするために使用する.svaファイル(oracle.adf.common.services.ResourceService.sva)。詳細は、第4.7項「ADFライブラリJARからのADFスキンのインポート」を参照してください。
デフォルトのリソース・バンドルの文字列をオーバーライドする文字列値を含むリソース・バンドル(skinBundle.properties)
定義する文字列値を含むリソース・バンドルを指定する方法の詳細は、第7.2.1項「ADFスキンに追加のリソース・バンドルを指定する方法」を参照してください。
例10-2 ADFスキンを含むADFライブラリJARのディレクトリ構造
ADFLibraryJARRootDirectory
+---META-INF
| | MANIFEST.MF
| | oracle.adf.common.services.ResourceService.sva
| | trinidad-skins.xml
| |
| +---adf
| | \---skins
| | \---skin1
| | \---images
| | \---af_column
| | sort_des_selected.png
| |
| \---skins
| \---skin1
| skin1.css
|
+---resources
| skinBundle.properties
|
\---WEB-INF
faces-config.xml
ADFライブラリJARに表示されるADFスキン内のイメージのディレクトリ・パスが、ADFスキン・プロジェクトのディレクトリ・パスを含めるように変更されます。例10-3に、行われる変更の例を示します。
例10-3 デプロイされたADFスキン内のイメージの変更されたディレクトリ・パス
// Reference to an image in an ADF skin prior to deployment to an ADF Library JAR
af|column::sorted-descending-icon-style
{
background-image: url("images/af_column/sort_des_selected.png");
}
// Reference to an image in an ADF skin after deployment to an ADF Library JAR
af|column::sorted-descending-icon-style
{
background-image: url("/adf/skins/skin1/images/af_column/sort_des_selected.png");
}
アプリケーションのtrinidad-config.xmlファイルで値を指定して、ADFスキンを使用するようにアプリケーションを構成します。実行時にアプリケーションが使用するADFスキン・ファミリを識別する<skin-family>要素の値を指定します。スキン・ファミリで複数のADFスキンを作成した場合は、これらのADFスキンを第4.5項「ADFスキンのバージョニング」で説明しているようにバージョニングできます。同じスキン・ファミリ内で複数のADFスキンをバージョニングした場合は、<skin-version>要素を使用してアプリケーションが使用する特定のバージョンを識別できます。
エンド・ユーザーがアプリケーションで使用するADFスキンを動的に選択できるように、アプリケーション・ページを構成することもできます。詳細は、『Oracle Fusion Middleware Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド』(スキニングするアプリケーションに関連するリリース)を参照してください。
アプリケーションのtrinidad-config.xmlファイルを変更して、アプリケーションにADFスキンを適用します。このことを行うには、アプリケーションのtrinidad-config.xmlファイルを編集して、使用するADFスキン・ファミリを指定します。または、JDeveloperの「プロジェクト・プロパティ」ダイアログの「ADFビュー」オプションのリストから、ADFスキン・ファミリを選択することもできます。
アプリケーションにADFスキンを適用するには、次のようにします。
アプリケーション・ナビゲータで、trinidad-config.xmlファイルをダブルクリックして、このファイルをソース・エディタで開きます。デフォルトでは、このファイルはWeb Content/WEB-INFノードにあります。
例10-4に示されているように、trinidad-config.xmlファイルに、<skin-family>要素の値とオプションで<skin-version>要素の値を指定するためのエントリを書き込みます。
例10-4に示されているように、trinidad-config.xmlファイルで、<skin-family>要素とオプションで<skin-version>要素に指定する値は、Fusion Webアプリケーションが実行時に使用するADFスキンを決定します。
