日記

■[gwt] SmartGWTを使ってみたメモ

最近、GWTでいろいろおもちゃを作ってます。

JavaでJavaScriptが書けるところ(表現おかしい？)が、JavaScript嫌いの私の心を掴んで離しません。

で、最初は素のGWTをそのまま使っていたんですが、やってるうちに色々と欲が出てきました。

• ドラッグアンドドロップってどうやるんだっけ？
• Color Pickerとかないんだっけ？

とか。最初は自分で実装しようかと考えましたが、あまりにも車輪なので、ライブラリを使うことにしました。

ライブラリは以前、Ext GWTとSmart GWTの比較を見てたので、以下の理由でSmartGWTに決めました。

1. 誰にも1銭も払いたくない。
2. 自分のコードは恥ずかしくて誰にも見せたくない。

つまり、LGPLなSmart GWTなわけです。安易ですみません。

インストール

1. smartgwt - Smart GWT - GWT API's for SmartClient - Google Project Hosting からダウンロード。
2. 解凍。
3. smartgwt.jarを取り出し、クラスパスを通す。

ちなみに、2010/03/23時点の最新バージョンは2.1です。

使い方

"myproject"とかは自分のアプリの設定で適当に置き換えてください。

myproject.gwt.xmlに以下を追記

<inherits name=”com.smartgwt.SmartGwtNoScript”/>
<inherits name="com.smartclient.theme.enterprise.EnterpriseResources"/>

myproject.htmlに以下を追記

<script> var isomorphicDir = "myproject/sc/"; </script>

<script type="text/javascript" src="myproject/sc/initsc.js"/>
<script type="text/javascript" src="myproject/sc/modules/ISC_Core.js"/>
<script type="text/javascript" src="myproject/sc/modules/ISC_Foundation.js"/>
<script type="text/javascript" src="myproject/sc/modules/ISC_Containers.js"/>
<script type="text/javascript" src="myproject/sc/modules/ISC_Grids.js"/>
<script type="text/javascript" src="myproject/sc/modules/ISC_Forms.js"/>
<script type="text/javascript" src="myproject/sc/modules/ISC_RichTextEditor.js"/>
<script type="text/javascript" src="myproject/sc/modules/ISC_Calendar.js"/>
<script type="text/javascript" src="myproject/sc/modules/ISC_DataBinding.js"/>

<script>var currentSkin = "Enterprise";</script>
<script type="text/javascript">document.write("<"+"script src=myproject/sc/skins/" + currentSkin + "/load_skin.js?isc_version=7.0beta.js><"+"/script>");</script>

xmlとhtmlに記述されている"Enterprise"というのは、UIのテーマの名称で、

smartgwt.jar内にはEnterprise,EnterpriseBlue,Graphiteという名称のテーマがあります。

使用する際にはmyproject.gwt.xmlにはそれぞれ、

• com.smartclient.theme.enterprise.EnterpriseResources
• com.smartclient.theme.enterpriseblue.EnterpriseBlueResources
• com.smartclient.theme.graphite.GraphiteResources

を記述しておけばいいです。また、smartgwt-2.1.zipに同梱されているsmartgwt-skins.jarには

• com.smartclient.theme.blackops.BlackOpsResources
• com.smartclient.theme.fleet.FleetResouces
• com.smartclient.theme.silverwave.SilverWaveResources
• com.smartclient.theme.treefrog.TreeFrogResources

の４種類のテーマが入っています。

あとは、GWTのソースコードを書くだけ。がんばって書いてください。

私の場合、コーディングするときは

1. Showcaseのデモとコードhttp://www.smartclient.com/smartgwt/showcase/
2. JavaDoc
3. com/smartclient/debug/public/sc/の下にあるJavascriptコード

あたりをよく見ます。というか、これ以外はほとんど見るものがありません。

特に日本語の情報がないのがつらいですね。

使ってみた感想

JavaScript嫌いな私ですが、「SmartGWTはSmartClientのラッパー」という性質上JavaScriptを読まずにコーディングするというのは無理なようです。

あと、コンポーネントを拡張するときなどはJSNIも結構使います。

よくあるパターンとしては

1. ○○な機能がほしいなぁ。
2. でも、JavaDoc見る限りはそんなAPIないみたい。あきらめるか・・・
3. あ、でもよく見るとSmartClient自体は○○な機能が実装されてる！ラッパーが対応してないだけか！！
4. じゃ、JSNI書くか。。。

みたいな。

私の場合は、DnDでタブのソートがしたかったのですが、Javaのほうには実装されてなくて、仕方なくJavaScriptに対応したクラス/メソッドを作って対応したりしました。

難しい機能を求めるなら拡張しやすいExt GWTのほうがよさそう。ま、Ext GWTは使ったことないですけど。

JavaScriptが読み/書きしたくないのでGWT選んだのにSmartGWTを使うと読み書きせざるを得ないという残念な状況に陥ってしまい、今後どうしようかと考えてます。

人柱的にこれからも使うつもりですが、別のものも試してみようかな、と考え中です。

2010/05/11 追記

myproject.htmlとmyproject.gwt.xmlの記述内容が間違っていて、そのままでは動作しませんでしたので、修正しました。