vaadin

介紹

我喜歡Vaadin的 （其中很多）一件事是它對(duì)Vaadin框架的“附加組件”社區(qū)-他們稱之為Vaadin目錄 。 “附加組件”是社區(qū)對(duì)框架的附加組件，可以是任何東西，例如從新的客戶端小部件到數(shù)據(jù)表的延遲加載容器。 我一定會(huì)為Activiti看到類似的東西！

Vaadin小部件基本上是預(yù)編譯的GWT小部件。 GWT窗口小部件本身是Java類，但是GWT編譯器將它們編譯為可在所有瀏覽器上使用的Javascript。 因此，當(dāng)您想在Vaadin Web應(yīng)用程序中使用某個(gè)附加組件（具有新的客戶端視覺(jué)效果）時(shí)，由于必須在Webapp中包含新的Javascript，因此您必須自己對(duì)其進(jìn)行編譯。

如果您使用的是Vaadin Eclipse插件 ，那么一切都會(huì)好起來(lái)的。 只需將加載項(xiàng)jar添加到您的項(xiàng)目中，插件即可自動(dòng)檢測(cè)并編譯新的小部件。 但是，當(dāng)您使用Maven構(gòu)建Web應(yīng)用程序時(shí)，并不是那么簡(jiǎn)單。 但是根本不需要扔掉Maven并手動(dòng)復(fù)制所有依賴項(xiàng)jar。 畢竟是2011年。

在我看來(lái)，在Maven中進(jìn)行GWT編譯的默認(rèn)方法效率不高。 因此，讓我指導(dǎo)您完成最適合我的設(shè)置，以及如何調(diào)整Maven pom.xml。
對(duì)于不耐煩的人：在github上查看源代碼： https : //github.com/jbarrez/vaadin-mvn-addon

使用Maven創(chuàng)建新的Vaadin Webapp

該步驟已被詳細(xì)記錄，只需檢查Vaadin Wiki 。
簡(jiǎn)短版本：使用以下原型：

mvn archetype:generate -DarchetypeGroupId=com.vaadin-DarchetypeArtifactId=vaadin-archetype-clean -DarchetypeVersion=6.5.6 -DgroupId=com.jorambarrez -DartifactId=vaadin-mvn-addon -Dversion=1.0 -Dpackaging=war

添加附加組件

在這個(gè)示例webapp中，我將使用兩個(gè)很酷的Vaadin附加組件：

• Paperstack ：一個(gè)允許將組件顯示為書(shū)頁(yè)的容器
• 刷新 ：客戶端組件，輪詢服務(wù)器以進(jìn)行UI更改

這兩個(gè)插件都有新的客戶端小部件，因此絕對(duì)需要通過(guò)GWT編譯器運(yùn)行。

調(diào)整pom.xml

打開(kāi)pom.xml。 原型已經(jīng)生成了使用自定義加載項(xiàng)所需的全部?jī)?nèi)容。 查找已注釋的部分，然后取消注釋。 這就是全部。

創(chuàng)建網(wǎng)絡(luò)應(yīng)用

以下Vaadin Webapp展示了這兩個(gè)組件的簡(jiǎn)單用法。 我們將只顯示“ Activiti”，并將每個(gè)字符顯示在Paperstack組件的新頁(yè)面上。 我們還有一個(gè)按鈕，它將使用Refresher組件和服務(wù)器端線程自動(dòng)翻動(dòng)頁(yè)面：

