プライマリ・コンテンツに移動
Oracle® Fusion Middleware Oracle ADF FacesによるWebユーザー・インタフェースの開発
12c (12.1.3)
E59439-02
  目次へ移動
目次

前
 
次
 

2 ADF Facesデモ・アプリケーション

この章では、この開発者ガイドとともに使用できるADF Facesデモ・アプリケーションについて説明します。

この章には、次のセクションがあります。

2.1 ADF Facesデモ・アプリケーションについて

ADF Facesには、コンポーネントとアーキテクチャ機能のサンプルを試したり、ソース・コードを表示できるデモ・アプリケーションが含まれています。

デモ・アプリケーションには、次のものが含まれています。

  • タグ・ガイド: ADF Facesコンポーネント、バリデータ、コンバータと多様なタグのデモ、および属性値の変更のコンポーネントへの影響を確認できるプロパティ・エディタ。図2-1に、selectManyCheckboxコンポーネントのデモを示します。各デモには、関連するタグ・ドキュメントへのリンクが用意されています。

    図2-1 タグのデモ

    この図は周囲のテキストで説明しています
  • 機能のデモ: ADFコンポーネントの様々な使用方法を示す各種ページ。たとえば、File Explorerは、ディレクトリ構造を表示し、ディレクトリとファイルの作成、保存、移動を行えるライブ・データ・モデルを使用したアプリケーションです。このアプリケーションは、図2-2に示すように、実際に動かすことのできるアプリケーションでADF Facesのコンポーネントと機能を紹介するためのものです。

    図2-2 File Explorerアプリケーション

    この図は周囲のテキストで説明しています

    その他のページは、レイアウト・コンポーネント、AJAXポストバック機能、ドラッグ・アンド・ドロップなどのADF Facesの主なアーキテクチャ上の機能を示します。図2-3に、AutoSubmit属性と部分ページ・レンダリングを使用するデモを示します。

    図2-3 フレームワークのデモ

    この図は周囲のテキストで説明しています
  • ビジュアル・デザイン: コンポーネント・タイプを様々に使用して異なるUIデザインを実現するデモ。図2-4に、ツールバーの異なる外観を得る様子を示します。

    図2-4 ツールバーのデザインのデモ

    この図は周囲のテキストで説明しています
  • Styles: インライン・スタイルとコンテンツ・スタイルの設定によってコンポーネントがいかに影響されるかのデモ。図2-5に、panelBoxコンポーネントに適用される異なるスタイルを示します。

    図2-5 スタイルのデモ

    この図は周囲のテキストで説明しています
  • 混同されやすいコンポーネント: 同様の機能を提供するコンポーネントの比較。図2-6に、選択リストを表示する各種コンポーネントの違いを示します。

    図2-6 混同されやすいコンポーネント

    この図は周囲のテキストで説明しています

File Explorerは完全に機能するアプリケーションのため、このガイドの多くの項で、重要な点を説明したり、コード・サンプルを示すためにこのアプリケーションが使用されます。File Explorerアプリケーションのソースは、fileExplorerディレクトリにあります。

File Explorerアプリケーションでは、fileExplorerTemplateページ・テンプレートが使用されます。このテンプレートには、アプリケーションの基本的なルック・アンド・フィールを提供する多くのレイアウト・コンポーネントが含まれます。レイアウト・コンポーネントの詳細は、第9章「Webページ上のコンテンツの編成」を参照してください。テンプレートの使用の詳細は、第10章「フラグメント、ページ・テンプレート、コンポーネントの作成および再利用」を参照してください。

アプリケーションの左側には、図2-7に示すディレクトリ構造と結果表付きの検索フィールドの2つの領域を持つpanelAccordionコンポーネントが含まれます。

図2-7 ディレクトリ構造パネルと検索パネル

この図は周囲のテキストで説明しています

両方の領域とも、展開および縮小できます。ディレクトリ構造は、treeコンポーネントを使用して作成されています。検索領域は、入力コンポーネント、ボタンおよびtableコンポーネントを使用して作成されています。panelAccordionコンポーネントの使用の詳細は、9.10項「パネルにおけるコンテンツの表示または非表示」を参照してください。入力コンポーネントの使用の詳細は、第11章「入力コンポーネントの使用およびフォームの定義」を参照してください。コマンド・ボタンの使用の詳細は、第20章「ナビゲーション・コンポーネントの使用」を参照してください。表とツリーの使用の詳細は、第12章「表、ツリー、およびその他のコレクションベースのコンポーネントの使用」を参照してください。

