本文轉自：http://idempiere_guide_xb.mydoc.io/?t=216602
主題相關：http://wiki.idempiere.org/en/Add_your_theme
zk開發一個主題項目http://wiki.idempiere.org/en/Developing_Plug-Ins_-_WebUI_Themes
zk開發一個主題項目
文件位置
zk web的主題文件位置：源碼：org.adempiere.ui.zk/theme/ 非源碼：\idempiere-server\plugins\org.adempiere.ui.zk_3.1.0.v20160311-0602\theme\
---theme---default（默認主題），該目錄下結構如下圖：
製作主題
直接修改default主題 ● 拷貝default目錄所有文件到新目錄，作爲新主題目錄（比如busninessteam） ● 修改佈局和素材，如下圖
修改主題
修改別人製作的主題 ● 拷貝，解壓縮jar文件到相應目錄，只拷貝theme目錄（比如busninessteam）到default目錄平行位置。 ● 修改佈局和素材。
主題發佈
-
開發環境：1.1 新建 fragment project，使用 org.adempiere.ui.zk 作爲一個host plugin1.2 該項目的根目錄，即爲1.2的主題結構和文件，含busninessteam/css | images | zul等。1.3 Eclipse中，複製server.product的啓動配置參數，新增-DZK_THEME=busninessteam，新增該主題項目到你的工作區插件列表1.4 測試調整成功後，前臺使用system用戶登錄，進入system configuration（系統配置），設置ZK_THEME=busninessteam，刷新瀏覽器。
-
已編譯環境2.1 前臺使用system用戶登錄，進入system configuration（系統配置），設置ZK_THEME=busninessteam，刷新瀏覽器。
主題開發
1、eclipse下創建2個項目，一個官方版本項目（比如ad380），一個自定義項目（比如myXyz，依賴前者，fork源碼https://github.com/mckayERP/template）。2、在第一個項目的工作空間，新增forked的代碼。3、修改utils_dev/buildCustomization.properties指向實際的路徑。4、重點開始了，自定義zk webui。5、刪除zkwebui文件夾下的所有東西，除了保留build_custom.xml文件。6、拷貝ad380項目中的zkwebui所有東西，記得不要覆蓋build_custom.xml。7、刪除zkwebui/WEB-INF/src源碼樹，只留下你想要修改的文件。8、myXyz只有一個自定義文件--LoginPanel.java，只是簡單修改了組件“login header”的Title爲“我的定製成功了！”9、eclipse的tools/lauchers中，修改myXyz的啓動器爲正確的名字，比如myXyz ZK（待測試，我沒有環境） 10、啓動myXyz ZK，這將從ad380項目中拷貝所有需要的類到myXyz項目。11、依賴Adempiere的版本，你需要手動修改utils_dev/build.xml文件，最後刷新項目文件。12、如果你自定義zk webui，新增一個服務器，並將這個模版項目加入到這個服務器。在服務器啓動器上，類路徑需要包含如下：C:/dev/apache/tomcat-6.0/bin/bootstrap.jar （由於iDempiere已經變成jetty，這裏需要修改）adempiereTrunk/tools/lib/jnlp.jar（修改成ad380，你的項目名稱）adempiereTrunk/tools/lib/javaee.jaradempiereTrunk/tools/lib/jcommon-1.0.18.jaradempiereTrunk/tools/lib/jfreechart-1.0.15.jaradempiereTrunk/tools/lib/log4j.jaradempiereTrunk/JasperReportsTools/lib/jasperreports-5.1.0.jaradempiereTrunk/tools/lib/c3p0-0.9.1.2.jaradempiereTrunk/tools/lib/iText-2.1.7.jaradempiereTrunk/tools/lib/poi-3.9-20121203.jaradempiereTrunk/lib/postgresql.jaradempiereTrunk/tools/lib/commons-net-1.4.0.jaradempiereTrunk/tools/lib/commons-collections-3.1.jaradempiereTrunk/tools/lib/barbecue-1.5-beta1.jar13、這些是啓動器的缺省文件，你需要指向你自己的ad380項目名稱。14、開始測試啦。15、比較Ad380和myXyz的根目錄下的build.xml（或其他build*.xml文件），修改並增加自定義類。（不懂細節，截圖2張）16、如果你啓動服務器，你就可以看到zk文件的變化。（重啓才能看到更新）17、導出自定義jar文件。18、服務器啓動時已經構建了自定義jar文件，本例中，這2個文件（customization.jar 、 zkcustomization.jar）已經添加到庫目錄中。19、直接安裝（RUN_Setup）就可以看到變化了。
index.zul
佈局文件：所有佈局文件都在theme/zul目錄下，所有java類都在/org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui目錄下。
index.zul: 主題定義: /org.adempiere.ui.zk/theme.zsjava定義：/org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/AdempiereWebUI.java
desktop.zul
佈局定義：org.adempiere.ui.zk/theme/default/zul/desktop/java定義：org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/desktop/DefaultDesktop.java，關鍵代碼如下：
Center windowArea = layout.getCenter();
windowContainer.createPart(windowArea);
homeTab = new Tabpanel();
windowContainer.addWindow(homeTab, Util.cleanAmp(Msg.getMsg(Env.getCtx(), "Home")), false, null);
homeTab.getLinkedTab().setSclass("desktop-hometab");
((Tab)homeTab.getLinkedTab()).setDisableDraggDrop(true);
homeTab.setSclass("desktop-home-tabpanel");
BusyDialog busyDialog = new BusyDialog();
busyDialog.setShadow(false);
homeTab.appendChild(busyDialog);ADTabpanel.java
ADTabpanel（一個adtab-content）主窗口區的tab面板，佈局文件desktop.zul。java代碼：/org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/adwindow/ADTabpanel.java
FedexLabelWindow
這是一個自定義的打印快遞標籤的窗口例子。java代碼：/org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/PrintLabelApplet.java，關鍵代碼如下：
public LabelAppletWindow(List<byte[]> list)
{
super();
Div div = new Div();
appendChild(div);
Applet applet = new Applet();
applet.setCode("PrintLabelApplet.class");
applet.setArchive("labelapplet.jar");
ZKUpdateUtil.setWidth(applet, "0");
ZKUpdateUtil.setHeight(applet, "0");
applet.setParam("size", list.size() + "");
for(int i = 0; i < list.size(); i++)
{
try
{
MArchive archive = new MArchive(Env.getCtx(), 0, null);
archive.setName("file_" + i);
archive.setBinaryData(list.get(i));
archive.saveEx();
applet.setParam("file_" + i, archive.getAD_Archive_ID() + "");
if (log.isLoggable(Level.INFO))
log.info("file_" + i + "=" + archive.getAD_Archive_ID());
} catch (Exception e) {
e.printStackTrace();
}
}
div.appendChild(applet);
ToolBarButton link = new ToolBarButton();
link.setLabel("Click here to close this popup after printing is completed.");
link.addEventListener(Events.ON_CLICK, this);
appendChild(link);
this.setBorder("normal");
}UPSHtmlLabelWindow
這也是一個自定義的打印快遞標籤的窗口例子。java代碼：/org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/UPSHtmlLabelWindow.java