EasyJWeb 1.1快速體驗－ExtJS without javascript

新年剛過，EasyJWeb釋出了1.1版本，該個版本主要於EasyJWeb的Ajax支援功能進行了加強，並在 EasyJWeb 擴充套件專案中提供一套Rich Component實現，同時對上一版本中存在的一些Bug及網友們提的一些功能進行完善及改進。

　　由於之前用ExtJS做了幾個專案，並且給大家開源了一個wlr.easyjf.com，而大峽同學盡然把我提供的wlr.easyjf.com開源版本用java重寫了一遍，讓我費盡心思寫的那些javascript效果都消失了，感到驚歎的同時又有點可惜。

　　對於很多正在為學ExtJS的朋友們來說，EasyJWeb 1.1的推出可以算是一個非常好的訊息，只需要寫java程式碼，就能給你的Java EE應用穿上豔麗的ExtJS外套。想起Rod的“J2EE　without EJB”，我發現用“Ext without javascript”來形容EasyJWeb 1.1中的Rich Componet非常適合。

　　廢話不多說，下面讓我們直接進入EasyJWeb 1.1的快速體驗吧。

下載EasyJWeb 1.1，地址：

easyjweb-1.1.zip 22.0M 有依賴包
easyjweb-1.1-without-dependencies.zip 5.42M 無依賴包

2、解壓下載的檔案，切換進命令進入EasyJWeb1.1主目錄的bin目錄，如下圖所示：
3、執行easyjweb project d:/test/demo –extjs，將會在d:/test/demo中生成一個空的專案。
4、在Eclipse中匯入剛才用命令建立的demo專案。
5、在myapp.action中新增一個SimpleAction，繼承RichComponetAction
6、新增一個方法doGrid，程式碼如下：
public Page doGrid() {
ViewPort view = new ViewPort();
GridPanel grid = new GridPanel("grid", "資料表格",500,100);
grid.setColumns(new String[]{"id","姓名","出生日期","email"});
view.add(grid);
this.addComponent(view);
return componentPage;
}
7、然後使用命令列切換到d:/test/demo/bin 目錄，輸入easyjweb war
8、把生成的demo.war檔案拷到tomcat的webapps目錄，啟動tomcat。
9、使用http://localhost:8080/mini/simple.ejf?cmd=grid，可以看到如下圖所示的效果。
10、在SimpleAction中加入一個doTree方法，程式碼如下：
public Page doTree() {
ViewPort view = new ViewPort();
TreePanel tree=new TreePanel("tree","簡單的樹",200);
TreeNode root=new TreeNode("root","根");
root.add(new TreeNode("c1","孩子1"));
root.add(new TreeNode("c2","孩子2"));
root.getChildNodes().get(1).add(new TreeNode("c3","孫子"));
tree.setRoot(root);
view.add(tree);
this.addComponent(view);
return componentPage;
}
11、重複第7步重新打包專案，再發布，執行，輸入http://localhost:8080/mini/simple.ejf?cmd=tree。不出意外的話可以看到如下圖所示的效果：

　　怎麼樣，不用寫一句javascript，只需要在Action簡單的建立幾個Rich Componet，然後即可讓客戶端瀏覽到漂亮的Ext介面。

　　不用寫javascript就能讓應用有豔麗的外觀，這對我們搞java開發的來說確實是一個福音，看了一下原始碼，發現這一版本的Rich Componet整合還不夠完善，問了大峽說還在改進之中，不過感覺已經非常好用了，希望有興趣的朋友們一起來完善。

　　有興趣可以參考http://wlr2.easyjf.com/直接用java就能寫出漂亮的基於ExtJS等客戶端框架的Ajax應用。