File Explorerアプリケーションの右側では、図2-8に示すようにタブ付きペインを使用して表、ツリー表またはリストのいずれかでディレクトリの内容を表示します。

図2-8 タブ付きパネルでのディレクトリの内容

この図は周囲のテキストで説明しています

表およびツリー表にはツールバーが組み込まれ、内容の表示方法を操作できます。表とリストでは、ファイルまたはサブディレクトリをディレクトリからドラッグし、別のディレクトリにドロップできます。すべてのタブで、ファイルを右クリックし、ポップアップ・メニューからファイルのプロパティをポップアップ・ウィンドウに表示できます。タブ付きのペインの使用の詳細は、9.10項「パネルにおけるコンテンツの表示または非表示」を参照してください。表およびツリー表のツールバーの詳細は、12.9項「表メニュー、ツールバーおよびステータス・バーの表示」を参照してください。ドラッグ・アンド・ドロップの有効化の詳細は、第35章「コンポーネントのドラッグ・アンド・ドロップ機能の追加」を参照してください。ポップアップ・メニューおよびポップアップ・ウィンドウの使用の詳細は、第16章「ポップアップ・ダイアログ、メニューおよびウィンドウの使用方法」を参照してください。

File Explorerアプリケーションの上部には、図2-9に示すメニューとツールバーが含まれます。

図2-9 メニューとツールバー

この図は周囲のテキストで説明しています

メニュー・オプションでは、ファイルやディレクトリの作成と削除、コンテンツの表示方法の変更を行えます。「ヘルプ」メニューでは、図2-10に示す、ユーザーがダイアログにフィードバックを入力できるヘルプ・システムが開きます。

図2-10 ヘルプ・システム

この図は周囲のテキストで説明しています

ヘルプ・システムは、リッチ・テキスト・エディタを含む様々な入力コンポーネントを使用して作成された多くのフォームで構成されています。メニューの詳細は、15.2項「メニュー・バーでのメニューの使用方法」を参照してください。ヘルプ・システムの作成の詳細は、19.5項「コンポーネントへのヘルプの表示」を参照してください。入力コンポーネントの詳細は、第11章「入力コンポーネントの使用およびフォームの定義」を参照してください。

File Explorerのツールバー内には、ディレクトリ構造内を移動できるコントロールと、スキンを変更してアプリケーションのルック・アンド・フィールを変更できるコントロールがあります。図2-11に、簡単なスキンを使用したFile Explorerアプリケーションを示します。

図2-11 簡単なスキンを使用したFile Explorerアプリケーション

この図は周囲のテキストで説明しています

ツールバーの詳細は、15.3項「ツールバーの使用方法」を参照してください。スキンの使用の詳細は、第31章「スタイルおよびスキンを使用した外観のカスタマイズ」を参照してください。

2.2 ADF Facesデモ・アプリケーションのダウンロードとインストール

デモ・アプリケーション(コードおよび実行)を表示するには、JDeveloperをインストールし、アプリケーションをダウンロードしてJDeveloper内で開きます。

ADF Facesデモ・アプリケーションは、Oracle Technology Network (OTN) Webサイトからダウンロードできます。
http://www.oracle.com/technetwork/developer-tools/adf/overview/index-092391.html">>http://www.oracle.com/technetwork/developer-tools/adf/overview/index-092391.html
に移動して、ページの「Downloads」セクションの「ADF Faces Rich Client Components Demo」リンクをクリックします。結果のページには、アプリケーションを含むWARファイルをダウンロードするための詳細な手順が、アプリケーションをスタンドアロン・サーバーにデプロイするため、またはJDeveloperに含まれる統合WebLogic Serverを使用してアプリケーションを実行するための手順とともに示されます。

アプリケーションをインストールしない場合には、「ADF Faces Rich Client Components Hosted Demo」リンクをクリックして、OTNから直接アプリケーションを実行できます。