この章の内容は次のとおりです。
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
に設定した場合に、WebアプリケーションのADFスキンに加えたすべての変更がすぐに表示されるわけではないことに注意してください。アイコンとADFスキンのプロパティに加えた変更を表示するには、Webアプリケーションを再起動する必要があります。
コンテキスト初期化パラメータの詳細は、『Oracle ADF FacesによるWebユーザー・インタフェースの開発』の「ADF Facesの構成」を参照してください。
図12-1に、(「ADF Faces」button
コンポーネント用の)コンポーネント・セレクタの名前が抑制される仕組みを示します。図12-1では、ADFスキンで定義されたスタイル・クラス(fndGlobalSearchCategory
)が、button
コンポーネントのstyleClass
属性を使用してこのコンポーネントに適用されています。
図12-1 ADFスキンの圧縮されたCSS
図12-2に、DISABLE_CONTENT_COMPRESSION
パラメータをtrue
に設定した場合に、ADF Facesコンポーネントの非圧縮の完全名がブラウザでどのようにレンダリングされるかを示します。図12-2の非圧縮のスタイル・クラスaf_button
は、Oracle ADF Facesスキン・セレクタ・タグ・リファレンスに記載されているaf|button
セレクタに該当します。
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 ADF Facesスキン・セレクタ・タグ・リファレンスおよびOracle ADFデータ視覚化ツール・スキン・セレクタ・タグ・リファレンスに記載されているADFスキン・セレクタ、擬似要素と擬似クラスのみをカスタマイズすることをお薦めします。その他のADFスキン・セレクタをカスタマイズすると、アプリケーションで予期しない動作や一貫性のない動作が発生する場合があります。
図12-2 ADFスキンの非圧縮のCSS
アプリケーションのweb.xml
ファイルで、CHECK_FILE_MODIFICATION
とDISABLE_CONTENT_COMPRESSION
コンテキスト初期化パラメータをtrue
に設定します。
ADFスキンのテストのためにパラメータを設定するには、次のようにします。
次の例に示すように、アプリケーションの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コンポーネントをレンダリングするWebアプリケーションのページをリフレッシュするとすぐにレンダリングされます。Firebug (ブラウザがMozilla Firefoxの場合)またはGoogle Chromeのデベロッパ・ツールを使用して、実行時にレンダリングされる非圧縮のスタイル・クラス名を表示し、対応するADFスキン・セレクタを確立できます。org.apache.myfaces.trinidad.DISABLE_CONTENT_COMPRESSION
をtrue
に設定すると、Webアプリケーションでパフォーマンス上のコストが発生するため、変更のテストが完了した後は、false
に設定してください。
ADFスキンと関連ファイル(たとえば、イメージ・ファイル、構成ファイルおよびリソース・バンドル)をADFライブラリJARにデプロイできます。これにより、アプリケーションにADFスキンを適用するために必要なファイルをパッケージ化できます。次に、アプリケーションにバンドルする場合と比較して、ADFスキンをADFライブラリJARにパッケージ化することの利点を示します。
アプリケーションとは別に、ADFスキンをデプロイおよび開発できます。これにより、ADFスキンへの変更の適用が必要な場合に、確認するファイル数を減らすこともできます。
ADFスキンとイメージのソース・ファイルは、それぞれのADFライブラリJARに分けることができます。このため、すべてのアプリケーションにすべてのファイルをデプロイする必要がないように、イメージ・ベースを個別のADFライブラリJARに分けることができます。
ADFライブラリJARのADFスキンは、「実行中のWebアプリケーションへのADFスキンの適用」で説明しているように、再起動を必要とせずに実行中のアプリケーションに適用できます。
ADFスキンをADFライブラリJARにパッケージ化するためのADFライブラリJARファイルのデプロイメント・プロファイルを作成します。
ADFライブラリJARファイルのデプロイメント・プロファイルを作成するには、次のようにします。
「アプリケーション」ウィンドウで、ADFスキンが含まれるプロジェクトを右クリックし、「デプロイ」→「新規デプロイメント・プロファイル」を選択します。
「デプロイメント・プロファイルの作成」ダイアログで、「プロファイル・タイプ」ドロップダウン・リストから「ADFライブラリのJARファイル」を選択します。
「デプロイメント・プロファイル名」入力フィールドにデプロイメント・プロファイルの名前を入力し、「OK」をクリックします。
表示される「ADFライブラリJARデプロイメント・プロファイルのプロパティの編集」ダイアログのオプションを確認します。詳細は、「ヘルプ」をクリックしていつでも確認できます。
「OK」をクリックします。
ADFスキンをADFライブラリJARにパッケージ化するには、次のようにします。
ADFライブラリJARファイルは、デプロイメント・プロファイルによって指定されたディレクトリに書き込まれます。このADFライブラリJARには、ADFスキンのソース・ファイル、trinidad-skins.xml
ファイル、イメージ・ファイルおよびリソース文字列を定義するため、またはADF Facesコンポーネントに定義されているデフォルト文字列をオーバーライドするために作成したすべてのリソース・バンドルが含まれます。ADFライブラリJARファイルには、スキニングに関係のないADFスキンのプロジェクトの他のファイルも含まれます。
例12-1に、ADFスキンの次のアイテムを含むプロジェクトのディレクトリ構造を示します。
trinidad-skins.xml
ファイル
JDeveloperプロジェクトにコピーされるイメージ・ファイル(sort_des_ena.png
)
ADFスキンのソース・ファイル(skin1.css
)
ADFライブラリJARをプロジェクトにインポートするときにそのコンテンツをインスペクトするために使用する.svaファイル(oracle.adf.common.services.ResourceService.sva
)。詳細は、「ADFライブラリJARからのADFスキンの追加」を参照してください。
デフォルトのリソース・バンドルの文字列をオーバーライドする文字列値を含むリソース・バンドル(skinBundle.properties
)
定義する文字列値を含むリソース・バンドルを指定する方法の詳細は、「ADFスキンに追加のリソース・バンドルを指定する方法」を参照してください。
ADFライブラリJARに表示されるADFスキン内のイメージのディレクトリ・パスが、JDeveloperプロジェクトのディレクトリ・パスを含めるように変更されます。例12-2に、行われる変更の例を示します。
例12-1 ADFスキンを含むADFライブラリJARのディレクトリ構造
ADFLibraryJARRootDirectory +---META-INF | | MANIFEST.MF | | oracle.adf.common.services.ResourceService.sva | | trinidad-skins.xml | | | +---adf | | \---skins | | \---skin1 | | \---images | | \---af_column | | colSort_des_ena.png | | | \---skins | \---skin1 | skin1.css | \---resources skinBundle.properties
例12-2 デプロイされた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/colSort_des_ena.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/colSort_des_ena.png"); }
アプリケーションのtrinidad-config.xml
ファイルで値を指定して、ADFスキンを使用するようにアプリケーションを構成します。実行時にアプリケーションが使用するADFスキン・ファミリを識別する<skin-family>
要素の値を指定します。ADFスキン・ファミリのスキンで複数のADFスキンを作成した場合、これらのスキンをバージョニングできます。同じADFスキン・ファミリ内の複数のADFスキンをバージョニングした場合は、trinidad-config.xml
ファイルの<skin-version>
要素を使用して、アプリケーションが使用する特定のバージョンを指定してください。
trinidad-config.xml
ファイル内の<skin-version>
要素に値を入力することによってあるいはtrinidad-skins.xml
ファイル内の<default>true</default>
要素を使用することによってADFスキン・ファミリの特定のADFスキンを指定しない場合、アプリケーションはtrinidad-skins.xml
内で定義される最後のスキンを使用します。ADFスキンのバージョニングおよびこれによりアプリケーションが選択するADFスキンを決定する方法の詳細は、「ADFスキンのバージョニング」を参照してください。
エンド・ユーザーがアプリケーションで使用するADFスキンを動的に選択できるように、アプリケーション・ページを構成できます。詳細は、『Oracle ADF FacesによるWebユーザー・インタフェースの開発』のエンド・ユーザーによるアプリケーションのADFスキンの変更の有効化に関する項を参照してください。
アプリケーションのtrinidad-config.xml
ファイルを変更して、アプリケーションにADFスキンを適用します。このことを行うには、アプリケーションのtrinidad-config.xml
ファイルを編集して、使用するADFスキン・ファミリを指定します。または、JDeveloperの「プロジェクト・プロパティ」ダイアログの「ADFビュー」オプションのリストから、ADFスキン・ファミリを選択することもできます。
アプリケーションにADFスキンを適用するには、次のようにします。
<skin-family>
要素の値を指定するためのエントリと、オプションで<skin-version>
要素の値を書き込みます。例12-3に示されているように、trinidad-config.xml
ファイルで、<skin-family>
要素とオプションで<skin-version>
要素に指定する値は、Webアプリケーションが実行時に使用するADFスキンを決定します。
例12-3 trinidad-config.xmlファイル
<?xml version="1.0" encoding="windows-1252"?> <trinidad-config xmlns="http://myfaces.apache.org/trinidad/config"> <skin-family>skyros</skin-family> <skin-version>v1</skin-version> </trinidad-config>
Java Management Extensions (JMX)を使用すると、アプリケーションを再起動することなく、ADFライブラリJARにパッケージ化されたADFスキンをWebアプリケーションに適用できます。これを実行するには、「更新済ADFスキンを受け入れるようにWebアプリケーションを構成する方法」で説明しているように、Webアプリケーションのソース・ファイルを構成する必要があります。次に、JDeveloperを使用してMBeanサーバーに接続し、ADFスキンを含むADFライブラリJARをデプロイします。詳細は、「ADFライブラリJARをMBeanサーバーにデプロイする方法」を参照してください。これにより、ADFライブラリJARに含まれるすべてのADFスキンがWebアプリケーションで利用できるようになります。
アプリケーションがWebアプリケーションを再起動せずにMBeanサーバーがデプロイした新しいADFスキンを適用できるように、JDeveloper内のWebアプリケーションのViewControllerプロジェクトに次の変更を行います。
アプリケーションのViewControllerプロジェクトの「ADFビュー」ページの「ランタイム・スキン更新の有効化」チェック・ボックスを選択します。
アプリケーションのクラスパスにADF Faces JMXランタイム11を追加します。
(オプション)アプリケーションのweb.xml
ファイルに、コンテキスト初期化パラメータを追加します。
コンテキスト初期化パラメータによって、アプリケーションのコンテキスト・ルートを使用せずWebアプリケーションを識別するための親しみやすい名前を指定できます。
注意:
Webアプリケーションは、統合WebLogic Serverでアプリケーションを実行する場合と同様に、展開フォーマットでデプロイする必要があります。
更新されたADFスキンを受け入れるようにWebアプリケーションを構成する手順は次のとおりです。
ADFスキンをパッケージ化するADFライブラリJARをMBeanサーバーにデプロイします。ADFスキンをADFライブラリJARにパッケージ化するためのADFライブラリJARファイルのデプロイメント・プロファイルを作成する方法の詳細は、「ADFスキンをADFライブラリJARにパッケージ化する方法」を参照してください。
ADFライブラリJARをMBean Serverにデプロイする手順は次のとおりです。
「アプリケーション」ウィンドウで、ADFスキンが含まれるプロジェクトを右クリックし、「デプロイ」→deploymentを選択します。deploymentは、ADFライブラリJARファイルのデプロイメント・プロファイルの名前です。
「デプロイメント・アクション」ページで、「ADFスキン・マネージドBeanへのデプロイ」を選択し、「次へ」をクリックします。
「スキン接続」ページで、適切なオプションを選択します。
「JMX接続の作成」ダイアログで、各フィールドにデータを入力してMBeanサーバーに接続します。
接続名: 接続の名前を入力します。名前は必ず有効なJava識別子とし、名前および接続はこのインストール全体で使用されるため、適切な一意の名前を選択してください。
サーバー・タイプ: ADFスキン・マネージドBeanにデプロイする接続用としてデフォルトのWeblogic Serverがあらかじめ選択状態になっています。
ユーザー名: MBeanサーバーへのアクセスを許可するユーザー名を入力します。
パスワード: 指定したユーザー名に関連付けるパスワードを入力します。このフィールドに入力する各文字はアスタリスク(*)として表示されます。
プロトコル: JDeveloperはt3
プロトコルを使用してMBeanサーバーと通信します。
ホスト名: MBeanサーバーを実行するマシンを識別する値を入力します。TCP/IPで解決できるIPアドレスまたはホスト名、たとえばMBeanサーバーがローカル・マシン上にある場合はlocalhost
または127.0.0.1
を使用します。
ポート: MBeanサーバーのリスニング・ポートを入力します。デフォルトは、統合Weblogic Serverのデフォルト・ポート番号となる任意の値(多くの場合7101
)です。
URLプロバイダのパス: MBeanサーバーの絶対JNDI名を入力します。これは/jndi/で始まり次のいずれかが続く必要があります。
weblogic.management.mbeanservers.domainruntime
weblogic.management.mbeanservers.runtime
weblogic.management.mbeanservers.edit
サーバー・インストールの場所: サーバー・インストールの場所が表示されます。
接続のテスト: クリックすると、接続がテストされます。
ステータス: 「成功」
メッセージは、JDeveloperがMBeanサーバーに接続できたことを示します。これ以外のメッセージは接続に失敗したことを示します。「接続のテスト」を試す前に少なくとも次の点をチェックする必要あります。
MBeanサーバーがローカルでない場合にネットワークが正しく動作しているか。
このダイアログで入力した各値。
「アプリケーション名」 フィールドで、ADFスキンを含むADFライブラリJARをデプロイする必要のあるWebアプリケーションの名前を選択します。「実行中のアプリケーションの検索」をクリックして、使用可能なアプリケーションのリストを検索し、そのアプリケーションが実行中であることを確認します。
「更新済ADFスキンを受け入れるようにWebアプリケーションを構成する方法」で説明しているように、アプリケーションの名前がoracle.adf.view.rich.SKINNING_MBEAN_NAME
パラメータ用に入力した値となるように指定していなければ、アプリケーションのルート・コンテキストの名前が表示されます。
「次へ」をクリックし、「終了」をクリックします。
JDeveloperは、ADFスキンを含むADFライブラリJARをWebアプリケーションにデプロイします。このADFライブラリJARには、ADFスキンおよび他の関連ファイル(ADFスキンが必要とするイメージなど)が含まれています。ADFライブラリJARのコンテンツの詳細は、「ADFスキンをADFライブラリJARにパッケージ化した場合の処理」を参照してください。ADFスキンはWebアプリケーションのルート・ディレクトリにインストールされます。Webアプリケーションのtrinidad-skins.xml
ファイルは、新しく追加されたADFスキンを参照するよう更新されます。
Webアプリケーションが、新しく追加されたADFスキンを使用するようにするには、trinidad-config.xml
ファイルの<skin-family
要素が参照する値を更新する必要があります。これは、「ADFスキンをアプリケーションに適用する方法」で説明しているように手動で行うか、プログラムでこの値を更新する要素を求めるEL式を指定することで可能です。この後者のオプションの詳細は、『Oracle ADF FacesによるWebユーザー・インタフェースの開発』の「スタイルおよびスキンを使用した外観のカスタマイズ」を参照してください。