このレッスンでは、基本的な XPage を作成する方法を学習します。
このレッスンでは、1 つのフォームと 1 つのビューを使用しますが、これらを作成する演習は行いません。 Site フォームにはサイト情報と検索条件を格納するフィールドが含まれています。[SiteList] ビューは、サイトと検索結果のリストを表示するために使用します。 これらの概要を理解してください。 フォームと
ビューについては、ヘルプの『
Domino Designer
Basic 版 ユーザーガイドおよびリファレンス』の資料を参照してください。
- フォームは XPage によって使用され、データの表示方法ではなく、文書に保管するデータを定義します。 この定義は、データの編成と計算を行うための表示フォーム上の隠しフィールドの使い方に似ています。 Site フォームには、文書を作成するためのデータフィールドと説明テキストが含まれています。 これはユーザーに表示されることはないため、レイアウトは重要ではありません。
- ビューは、文書の集合とその順序を定義するために XPage によって使用されます。 データに索引を付けて、データにプログラマチックにアドレスできるようにするためだけにビューを使用することもできます。[SiteList] ビューは、データ文書の索引としての機能を果たします。 これは、サイト名でソートされているすべての文書の内容をリストします。 ビューは文書を編成するための強力な手段であるため、さまざまなサブセットとソート順序を表示する複数のビューを用意するのが一般的です。
アプリケーションが展開されていることを確認して、以下の手順を実行します。
- [XPages] をダブルクリックします。
このアクションによって、XPage 要素のリストが中央ペインに表示されます。
- [新規 XPage] をクリックします。
- 新しい XPage に [SiteList] という名前を付けます。 (.xsp 拡張が想定され、自動的に追加されます。)
名前にスペースを使用することは可能ですが、通常スペースを使用しない方が名前が明確になります。
- [OK] をクリックします。 空の XPage 設計要素が中央ペインに作成されます。
- 以下のようにして、ページにヘッダーグラフィックスを配置します。
- [コアコントロール] から、[イメージ] を選択して XPage にドラッグします。 [イメージの選択] ウィンドウが表示されます。
- xpTitlebarLeft_ren.gif を選択します。
[イメージの選択] ウィンドウは、下の画面キャプチャのようになります。
- [OK] をクリックします。
画面キャプチャに表示されるイメージは、プリロードされています。 リストに表示されている各イメージは、現在のデータベースのリソースです。 [追加] ボタンを使用すると、追加のイメージをインポートできます (別の方法でイメージをインポートすることも可能です)。
[OK] をクリックすると、イメージがヘッダーとして表示されます。
- ヘッダーイメージの右横にある空白のスペース内をクリックするか、右矢印を押して右方向に移動します。
スペースが表示されていない場合は、必要に応じてその方向にスクロールしてください。
Enter を押して、カーソルを次の行に移動します。
- ヘッダーテキストを以下の手順で入力します。
- XPage で、ヘッダーの下の空白行をクリックします。
- 「サイトのリスト」と入力して、Enter を押します。
- テキストの行を強調表示します。
- 下部ペインで、[フォント] をクリックして、必要に応じてフォントを変更します (太字、14、青など)。
フォーマット設定を制御する別の方法として、後でスタイルシートを追加し、このテキストに適用します。
XPage の設計は、下の画面キャプチャのようになります。
経験のある Web 開発者は、文書を構造化する要素 (H1 や H2 など) を使用したいと考えることでしょう。
設計ユーザーインターフェースはこの構造をサポートしていませんが、ソースユーザーインターフェースを使用すると、必要に応じて XML を入力することができます。 ページを XML として表示および編集するには、[ソース] タブをクリックします。 チュートリアルに戻るには、[設計] タブをクリックします。