public class MyVaadinApplication extends Application {private static final String DISPLAYED_WORD = "ACTIVITI";private Window window;private Refresher refresher;private Button goButton;private PaperStack paperStack;@Overridepublic void init() {window = new Window("My Vaadin Application");setMainWindow(window);initGoButton();initPaperStack();}private void initGoButton() {goButton = new Button("Flip to the end");window.addComponent(goButton);goButton.addListener(new ClickListener() {public void buttonClick(ClickEvent event) {goButton.setEnabled(false);startRefresher();startPageFlipThread();}});}private void startRefresher() {refresher = new Refresher();window.addComponent(refresher);refresher.setRefreshInterval(100L);}private void startPageFlipThread() {Thread thread = new Thread(new Runnable() {public void run() {goButton.setEnabled(false);int nrOfUpdates = DISPLAYED_WORD.length() - 1;while (nrOfUpdates >= 0) {paperStack.navigate(true);nrOfUpdates--;try {Thread.sleep(2000L);} catch (InterruptedException e) {e.printStackTrace();}}// Remove refresher when done (for performance)goButton.setEnabled(true);window.removeComponent(refresher);refresher = null;}});thread.start();}private void initPaperStack() {paperStack = new PaperStack();window.addComponent(paperStack);for (int i=0; i<DISPLAYED_WORD.length(); i++) {VerticalLayout verticalLayout = new VerticalLayout();verticalLayout.setSizeFull();paperStack.addComponent(verticalLayout);// Quick-hack CSS since I'm to lazy to define a styles.cssLabel label = new Label("<div style=\"text-align:center;color:blue;font-weight:bold;font-size:100px;text-shadow: 5px 5px 0px #eee, 7px 7px 0px #707070;\">" + DISPLAYED_WORD.charAt(i) + "</div>", Label.CONTENT_XHTML);label.setWidth(100, Label.UNITS_PERCENTAGE);verticalLayout.addComponent(label);verticalLayout.setComponentAlignment(label, Alignment.MIDDLE_CENTER);}}

調(diào)整web.xml

為了使Vaadin了解自定義加載項(xiàng)，請(qǐng)?jiān)赩aadin Application Servlet中添加以下幾行：

<init-param><param-name>widgetset</param-name><param-value>com.jorambarrez.CustomWidgetset</param-value> </init-param>

另外，在包c(diǎn)om.jorambarrez（無(wú)論你已經(jīng)把在web.xml匹配）添加文件“CustomWidgetset.gwt.xml”。 只需復(fù)制以下幾行，而不必?fù)?dān)心將附加的GWT描述符放在那里（這是合乎邏輯的），Maven插件會(huì)在附加的jar中自動(dòng)找到它們。

<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE module PUBLIC"-//Google Inc.//DTD Google Web Toolkit 1.7.0//EN""http://google-web-toolkit.googlecode.com/svn/tags/1.7.0/distro-source/core/src/gwt-module.dtd"> <module><inherits name="com.vaadin.terminal.gwt.DefaultWidgetSet" /> </module>

運(yùn)行網(wǎng)絡(luò)應(yīng)用

轉(zhuǎn)到您的項(xiàng)目，并執(zhí)行以下命令：

mvn clean package jetty：run

這將啟動(dòng)Jetty網(wǎng)絡(luò)服務(wù)器并部署我們的Web應(yīng)用程序。 現(xiàn)在，您應(yīng)該可以使用webapp了。

問(wèn)題

運(yùn)行前面的命令時(shí)，您將看到GWT編譯器啟動(dòng)并編譯自定義窗口小部件。 問(wèn)題是，GWT編譯器確實(shí)花了一些時(shí)間來(lái)完成其魔術(shù)工作（在我的機(jī)器上為1.30分鐘，而僅啟動(dòng)Jetty則需要5秒）。

當(dāng)我想運(yùn)行我的應(yīng)用程序時(shí)，我不會(huì)坐下來(lái)看著GWT編譯器每隔一段時(shí)間就在我的加載項(xiàng)上撒上小精靈。 當(dāng)然， JRebel可以在這里提供很多幫助，但是絕對(duì)不必每次都編譯我的小部件 。 畢竟，我完全不會(huì)更改這些附加組件。

調(diào)整pom.xml（續(xù)集）

因此，我們剛剛了解到，Vaadin原型生成的默認(rèn)pom.xml在加載項(xiàng)方面并不友好。 如果您查看GWT編譯器插件的配置，您會(huì)注意到已編譯的窗口小部件將添加到目標(biāo)文件夾中，而不是添加到項(xiàng)目源中：

<webappDirectory> $ {project.build.directory} / $ {project.build.finalName} / VAADIN / widgetsets </ webappDirectory>

如果將其更改為源文件夾：

<webappDirectory> src / main / webapp / VAADIN / widgetsets </ webappDirectory>

GWT編譯的結(jié)果放在我的webapp的源代碼中。 這也意味著我可以將它們與我的Webapp的其余部分一起簽入。

現(xiàn)在我們唯一需要做的就是確保我們不會(huì)在每次運(yùn)行時(shí)都重新編譯小部件。 我選擇將其簡(jiǎn)單地放入配置文件中，如下所示：

<profiles><profile><id>compile-widgetset</id><build><plugins><plugin><groupId>org.codehaus.mojo</groupId><artifactId>gwt-maven-plugin</artifactId>....

現(xiàn)在，無(wú)論何時(shí)將新的附件添加到項(xiàng)目中，我現(xiàn)在都運(yùn)行以下命令：

mvn -Pcompile-widgetset干凈編譯

它將編譯所有加載項(xiàng)，并將結(jié)果放入我的源文件夾中。 現(xiàn)在，如上所示運(yùn)行Jetty網(wǎng)絡(luò)服務(wù)器，現(xiàn)在只需將這些源復(fù)制到war文件中，即可將啟動(dòng)時(shí)間再次減少至最少（此處為5秒）。

資源

以上步驟中所述的整個(gè)Web應(yīng)用程序可在GitHub上完全使用： https : //github.com/jbarrez/vaadin-mvn-addon

結(jié)論

在Maven中使用加載項(xiàng)并不難，所有這些都有據(jù)可查（如Vaadin中的所有內(nèi)容）。 但是，Maven原型生成的Maven配置效率不高，因?yàn)樗鼤?huì)在每次運(yùn)行時(shí)重新編譯附加窗口小部件。 上面的步驟顯示了如何調(diào)整配置，使其更適合真正的快速開(kāi)發(fā)！

歡迎任何意見(jiàn)或改進(jìn)！

參考： 如何：我們的JCG合作伙伴 Joram Barrez的 Vaadin插件和Maven在“ 大腳小步”博客上

相關(guān)文章 ：

• 將Maven與Ivy集成
• OSGi將Maven與Equinox結(jié)合使用
• Java模塊化方法–模塊，模塊，模塊
• GWT EJB3 Maven JBoss 5.1集成教程
• 建立自己的GWT Spring Maven原型
• Java教程和Android教程列表

翻譯自: https://www.javacodegeeks.com/2011/10/vaadin-add-ons-and-maven.html

vaadin

總結(jié)

以上是生活随笔為你收集整理的vaadin_Vaadin附加组件和Maven的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。