PR

WebUIのデバッグ方法と新規追加

2011年6月24日(金)
久保田 大輔

新しくWebUIを追加する方法

次に、新しくWebUIを追加する方法について説明します。

Adempiereにはアプリケーションサーバーを起動するとアクセスできるURLがいくつかあり、それらのファイルはソースコード上では、複数のフォルダに分かれています。

例えば、サーバー名がcomputer1だったとすると、

  • http://computer1/admin/ はserverRootフォルダ(アプリケーションサーバーのトップページ)
  • http://computer1/webui/ はzkwebuiフォルダ(zkのWebUI)
  • http://computer1/adempiere/ はserverAppsフォルダ(HTML版のWebUI)

のようになっています。

Adempiereには、JavaクライアントのUIと、zkというオープンソースのフレームワークを使ったWebUIがあります。zkのWebUIは、後から加えられる形で開発されました。

今回は新しくWebUIを追加する準備段階の、URLのパスを追加する方法を説明します。この方法で機能を実装すれば、HTML5版のUIやmobile版のUIを作ることができます。
この記事では、http://computer1/html5/ というURLにダミーの開始ページを作成してみます。

新しくWebUIを追加する方法

まず、Adempiereプロジェクトのフォルダにhtml5というフォルダを作成します。

図6:「html5フォルダ」を作成する(クリックで拡大)

html5フォルダには、

  • index.htmlファイル
  • build.xmlファイル
  • WEB-INFフォルダ
  • META-INFフォルダ

を作成します。

index.htmlの作成

html5フォルダの中にindex.htmlを作成してください。

index.htmlの中身は以下のようにしてください。

<!DOCTYPE html>
<html>
  <head>
  <meta charset="UTF-8">
  <title>HTML5サンプル</title>
  </head>
  <body>
  <article>
  <header>
  <h1>HTML5のページ</h1>
  </header>
  <p>これはHTML5のページです。</p>
  </article>
  </body>
</html>

index.htmlをUTF-8で保存してください。

build.xmlの作成

次にbuild.xmlを作成します。build.xmlは、zkwebuiのbuild.xmlをコピーして修正します。

zkwebuiフォルダのbuild.xmlをhtml5フォルダコピーして、以下の修正をしてください。
修正は3箇所です。

6行目

18行目

81行目、82行目
WEB-INF/lib/*-sources.jar,
**/test.zul"
→ WEB-INF/lib/*-sources.jar"

コメント部分の修正も含めた差分は以下の通りです。

## 開始 ##
  3c3
  < <!-- Zk Ajax UI (Web UI)                               -->
  ---
  > <!-- HTML5 Template Sample                               -->
  6c6
  < <project name="ZkWebUI" default="war" basedir=".">
  ---
  > <project name="HTML5" default="war" basedir=".">
  8c8
  < 	    This buildfile is used to build the Zk WebUI client.
  ---
  > 	    This buildfile is used to build the HTML5 Sample.
  18c18
  < 	<property name="war.name"	value="webui"/>
  ---
  > 	<property name="war.name"	value="html5"/>
  64c64
  < 		<echo message="=========== Build Zk Ajax UI ==========="/>
  ---
  > 		<echo message="=========== Build HTML5 Web UI ==========="/>
  81,82c81
  < 		      										WEB-INF/lib/*-sources.jar,
  < 		      										**/test.zul"
  ---
  > 		      										WEB-INF/lib/*-sources.jar"
  ## 終了 ##

adempiere.jp

連載バックナンバー

Think IT会員サービス無料登録受付中

Think ITでは、より付加価値の高いコンテンツを会員サービスとして提供しています。会員登録を済ませてThink ITのWebサイトにログインすることでさまざまな限定特典を入手できるようになります。

Think IT会員サービスの概要とメリットをチェック

他にもこの記事が読まれています