XPagesアプリの構成

概要

PCのブラウザで使うXPagesアプリは、基本的には以下のような構成になることが多い。

  • 「文書」の一覧を表示するビュー用のページ
  • 「文書」を表示するページ
  • 「文書」表示ページには表示モードと編集モードを用意
  • 新規作成用のボタンを用意

絵に描くとこんな感じ。

基本的な構成

XPagesアプリを構想するときには、以下のように考えるといい。

  • アプリで扱うデータをどのような「文書」に格納するか。
  • 「文書」内にどんなデータを保持させればいいか
  • 「文書」の一覧をどのように表示するか
  • 文書を開くページや文書の一覧を表示するページの名前を決める(XPageの名前)
  • 文書を表示するページのデザインを考える。特にこだわりがなければ、OneUIの規約に従ったページ構成(ヘッダ、メニュー、コンテンツ、フッタ)にすると楽
  • コンテンツ内の配置を考える

XPagesでは、データを格納する「文書」を「フォーム」というもので定義する。「フォーム」内には「フィールド」を複数配置する。名前や日付といったデータは 「フィールド」に格納され、「文書」という塊としてアプリケーション(NSFファイル)内に格納される。
フォームの定義

「文書」の一覧を表示するのが「ビュー」になる。XPagesでは「ビュー」がそのまま画面に出てくるわけではないが、文書の一覧ページを作るときの元や、検索機能などに使う。

実際にブラウザから開く画面が「XPage」になる。各画面(Xpage)内のレイアウトをXPageやカスタムコントロールで定義していく。

HUMCOM Methodアプリには、以下のような要素も組み込まれている。

  • 文書ロック用のlockフォームとlockViewビュー
  • 設定管理用のsettingフォームとsettingsビュー
  • アプリケーション画面の基本構造を決めるxcLayout, xcTitleBar, xcBanner, xcFooter, xcMenuなどのカスタムコントロール
  • HUMCOM Libraries(SSJS)
  • HUMCOM CSS

HUMCOM Methodのサンプルアプリケーション

たとえば、会社内のPCの管理台帳アプリだったら、「PC文書」なるものを用意し、PC1台分の情報をそこに保持する。 「PC文書」内には、以下のような情報を保持させる。

  • PC管理番号
  • PCホスト名
  • 管理部署
  • 管理者氏名
  • 同時に購入した備品の一覧(可変長)

次にPC文書の一覧は管理番号順、管理部署別に表示するページを用意すればいいだろう。

ここに文書一覧用、文書表示用のXPageとカスタムコントロールを作りこんでいく。その作り方を説明していく。

ここで紹介するXPsagesアプリをHUMCOM.nsfに用意した。

フォームの作成

XPagesの場合、データのかたまりを「文書」内の「フィールド」に格納する。 フォームの作り方について説明する。

ビューの用意

ビューはXPagesで文書の一覧表示、目的の文書を検索、キーワードの抽出などいろんな用途に使う。

XPage

ブラウザで画面を開くのがXPageになるので、各画面の入口になる。

"XPages"は技術というか、プラットフォームの名前。XPagesアプリの各画面は単数形の"XPage"と記載する。

ページモジュール

各ページの処理はページモジュールに集約するといい。