| Oracle Fusion Middleware Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド 11gリリース1（11.1.1） B52029-02 |
|
 戻る |
 次へ |
| Oracle Fusion Middleware Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド 11gリリース1（11.1.1） B52029-02 |
|
戻る |
次へ |
この章では、ADF Faces calendarコンポーネントを使用して、Calendarアプリケーションを作成する方法について説明します。
この章に含まれる項は次のとおりです。
ADF Facesには、特定のプロバイダ（プロバイダとはアクティビティの所有者）用に作成されたアクティビティを日次表示、週表示、月表示またはリスト表示するCalendarコンポーネントが含まれています。図15-1に、いくつかのサンプル・アクティビティがある週表示モードのADF Faces Calendarを示します。
デフォルトでは、Calendarにはtrinidad-config.xmlファイルに設定されているロケールに基づく日付と時間が表示されます（A.6項「trinidad-config.xmlでの構成」を参照）。trinidad-config.xmlファイルにロケールが設定されていない場合、ブラウザから送信されたロケールに基づいて表示されます。たとえば、米国のデフォルトでは、週の開始日は月曜日であり、午後2時は2:00 PMと表示されます。フランスのデフォルトでは、開始日は月曜日であり、午後2時は14:00と表示されます。Calendarのタイムゾーンもtrinidad-config.xmlの設定に基づきます。このデフォルトは、Calendarの構成時にオーバーライドできます。詳細は、15.3項「Calendarコンポーネントの構成」を参照してください。
Calendarは、CalendarModelクラスを使用して、特定の期間のアクティビティを表示します。Calendarのモデル・クラスの独自の実装を作成する必要があります。アプリケーションでFusionテクノロジ・スタックを使用する場合は、アクティビティを表すデータソースに対するADF Business Componentsを作成でき、作成するとモデルが作成されます。その後、Calendarを宣言的に作成でき、そのCalendarは自動的にそのモデルにバインドされます。詳細は、『Oracle Fusion Middleware Oracle Application Development Framework Fusion開発者ガイド』のADF Faces Calendarコンポーネントの使用に関する項を参照してください。
アプリケーションでFusionテクノロジ・スタックを使用しない場合は、CalendarModelクラスと、関連するCalendarActivityクラスおよびCalendarProviderクラスの独自の実装を作成します。これらのクラスは、抽象メソッドを使用する抽象クラスです。Calendarの実装に適した、メソッドを支援する機能を提供する必要があります。詳細は、15.2項「Calendarの作成」を参照してください。
Calendarには、組込み機能を備えたツールバーがあります。このツールバーを使用して、日、週、月またはリスト間で表示を変更し、前日または翌日、週または月に移動し、本日に戻ることができます。ツールバーは完全にカスタマイズ可能です。表示するボタンやテキストを選択でき、ボタンや他のコンポーネントを追加することもできます。詳細は、15.6項「ツールバーのカスタマイズ」を参照してください。
|
ヒント: これらのツールバー・ボタンを使用すると、Calendarの属性値が変わります。それらの値がセッション中に変わらないよう、永続するように構成できます。詳細は、第31章「JSFページでのユーザー・カスタマイズの許可」を参照してください。値が永続され、ユーザーがシステムにログインするたびに使用されるように、アプリケーションを構成することもできます。この永続性が行われるためには、アプリケーションでフルFusionテクノロジ・スタックを使用する必要があります。詳細は、『Oracle Fusion Middleware Oracle Application Development Framework Fusion開発者ガイド』の「実行時のユーザー・カスタマイズの許可」の章を参照してください。 |
Calendarコンポーネントには、CalendarModelクラスから返されるアクティビティおよびプロバイダに基づくアクティビティが表示されます。デフォルトでは、Calendarコンポーネントは読取り専用です。つまり、Calendarコンポーネントは返されたアクティビティのみ表示できます。ユーザーがアクティビティを編集、作成および削除できるように、Calendarでサポートされているファセット内に機能を追加できます。特定のイベントが起動されると、それらの対応するファセット内にあるポップアップ・コンポーネントが開き、ユーザーがアクティビティまたはCalendarに対して操作を実行できるようになります。
たとえば、ユーザーがCalendar内のアクティビティをクリックすると、CalendarActivityEventが起動され、ActivityDetailファセットのポップアップ・コンポーネントが開きます。図15-2に示すように、ユーザーがアクティビティを表示および編集できるフォームを含んでいるダイアログ・コンポーネントを使用することもできます。
イベント、ファセットおよびポップアップ・コンポーネントを使用した追加機能の実装の詳細は、15.4項「ポップアップ・コンポーネントを使用した機能の追加」を参照してください。
Calendarコンポーネントでは、ADF Facesのドラッグ・アンド・ドロップ・アーキテクチャ機能がサポートされています。ユーザーは、アクティビティをCalendarの異なる領域にドラッグしてコピーまたは移動を行ったり、アクティビティのハンドルをドラッグしてアクティビティの期間を変更したりすることもできます。ドラッグ・アンド・ドロップ機能の追加の詳細は、15.5項「Calendarへのドラッグ・アンド・ドロップ機能の追加」を参照してください。
デフォルトでは、Calendarは青いランプを使用してアクティビティを表示します。色ランプは、すべてが同じ色相（たとえば青）に基づいている色のグループです。図15-1に示すように、デフォルトのCalendarでは、日次表示で表示される短期間のアクティビティの場合、アクティビティの時間は濃い青の背景色で表示され、アクティビティのタイトルは薄い青の背景色で表示されます。色ランプを変更することで、アクティビティの表示方法をカスタマイズできます。
各アクティビティはプロバイダ、つまり所有者に関連付けられています。図15-3に示すように、複数のプロバイダのアクティビティを表示できるようにCalendarを実装する場合、各プロバイダのアクティビティが異なる色で表示されるようにそれぞれのアクティビティのスタイルを設定できます。
Calendarコンポーネントをページに追加する前に、ADF Faces Calendarの抽象クラスを拡張するJavaクラスのCalendarで必要なロジックを実装する必要があります。ADF Facesアプリケーションの場合は、マネージドBeanとしてクラスを作成します。クラスを作成すると、Calendarをページに追加できます。
|
注意: アプリケーションでフルFusionテクノロジ・スタックを使用する場合は、ADF Business Componentsを使用してCalendarクラスを実装します。これにより、Calendarコンポーネントを宣言的に作成してバインドできます。詳細は、『Oracle Fusion Middleware Oracle Application Development Framework Fusion開発者ガイド』のADF Faces Calendarコンポーネントの使用に関する項を参照してください。 |
ロジックを実装する前に、次の項で説明されているCalendarModelクラスおよびCalendarActivityクラスについて理解しておくと役立ちます。
Calendarコンポーネントは、CalendarModelクラスの実装にバインドする必要があります。CalendarModelクラスには、Calendarのデータが含まれます。このクラスは、次の一連のパラメータに基づき、Calendarアクティビティのコレクションを返します。
プロバイダID: アクティビティの所有者。たとえば、Calendarが現在セッション中の所有者に関連付けられているアクティビティのみ返すように、またはその他の所有者のアクティビティも返すようにCalendarModelクラスを実装できます。
時間範囲: その時間内に開始されたすべてのアクティビティが返されるようにする時間の範囲。Calendarの時間範囲に開始時間は含まれますが、終了時間は含まれません（ハーフオープンとも呼ばれます）。つまり、その範囲にわたるすべてのアクティビティ（開始時間前に開始し、開始時間後かつ終了時間前に終了したアクティビティを含む）が返されることを意味します。
Calendarアクティビティは、Calendar上のオブジェクトを表し、通常は一定の期間にわたります。CalendarActivityクラスは抽象クラスであり、このクラスのメソッドは特定のアクティビティに関する情報を返すために実装できます。
アクティビティは再帰可能で、関連するキーワードを設定でき、特定の時間タイプ（時または分など）に設定できます。アクティビティには開始日と終了日、ロケーション、タイトルおよびタグを設定することもできます。
CalendarProviderクラスは、アクティビティの所有者を表します。プロバイダは、Calendarに対して有効化または無効化できます。
CalendarModelクラスおよびCalendarActivityクラスの独自の実装を作成し、抽象メソッドを実装してロジックを提供します。
Calendarのロジックを保持するマネージドBeanを作成します。このBeanでは、次のことを行う必要があります。
oracle.adf.view.rich.model.CalendarModelクラスを拡張する。
抽象メソッドを実装する。
CalendarModelクラスの詳細は、ADF FacesのJavadocを参照してください。
Calendarに必要なその他の機能を実装する。例として、ADF Facesデモ・アプリケーションのoracle.adfdemo.view.calendar.rich.model.DemoCalendarModelマネージドBeanを参照してください。
マネージドBeanの作成の詳細は、2.6項「マネージドBeanの作成と使用」を参照してください。
アクティビティのロジックを保持するマネージドBeanを作成します。このBeanでは、次のことを行う必要があります。
oracle.adf.view.rich.model.CalendarActivityクラスを拡張する。
抽象メソッドを実装する。
Calendarに必要なその他の機能を実装する。例として、ADF Facesデモ・アプリケーションのoracle.adfdemo.view.calendar.rich.model. DemoCalendarActivityマネージドBeanを参照してください。
|
ヒント: アクティビティの個々のインスタンスにスタイルを設定する場合（たとえば、各プロバイダのアクティビティを異なる色で表示する場合）、getTagsメソッドでアクティビティ・インスタンスを表す文字列を返す必要があります。詳細は、15.7.1項「アクティビティのスタイル設定方法」を参照してください。 |
プロバイダの情報とロジックを保持するマネージドBeanを作成します。
oracle.adf.view.rich.model.CalendarProviderクラスを拡張する。
抽象メソッドを実装する。
プロバイダに必要なその他の機能を実装する。
calendarコンポーネントを作成するには、コンポーネント・パレットからJSFページに「カレンダ」をドラッグ・アンド・ドロップします。
|
ヒント: calendarコンポーネントは、その子コンポーネントを拡大できる任意の親コンポーネントで拡大できます。Calendarが、拡大できないコンポーネントに対する子コンポーネントである場合、そのCalendarではデフォルトの幅と高さが使用されます。実行時にユーザーが幅と高さを拡大することはできません。ただし、インライン・スタイル属性を使用して、デフォルトの幅と高さをオーバーライドできます。デフォルトの高さと幅の詳細は、15.3項「Calendarコンポーネントの構成」を参照してください。コンポーネント拡大の詳細は、8.2.1項「ジオメトリ管理およびコンポーネントの拡大」を参照してください。 |
プロパティ・インスペクタの「カレンダ・データ」セクションを開き、CalendarModelクラスを拡張するマネージドBeanに解決されるvalue属性のEL式を入力します。
Calendarの多くの表示属性（週の開始日、1日の始まりに表示する時刻など）を構成します。
プロパティ・インスペクタを使用してCalendarを構成します。
Calendarを構成する手順:
calendarコンポーネントを選択した状態で、プロパティ・インスペクタの「共通」セクションを開き、次の設定を行います。
view: Calendarを表示するときのデフォルトの表示（day、list、monthまたはweek）を選択します。ユーザーは、Calendarのツールバーにある対応するボタンをクリックしてこの値を変更できます。
startDayOfWeek: 月表示または週表示の左端に週の開始日として表示される曜日を入力します。設定しない場合、デフォルトはユーザーのロケールに基づきます。有効な値は次のとおりです。
sun
mon
tue
wed
thu
fri
sat
startHour: 日表示および週表示の上部に表示される時間（0が午前0時の24時間形式）を表す数値を入力します。日表示または週表示のCalendarが午前12:01に開始する場合、そのCalendarはstartHour値に自動的にスクロールされ、表示の上部に表示されます。ユーザーは、startHourの値より前に開始したアクティビティを確認するために、いつでもこの時間より前にスクロールできます。
listType: リスト表示でアクティビティを表示する方法を選択します。有効な値は次のとおりです。
day: アクティブな日のアクティビティのみ表示します。
dayCount: listCount属性の値に基づき、アクティブな日以降を含む日数を表示します。
month: アクティブな日が属する月のアクティビティをすべて表示します。
week: アクティブな日が属する週のアクティビティをすべて表示します。
listCount: 表示する日のアクティビティ数を入力します（listType属性がdayCountに設定されている場合のみ使用します）。
図15-4に、listTypeがdayCountに設定され、listCount値が7に設定されているリスト表示のCalendarを示します。
プロパティ・インスペクタの「カレンダ・データ」セクションを開き、次の設定を行います。
activeDay: Calendarに表示される日付範囲を決定するために使用される日を設定します。デフォルトでは、アクティブ日はユーザーの今日の日付です。Calendarを初めて開くときのデフォルトのアクティブ日を今日の日付にする場合は、この設定を変更しないでください。
別の日を選択した場合、その日がactiveDay属性の値になります。たとえば、Calendarに初めてアクセスする場合、現在の日付（2009年2月6日）がアクティブ日になります。月表示には2月が表示されます。「次へ」ボタンを使用して次の月にスクロールすると、アクティブ日は2009年3月6日になります。
timeZone: Calendarのタイムゾーンを設定します。設定しない場合、値はAdfFacesContextから取得されます。有効な値はjava.util.TimeZoneオブジェクトです。
ユーザーが既存のアクティビティのハンドルをドラッグして、そのアクティビティの期間を拡張または縮小できるようにする場合は、CalendarActivityDurationChangeListenerのハンドラを実装します。このハンドラには、アクティビティの終了時間を変更する機能を含める必要があります。ユーザーがアクティビティを移動し、開始時間および終了時間を変更できるようにするには、ドラッグ・アンド・ドロップ機能を実装します。詳細は、15.5項「Calendarへのドラッグ・アンド・ドロップ機能の追加」を参照してください。
これで、次の機能を追加できます。
ユーザーがポップアップ・コンポーネントを使用してアクティビティを作成、編集および削除できるようになります。詳細は、15.4項「ポップアップ・コンポーネントを使用した機能の追加」を参照してください。
ユーザーがCalendar上でアクティビティを移動できるようになります。詳細は、15.5項「Calendarへのドラッグ・アンド・ドロップ機能の追加」を参照してください。
ツールバーのツールバー・ボタンを変更または追加します。詳細は、15.6項「ツールバーのカスタマイズ」を参照してください。
Calendarとイベントの外観を変更します。詳細は、15.7項「Calendarのスタイル設定」を参照してください。
Calendarには、ファセットとともに使用する2つのイベントがあります。それらを使用して、Calendarに必要な追加機能（アクティビティの編集や追加など）を簡単に実装する方法を提供します。その2つのイベントは、CalendarActivityEvent（アクティビティでアクションが発生したときに起動）およびCalendarEvent（Calendar自体でアクションが発生したときに起動）です。これらのイベントを使用した追加機能の提供の詳細は、15.4項「ポップアップ・コンポーネントを使用した機能の追加」を参照してください。
Calendarでは、特定の変更が発生したときに起動されるイベントもサポートされています。ユーザーが、アクティビティが表示されるボックスをドラッグして、アクティビティの期間を変更すると、CalendarActivityDurationChangeEventが起動されます。コンポーネントによって表示属性の値が変更されると（たとえば、view属性がmonthからdayに変更された場合）、常にCalendarDisplayChangeEventが起動されます。
CalendarDisplayChangeEventが起動されると、Calendarコンポーネントは部分ページ・レンダリング（PPR）のターゲットとしてコンポーネント自体を追加し、Calendarをすぐにリフレッシュできるようにします。これは、Calendarでは、プログラムを使用して表示が変更された場合、Calendarを再レンダリングする必要があることが前提となっているためです。たとえば、view属性をdayからmonthに変更した場合、Calendarは自動的に再レンダリングされます。
ユーザーがアクティビティに対して操作を行うと、CalendarActivityEventが起動されます。このイベントは、ユーザーのアクションに基づき、ファセットに含まれているポップアップ・コンポーネントを表示します。たとえば、ユーザーがアクティビティを右クリックすると、CalendarActivityEventによって、activityContextMenu内のポップアップ・コンポーネントが表示されます。このイベントはサーバーにも配信され、サーバーでは構成済のリスナーがそのイベントに対する処理を行うことができます。ファセットのポップアップ・コンポーネントはユーザーが作成します。ポップアップ・コンポーネントを使用しない場合は、サーバー側のリスナーを実装します。これらのポップアップ・コンポーネントおよびファセットに、ユーザーがアクティビティを作成、削除および編集できる機能、およびそれぞれのCalendarのインスタンスを構成できる機能を実装できます。
表15-1に、イベントを起動する様々なユーザー・アクション、起動されるイベント、およびイベントが起動されたときにファセットのコンテンツを表示する関連のファセットを示します。この表には、ポップアップ・コンポーネント内で使用する必要があるコンポーネントも示されています。ポップアップ・コンポーネントおよび関連のコンポーネントは、関連リスナーのハンドラに実装されている機能とともにファセット内に作成します。表のいずれのファセットにもポップアップ・コンポーネントを挿入しない場合、関連イベントはサーバーに配信されます。サーバーでは、そのイベントのハンドラを実装することでイベントを処理できます。
表15-1 Calendar Facesイベントおよび関連ファセット
機能を追加するには、関連ファセット内にポップアップ・コンポーネントと関連コンポーネントを作成します。
ポップアップ・コンポーネントを使用して機能を追加する手順:
図15-5に示すように、構造ウィンドウでcalendarコンポーネント・ノードを開き、Calendarファセットを表示します。
表15-1に基づき、機能を提供するユーザー・アクションに対応するポップアップ・コンポーネントをファセットに作成します。たとえば、アクティビティをクリックして[Del]キーを押すことで、ユーザーがアクティビティを削除できるようにする場合は、activityDeleteファセットにポップアップ・ダイアログを追加します。
ポップアップ・コンポーネントを追加するには、構造ウィンドウ内でファセットを右クリックして、「facetNameの中に挿入」→「ComponentName」を選択します。
ポップアップ・コンポーネントの作成の詳細は、第13章「ポップアップ・ダイアログ、メニューおよびウィンドウの使用方法」を参照してください。
例15-1に、activityDeleteファセットで使用されるダイアログ・ポップアップ・コンポーネントのJSFコードを示します。
例15-1 アクティビティの削除ダイアログのJSFコード
<f:facet name="activityDelete">
<af:popup id="delete" contentDelivery="lazyUncached">
<!-- don't render if the activity is null -->
<af:dialog dialogListener="#{calendarBean.deleteListener}"
affirmativeTextAndAccessKey="Yes" cancelTextAndAccessKey="No"
rendered="#{calendarBean.currActivity != null}">
<af:outputText value="NOTE: This popup is for demo purposes only,
it is not part of the built in functionality of the calendar."/>
<af:spacer height="20"/>
<af:outputText value="Are you sure you want to delete this activity?"/>
<af:panelFormLayout>
<af:inputText label="Title" value="#{calendarBean.currActivity.title}"
readOnly="true"/>
<af:inputDate label="From" value="#{calendarBean.currActivity.from}"
readOnly="true">
<af:convertDateTime type="date" dateStyle="short"
timeZone="#{calendarBean.timeZone}"
pattern="#{calendarBean.currActivity.dateTimeFormat}"/>
</af:inputDate>
<af:inputDate label="To" value="#{calendarBean.currActivity.to}"
readOnly="true">
<af:convertDateTime type="date" dateStyle="short"
timeZone="#{calendarBean.timeZone}"
pattern="#{calendarBean.currActivity.dateTimeFormat}"/>
</af:inputDate>
<af:inputText label="Location" readOnly="true"
rendered="#{calendarBean.currActivity.location != null}"
value="#{calendarBean.currActivity.location}"/>
</af:panelFormLayout>
</af:dialog>
</af:popup>
</f:facet>
図15-6に、ユーザーがアクティビティをクリックして[Del]キーを押したときに、ダイアログがどのように表示されるかを示します。
calendarActivityListenerに必要なロジックを実装します。たとえば、activityDeleteFacetのダイアログを実装している場合は、calendarActivityListenerに現在のアクティビティを保存できるロジックを実装します。それによって、（次の手順で）ダイアログ・リスナーにロジックを実装するときに、削除するアクティビティがわかります。例15-2に、ADF Facesデモ・アプリケーションのcalendar.jspxページのcalendarActivityListenerを示します。
例15-2 calendarActivityLIstenerハンドラ
public void activityListener(CalendarActivityEvent ae)
{
CalendarActivity activity = ae.getCalendarActivity();
if (activity == null)
{
// no activity with that id is found in the model
System.out.println("No activity with event " + ae.toString());
setCurrActivity(null);
return;
}
System.out.println("providerId is " + activity.getProviderId());
System.out.println("activityId is " + activity.getId());
setCurrActivity(new DemoCalendarActivityBean((DemoCalendarActivity)activity, getTimeZone()))
ポップアップ・イベントのハンドラにポップアップ・コンポーネントのロジックを実装します。たとえば、「削除」ダイアログの場合、ダイアログが閉じたときに実際のアクティビティを削除するdialogListenerのハンドラを実装します。ダイアログおよび他のポップアップ・コンポーネントの作成の詳細は、第13章「ポップアップ・ダイアログ、メニューおよびウィンドウの使用方法」を参照してください。
Calendarには、ユーザーがアクティビティのハンドルをドラッグして終了時間を変更できる機能が含まれています。ただし、ユーザーがアクティビティを別の開始時間、さらには別の日にドラッグ・アンド・ドロップできるようにする場合は、ドラッグ・アンド・ドロップ機能を実装します。ドラッグ・アンド・ドロップを使用すると、アクティビティを移動できるだけでなく、コピーすることもできます。
ドラッグ・アンド・ドロップ機能は、calendarDropTargetタグを使用して追加します。コレクションのドラッグ・アンド・ドロップとは異なり、ソース・タグは必要ありません。アクティビティの移動はターゲット（つまり、アクティビティの移動先のオブジェクト、この場合はCalendar）が行います。ソース（移動またはコピーされる項目）がCalendar内のアクティビティの場合は、calendarDropTargetタグのみ使用します。このタグでは、転送可能なのはcalendarActivityオブジェクトであると想定されています。
ただし、Calendarの外からオブジェクトをドラッグ・アンド・ドロップすることもできます。この操作を有効にする場合は、ソース・オブジェクト（calendarActivityオブジェクト以外のオブジェクト）をドロップできるように構成されているdataFlavorタグを使用します。
一般的なドラッグ・アンド・ドロップ機能の実装の詳細は、第32章「ドラッグ・アンド・ドロップ機能の追加」を参照してください。
Calendarにドラッグ・アンド・ドロップ機能を追加する手順:
コンポーネント・パレットから（「操作」パネルにある）Calendarドロップ・ターゲットをドラッグして、calendarDropTargetタグをCalendarコンポーネントの子として追加します。
Calendarドロップ・ターゲットの挿入ダイアログで、イベントを処理するマネージドBeanのメソッドに対して評価されるdropListener属性の式を入力します（このコードは手順4で作成）。
プロパティ・インスペクタで、actions属性を設定します。この値で、アクティビティ（または他のソース）の移動、コピー、リンクとしてコピー、またはこの3つの任意の組合せを実行できるかどうかが決まります。アクションを指定しない場合、デフォルトはCOPYです。
ステップ2でEL式に挿入されたマネージドBeanに、ドロップ・イベントのハンドラを実装します。
このメソッドは、DropEventイベントをパラメータとし、DnDActionを返す必要があります。DnDActionは、ソースがドロップされた際に行われるアクションです。有効な戻り値はCOPY、MOVEおよびLINKで、手順3でactions属性を定義すると設定されます。このメソッドではDropEventを使用してtransferableオブジェクトを取得し、ドラッグされたデータのCalendarModelオブジェクトにここからアクセスし、ここから実際のデータにアクセスします。その後、リスナーでソースのモデルにデータを追加し、実行するDnDAction（DnDAction.COPY、DnDAction.MOVEまたはDnDAction.LINK）を返します。そうでない場合は、ドロップが拒否されたことを示すDnDAction.NONEを返します。
ドロップ・イベントのドロップ・サイトは、oracle.adf.view.rich.dnd.CalendarDropSiteクラスのインスタンスです。Calendarのドラッグ・アンド・ドロップ・ハンドラの例は、ADF Facesデモ・アプリケーションのoracle.adfdemo.view.calendar.rich.DemoCalendarBeanマネージドBeanのhandleDropメソッドを参照してください。
アクティビティのソースがCalendarの外部にある場合は、コンポーネント・パレットからデータ・フレーバをドラッグし、calendarDropTargetタグの子としてドロップして、dataFlavorタグを作成します。このタグにより、ターゲットにドロップできるオブジェクトの型（StringやDateオブジェクトなど）が決まります。1つのドロップ・ターゲットに複数のdataFlavorタグを使用し、ドロップ・ターゲットでこれらの型のいずれも受け入れるようにすることができます。
「データ・フレーバの挿入」ダイアログで、ターゲットにドロップ可能なオブジェクトのクラス（java.lang.Objectなど)を入力します。
|
ヒント: dataFlavorタグに型指定された配列を指定するには、java.lang.Object[]のようにクラス名に大カッコ（[]）を追加します。 |
Calendar内のドラッグ・アンド・ドロップ・アクティビティの場合、ユーザーは表示内でのみドラッグ・アンド・ドロップを行うことができます。つまり、ユーザーは、日表示内の1つの時間スロットから別の時間スロットにアクティビティをドラッグできますが、日表示からアクティビティを切り取り、月表示に貼り付けることはできません。
ユーザーが日表示または週表示でアクティビティをドラッグ・アンド・ドロップしている場合、Calendarでは30分ごとにドロップ・サイトがマークされます。日表示では、終日のアクティビティまたは複数日のアクティビティは移動できません。
週表示では、終日のアクティビティおよび複数日のアクティビティを移動できますが、その他の終日のスロットにのみドロップできます。つまり、終日のアクティビティを、開始時間と終了時間が設定されているアクティビティには変更できません。月表示では、終日のアクティビティおよび複数日のアクティビティを任意の日に移動できます。
デフォルトでは、Calendarのツールバーでは、表示を日、週、月およびリスト間で変更したり、表示内の次または前の項目に移動したり、当日に移動したりすることができ、現在の表示のテキスト説明も表示できます。たとえば、図15-7に示すように、日表示の場合はアクティブ日を表示できます。
図15-8に、カスタマイズされているツールバーを示します。このツールバーには、一番上のツールバーに右揃えされているボタンおよび2番目のツールバーのボタンを含め、ツールバー・ボタンが追加されています。
作成するカスタム・ファセットに、追加するツールバーおよびツールバー・ボタンを配置します。次に、含まれている項目の表示方法および表示場所を決定するキーワードとともに、ツールバーの属性からファセットを参照します。
ツールバーをカスタマイズする手順:
コード・エディタでJSFページを開き、追加するツールバーの各セクションに<f:facet>タグを追加します。たとえば、図15-8に示されているカスタム・ボタンを追加するには、4つの<f:facet>タグを追加します。各ファセットには、ページに対する一意な名前を付けてください。
|
ヒント: ADF Facesの今後のリリースと競合が生じないようにするには、すべてのファセット名をcustomToolbarで開始します。たとえば、図15-8に示されている「位置合せ」ボタンを含むツールバーのセクションは、customToolbarAlignファセットです。 |
各ファセットにツールバーを追加し、ツールバー・ボタンを追加して、必要に応じてボタンおよびツールバーを構成します。ツールバーとツールバー・ボタンの詳細は、14.3項「ツールバーの使用方法」を参照してください。
プロパティ・インスペクタで、toolboxLayout属性のドロップダウン・アイコンをクリックし、「編集」を選択して「プロパティの編集: ToolboxLayout」ダイアログを開きます。この属性の値は、カスタム・ファセット名のリストに、カスタム・ファセット内のコンテンツを表示する順序で設定する必要があります。これらのファセットのみでなく、次のキーワードを使用して、デフォルトのツールバーのすべてまたは一部を含めることもできます。
all: デフォルトのツールバーにすべてのツールバー・ボタンおよびテキストを表示します。
dates: 「前へ」ボタン、「次へ」ボタンおよび「今日」ボタンのみ表示します。
range: 現在の日付範囲を示す文字列のみ表示します。
views: ユーザーが表示を変更できるボタンのみ表示します。
|
注意: allキーワードを使用する場合、dates、rangeおよびviewsキーワードは無視されます。 |
たとえば、customToolbar1およびcustomToolbar2という名前の2つのファセットを作成し、デフォルトのツールバー全体をカスタム・ツールバーの間に表示させる場合、toolboxLayout属性の値は次のリスト項目となります。
customToolbar1
all
customToolbar2
ツールバーのレイアウトは、次のキーワードを使用して決定することもできます。
newline: 新しい行の次の名前付きファセット（またはtoolboxLayout属性のリストの次のキーワード）にツールバーを配置します。たとえば、customToolbar2ファセットのツールバーを新しい行に表示させる場合、リストは次のようになります。
customToolbar1
all
newline
customToolbar2
デフォルトのツールバーのすべては使用せず、viewsセクションとdatesセクションのみ使用し、それぞれのセクションを新しい行に表示させる場合、リストは次のようになります。
customToolbar1
customToolbar2
newline
views
newline
dates
stretch: 使用可能なすべての領域を埋めるために拡大されるspacerコンポーネントを追加して、次の名前付きファセット（またはデフォルトのツールバーの次のキーワード）がツールバーに右揃えで表示されるようにします。例15-3に、図15-8に表示されるツールバーのtoolboxLayout属性の値、およびcustomToolbarAlignファセットに配置されているツールバーを示します。customToolbarBoldファセットに表示されているツールバー・ボタンは、stretchキーワードがファセットの前に指定されているため、ツールバー内で右揃えで表示されています。
例15-3 カスタム・ツールバーの値
<af:calendar binding="#{editor.component}" id="calendar1"
value="#{calendarBean.calendarModel}"
timeZone="#{calendarBean.timeZone}"
toolboxLayout="customToolbarAlign all customToolbarTZ stretch
customToolbarBold newline customToolbarCreate"
. . .
<f:facet name="customToolbarAlign">
<af:toolbar>
<af:commandToolbarButton id="alignLeft" shortDesc="align left"
icon="/images/alignleft16.png" type="radio"
selected="true"/>
<af:commandToolbarButton id="alignCenter" shortDesc="align center"
icon="/images/aligncenter16.png" type="radio"
selected="false"/>
<af:commandToolbarButton id="alignRight" shortDesc="align right"
icon="/images/alignright16.png" type="radio"
selected="false"/>
</af:toolbar>
</f:facet>
. . .
</af:calendar>
他のADF Facesコンポーネントと同様、第20章「「スタイルおよびスキンを使用した外観のカスタマイズ」で説明されているように、Calendarコンポーネントもスタイル設定できます。ただし、Calendarコンポーネントには、標準のスタイル設定手順に加えて、Calendarのインスタンスのスタイル設定を簡単にする固有の属性があります。それらの属性は次のとおりです。
activityStyles: 各アクティビティ・インスタンスを個々にスタイル設定できます。たとえば、異なるプロバイダに属しているアクティビティを別の色で表示できます。
dateCustomizer: 月表示の日にCalendar日以外の文字列を表示できます。たとえば、図15-9に示されているように、カウントダウン・タイプの数値を表示できます。この属性を使用すると、日のヘッダーの空白部分に文字列を追加できます。
activityStyles属性は、InstanceStylesオブジェクトを使用して、アクティビティの特定のインスタンスをスタイル設定します。InstanceStylesクラスは、スキニング・キーに基づくインスタンスごとのインライン・スタイルを提供します。
activityStyles属性は、特定のプロバイダに属しているアクティビティを特定の色を使用して表示するために最もよく使用されます。たとえば、図15-10に示されているCalendarは、異なる3つのプロバイダに属しているアクティビティを示しています。プロバイダのアクティビティを表すために使用されている色は、左のペインで変更できます。activityStyles属性は、アクティビティが関連付けられているプロバイダに基づき、各アクティビティに表示される色を決定するために使用します。
このCalendarでは、単一の色を使用するかわりに、色の範囲が使用されています。これは、色ランプと呼ばれます。色ランプは、色ファミリ内の色のセットであり、アクティビティの様々な状態を表します。たとえば、T.F.のアクティビティでは青いランプを使用しています。期間が1日以内のアクティビティは、青色の中間色のテキストで表示されます。複数日にまたがるアクティビティは、青色の中間色のボックスに白いテキストで表示されます。濃い青は開始時間の背景色で、薄い青はタイトルの背景色です。これら3つの異なる青は、すべて青い色ランプの一部です。
CalendarActivityRampクラスは、InstanceStylesのサブクラスであり、代表的な色を取得して（たとえば、T.F.のアクティビティには青が選択されています）、Calendarで各アクティビティを表示するために使用する正しい色ランプを返すことができます。
activityStyles属性は、mapオブジェクトにバインドする必要があります。マップ・キーは、アクティビティに対するgetTagsメソッドから返されるセットです。InstanceStylesオブジェクトのマップ値は、ほとんどの場合CalendarActivityRampのインスタンスです。このInstanceStylesオブジェクトはスキンニング・キーを取り込み、各アクティビティのスタイルを返します。
CalendarActivityクラスで、getTagsメソッドを使用して文字列セットを返します。この文字列セットは、返される文字列を特定のスタイルにマップするためにactivityStyles属性で使用されます。たとえば、図15-10に示すように異なるプロバイダに異なる色ランプを使用する場合は、各プロバイダの文字列を返す必要があります。この場合、現在のユーザーに属しているアクティビティはMeを返し、L.E.に属しているアクティビティはLEを返し、T.F.に属しているアクティビティはTFを返します。CalendarActivityクラスの実装の詳細は、15.2.2項「Calendarの作成方法」を参照してください。
キーがgetTagsメソッドから返された文字列であり、値がInstanceStylesオブジェクト（CalendarActivityRampインスタンスなど）であるマップを作成します。
たとえば、図15-10に示すように異なる色ランプを使用する場合は、表15-2に示されている値を使用してマップを作成できます。
表15-2 activityStyles属性のマップ
| キー（文字列セット） | 値（InstanceStylesオブジェクト） |
|---|---|
|
|
|
|
|
|
|
|
|
構造ウィンドウで「カレンダ」コンポーネントを選択し、プロパティ・インスペクタでactivityStyles属性をマップにバインドします。
各アクティビティに対するCalendarのレンダリング中、レンダラはCalendarActivity.getTagsメソッドをコールして文字列セットを取得します。次に、文字列セットはactivityStyles属性にバインドされているマップに渡され、InstanceStylesオブジェクトが返されます（CalendarActivityRampの場合もあります）。
次の例を参照してください。
文字列セット{"Me"}が渡された場合、赤のCalendarActivityRampが返されます。
文字列セット{"LE"}が渡された場合、オレンジのCalendarActivityRampが返されます。
文字列セット{"TF"}が渡された場合、青のCalendarActivityRampが返されます。
月表示の日のヘッダーに日付の数値文字列以外の内容を表示する場合、dateCustomizer属性を、日付に表示する内容を決定するDateCustomizerクラスの実装にバインドできます。
日付文字列をカスタマイズする手順:
oracle.adf.view.rich.util.DateCustomizerクラスのサブクラスを作成します。このサブクラスは、次のスキニング・キーを使用して、表示する内容を決定します。
af|calendar::month-grid-cell-header-misc: 月表示の日のヘッダーの左側に表示する内容を決定します。
af|calendar::month-grid-cell-header-day-link: 日付に表示する文字列を決定します。
例15-4に、DemoDateCustomizerクラスを示します。このクラスでは、週の初日に週番号が表示され、その月の日のかわりに、図15-9に示すように特定の日までのカウントダウン数値が表示されます。
例15-4 DateCustomizerクラス
public class MyDateCustomizer extends DateCustomizer
{
public String format(Date date, String key, Locale locale, TimeZone tz)
{
if ("af|calendar::month-grid-cell-header-misc".equals(key))
{
// return appropriate string
}
else if ("af|calendar::month-grid-cell-header-day-link".equals(key))
{
// return appropriate string
}
return null;
}
}
マネージドBeanで、DateCustomizerクラスのインスタンスを作成します。次に例を示します。
private DateCustomizer _dateCustomizer = new DemoDateCustomizer();
Calendarコンポーネントで、マネージドBeanに作成したDateCustomizerインスタンスにdateCustomizer属性をバインドします。
