サンプルポートレットを作成する
最新の開発マニュアルは Google Code 内Aipoプロジェクトをご覧下さい。
ポートレットの雛形作成
既存のポートレットを利用してTestポートレットの雛形を作成します。
1. フォルダ構造作成
ポートレットは
(プロジェクトルート)\portletの配下にポートレット専用のフォルダ（以下「ポートレットフォルダ」と呼びます）を作成して、その中で作成していきます。
ポートレットフォルダの構造は以下のように決まっており、それにしたがってフォルダ階層を作る必要があります。
既にあるToDoポートレットのポートレットフォルダをコピーし、以下の規則ししたがってリネームして作成してください。
-
フォルダ名のリネーム
フォルダ名が「todo」のフォルダは、「test」にリネームする。
-
ファイル名のリネーム
ファイル名に「ToDo」が含まれるファイルは、「ToDo」の部分を「Test」に変更する。
例：ToDoAction.java ⇒ TestAction.java
Testポートレットのフォルダ構造は以下の通りになります。リネームしたファイルの中で、下記フォルダ構造に含まれない、不要なファイルは削除してかまいません。
portlet\test
│ maven.xml
│ portlet.properties
│ project.properties
│ project.xml
│
├─src
│ └─java
│ └─com
│ └─aimluck
│ └─eip
│ ├─modules
│ │ ├─actions
│ │ │ └─test
│ │ │ TestAction.java (1)
│ │ │
│ │ └─screens (2)
│ │ TestDetailScreen.java (3)
│ │ TestFormJSONScreen.java (4)
│ │ TestFormScreen.java (5)
│ │ TestListScreen.java (6)
│ │ TestScreen.java (7)
│ │
│ └─test (8)
│ │ TestFormData.java (9)
│ │ TestMultiDelete.java (10)
│ │ TestResultData.java (11)
│ │ TestSelectData.java (12)
│ │
│ └─util (13)
│ TestUtils.java (14)
│
└─webapp
├─images
│ └─test (15)
├─javascript
│ └─aipo
│ └─test (16)
│ form.js (17)
│
└─WEB-INF
├─conf
│ test.xreg (18)
│
└─templates
└─vm
└─portlets
└─html
└─ja (19)
ajax-test-detail.vm (20)
ajax-test-form.vm (21)
ajax-test-list.vm (22)
ajax-test.vm (23)
test-list.vm (24)
test-menu.vm (25)
test.vm (26)
| No. | 名前 | 説明 |
|---|---|---|
| (1) | TestAction.java | ポートレットのアクションを記述してあるクラスです |
| (2) | screensフォルダ | 画面表示に関わるクラスを収納しています |
| (3) | TestDetailScreen.java | 詳細表示画面の表示を行うクラスです |
| (4) | TestFormJSONScreen.java | フォーム画面へ表示する、エラー等のJSONを作成するクラスです |
| (5) | TestFormScreen.java | フォーム画面の表示を行うクラスです |
| (6) | TestListScreen.java | 最大化画面での表示を行うクラスです |
| (7) | TestScreen.java | 標準画面での表示を行うクラスです |
| (8) | testフォルダ | その他に必要なクラスを収納しています |
| (9) | TestFormData.java | フォーム画面に入力されたデータや、フォーム画面に表示するデータを管理するクラスです |
| (10) | TestMultiDelete.java | 複数削除を実行するクラスです |
| (11) | TestResultData.java | Testポートレットのリザルトデータのクラスです |
| (12) | TestSelectData.java | データベースからデータの読み出しを行うクラスです |
| (13) | util | ポートレットに必要なユーティリティークラスを収納しています |
| (14) | TestUtils.java | Testポートレットに必要なユーティリティークラスです |
| (15) | images\testフォルダ | Testポートレット中で用いる画像を収納しています |
| (16) | javascript\aipo\testフォルダ | Testポートレット中で用いるJavascriptを収納しています |
| (17) | form.js | Testポートレットのフォーム画面で用いるJavascriptです |
| (18) | test.xreg | Testポートレットの定義ファイルです |
| (19) | html\jaフォルダ | ベロシティーテンプレートを収納しています |
| (20) | ajax-test-detail.vm | 詳細画面のテンプレートです |
| (21) | ajax-test-form.vm | フォーム画面のテンプレートです |
| (22) | ajax-test-list.vm | 最大化画面のリストのテンプレートです |
| (23) | ajax-test.vm | 標準画面のテンプレートです |
| (24) | test-list.vm | 最大化画面のテンプレートですが、test-menu.vmとajax-test-list.vmを読み込むだけの動作です |
| (25) | test-menu.vm | 最大化画面でのメニューのテンプレートです |
| (26) | test.vm | 標準画面のテンプレートですが、ajax-test.vmを読み込むだけの動作です |
2. project.xmlの編集
Aipoのソースコードのビルドは、mavenを利用しています。
project.xmlはmavenがビルドを実行する際に参照するファイルで、このファイルの設定を適切に行わなければ、ビルドができません。
(プロジェクトルート)\portlets\test\project.xml
上記のproject.xmlファイルをテキストエディタ等で開いて、以下の要素の内容を編集します。
| 要素名 | 内容 | 意味 |
|---|---|---|
| id | aipo-portlet-test | ポートレット同士を識別するID |
| name | Test Portlet | ポートレット名 |
| description | Test Portlet. | ポートレットの説明 |
| shortDescription | Test Portlet. | 短いポートレットの説明 |
3. xregファイルの編集
xregファイルはポートレット自身を定義するものです。
「ポートレット追加」画面や、ポートレットの「カスタマイズ」画面の表示、ポートレットの枠に表示されているボタン等はこのファイルで定義されています。Testポートレット用に書き換えを行ってください。ここでは特に重要で、かつ分かりにくい部分について説明します。
(プロジェクトルート)\portlets\test\webapp\WEB-INF\conf\test.xreg
以下の行でアクションのクラスを設定しています。
<parameter name="action" value="test.TestAction" hidden="true" cachedOnName="true" cachedOnValue="true"/>
以下の行でポートレットの基本のVelocityファイルを設定しています。Valueのtestとは、test.vmのことです。
<parameter name="template" value="test" hidden="true" cachedOnName="true" cachedOnValue="true"/>
既存のポートレットを利用してTestポートレットの雛形を作成します。
1. フォルダ構造作成
ポートレットは
(プロジェクトルート)\portletの配下にポートレット専用のフォルダ（以下「ポートレットフォルダ」と呼びます）を作成して、その中で作成していきます。
ポートレットフォルダの構造は以下のように決まっており、それにしたがってフォルダ階層を作る必要があります。
既にあるToDoポートレットのポートレットフォルダをコピーし、以下の規則ししたがってリネームして作成してください。
-
フォルダ名のリネーム
フォルダ名が「todo」のフォルダは、「test」にリネームする。
-
ファイル名のリネーム
ファイル名に「ToDo」が含まれるファイルは、「ToDo」の部分を「Test」に変更する。
例：ToDoAction.java ⇒ TestAction.java
Testポートレットのフォルダ構造は以下の通りになります。リネームしたファイルの中で、下記フォルダ構造に含まれない、不要なファイルは削除してかまいません。
portlet\test
│ maven.xml
│ portlet.properties
│ project.properties
│ project.xml
│
├─src
│ └─java
│ └─com
│ └─aimluck
│ └─eip
│ ├─modules
│ │ ├─actions
│ │ │ └─test
│ │ │ TestAction.java (1)
│ │ │
│ │ └─screens (2)
│ │ TestDetailScreen.java (3)
│ │ TestFormJSONScreen.java (4)
│ │ TestFormScreen.java (5)
│ │ TestListScreen.java (6)
│ │ TestScreen.java (7)
│ │
│ └─test (8)
│ │ TestFormData.java (9)
│ │ TestMultiDelete.java (10)
│ │ TestResultData.java (11)
│ │ TestSelectData.java (12)
│ │
│ └─util (13)
│ TestUtils.java (14)
│
└─webapp
├─images
│ └─test (15)
├─javascript
│ └─aipo
│ └─test (16)
│ form.js (17)
│
└─WEB-INF
├─conf
│ test.xreg (18)
│
└─templates
└─vm
└─portlets
└─html
└─ja (19)
ajax-test-detail.vm (20)
ajax-test-form.vm (21)
ajax-test-list.vm (22)
ajax-test.vm (23)
test-list.vm (24)
test-menu.vm (25)
test.vm (26)
| No. | 名前 | 説明 |
|---|---|---|
| (1) | TestAction.java | ポートレットのアクションを記述してあるクラスです |
| (2) | screensフォルダ | 画面表示に関わるクラスを収納しています |
| (3) | TestDetailScreen.java | 詳細表示画面の表示を行うクラスです |
| (4) | TestFormJSONScreen.java | フォーム画面へ表示する、エラー等のJSONを作成するクラスです |
| (5) | TestFormScreen.java | フォーム画面の表示を行うクラスです |
| (6) | TestListScreen.java | 最大化画面での表示を行うクラスです |
| (7) | TestScreen.java | 標準画面での表示を行うクラスです |
| (8) | testフォルダ | その他に必要なクラスを収納しています |
| (9) | TestFormData.java | フォーム画面に入力されたデータや、フォーム画面に表示するデータを管理するクラスです |
| (10) | TestMultiDelete.java | 複数削除を実行するクラスです |
| (11) | TestResultData.java | Testポートレットのリザルトデータのクラスです |
| (12) | TestSelectData.java | データベースからデータの読み出しを行うクラスです |
| (13) | util | ポートレットに必要なユーティリティークラスを収納しています |
| (14) | TestUtils.java | Testポートレットに必要なユーティリティークラスです |
| (15) | images\testフォルダ | Testポートレット中で用いる画像を収納しています |
| (16) | javascript\aipo\testフォルダ | Testポートレット中で用いるJavascriptを収納しています |
| (17) | form.js | Testポートレットのフォーム画面で用いるJavascriptです |
| (18) | test.xreg | Testポートレットの定義ファイルです |
| (19) | html\jaフォルダ | ベロシティーテンプレートを収納しています |
| (20) | ajax-test-detail.vm | 詳細画面のテンプレートです |
| (21) | ajax-test-form.vm | フォーム画面のテンプレートです |
| (22) | ajax-test-list.vm | 最大化画面のリストのテンプレートです |
| (23) | ajax-test.vm | 標準画面のテンプレートです |
| (24) | test-list.vm | 最大化画面のテンプレートですが、test-menu.vmとajax-test-list.vmを読み込むだけの動作です |
| (25) | test-menu.vm | 最大化画面でのメニューのテンプレートです |
| (26) | test.vm | 標準画面のテンプレートですが、ajax-test.vmを読み込むだけの動作です |
2. project.xmlの編集
Aipoのソースコードのビルドは、mavenを利用しています。
project.xmlはmavenがビルドを実行する際に参照するファイルで、このファイルの設定を適切に行わなければ、ビルドができません。
(プロジェクトルート)\portlets\test\project.xml
上記のproject.xmlファイルをテキストエディタ等で開いて、以下の要素の内容を編集します。
| 要素名 | 内容 | 意味 |
|---|---|---|
| id | aipo-portlet-test | ポートレット同士を識別するID |
| name | Test Portlet | ポートレット名 |
| description | Test Portlet. | ポートレットの説明 |
| shortDescription | Test Portlet. | 短いポートレットの説明 |
3. xregファイルの編集
xregファイルはポートレット自身を定義するものです。
「ポートレット追加」画面や、ポートレットの「カスタマイズ」画面の表示、ポートレットの枠に表示されているボタン等はこのファイルで定義されています。Testポートレット用に書き換えを行ってください。ここでは特に重要で、かつ分かりにくい部分について説明します。
(プロジェクトルート)\portlets\test\webapp\WEB-INF\conf\test.xreg
以下の行でアクションのクラスを設定しています。
<parameter name="action" value="test.TestAction" hidden="true" cachedOnName="true" cachedOnValue="true"/>
以下の行でポートレットの基本のVelocityファイルを設定しています。Valueのtestとは、test.vmのことです。
<parameter name="template" value="test" hidden="true" cachedOnName="true" cachedOnValue="true"/>
