Вступление
Одна из многих вещей, которые мне нравятся в Vaadin , это его сообщество «дополнений» к структуре Vaadin — то, что они называют Vaadin Directory . «Надстройка» является дополнением сообщества к платформе и может представлять собой что угодно, например, от нового виджета на стороне клиента до загрузочного контейнера Lazy для таблицы данных. Нечто подобное я бы определенно хотел увидеть для Activiti!
Виджеты Vaadin — это в основном предкомпилированные виджеты GWT. Виджеты GWT сами по себе являются классами Java, но компилятор GWT компилирует их в Javascript, который работает во всех браузерах. Поэтому, если вы хотите использовать определенное дополнение (с новыми визуальными элементами на стороне клиента) в своем веб-приложении Vaadin, вам придется скомпилировать их самостоятельно, поскольку вы должны включить новый Javascript в свое веб-приложение.
Если вы используете плагин Vaadin Eclipse , все в порядке. Просто добавьте дополнительный jar в ваш проект, и плагин автоматически обнаружит и скомпилирует новые виджеты. Однако, когда ваше веб-приложение построено с использованием Maven, это не так просто. Но выбрасывать Maven и вручную копировать все ваши банки зависимостей совсем не обязательно. В конце концов, это 2011 год.
Способ компиляции GWT в Maven по умолчанию, на мой взгляд, неэффективен. Итак, позвольте мне рассказать вам, какие настройки работают лучше для меня и как я настроил Maven pom.xml. 
Для нетерпеливых: проверьте источник на github: https://github.com/jbarrez/vaadin-mvn-addon
Создание нового веб-приложения Vaadin с Maven
Этот шаг хорошо документирован, просто проверьте вики Vaadin .
Краткая версия: используйте следующий архетип:
|
1
|
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 |
Добавить дополнение
В этом примере веб-приложения я собираюсь использовать две классные надстройки Vaadin:
- Paperstack : контейнер, который позволяет отображать компоненты в виде страниц книги
- Обновление : клиентский компонент, который опрашивает сервер на предмет изменений пользовательского интерфейса
Оба дополнения имеют новые виджеты на стороне клиента, поэтому запуск компилятора GWT определенно необходим.
Твик pom.xml
Откройте файл pom.xml. Архетип уже сгенерировал все, что вам нужно для работы с пользовательскими надстройками. Ищите закомментированные разделы и просто раскомментируйте их. Это все, что есть.
Создать веб-приложение
В следующем веб-приложении Vaadin показано простое использование этих двух компонентов. Мы просто отобразим «Activiti» с каждым символом на новой странице компонента стека. У нас также есть кнопка, которая будет автоматически пролистывать страницы с помощью компонента Refresher и потока на стороне сервера:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
|
public class MyVaadinApplication extends Application { private static final String DISPLAYED_WORD = "ACTIVITI"; private Window window; private Refresher refresher; private Button goButton; private PaperStack paperStack; @Override public 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.css Label 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); } } |
Твик web.xml
Чтобы Vaadin знал о пользовательских надстройках, добавьте следующие строки в прикладной сервлет Vaadin:
|
1
2
3
4
|
<init-param> <param-name>widgetset</param-name> <param-value>com.jorambarrez.CustomWidgetset</param-value></init-param> |
Также добавьте файл ‘CustomWidgetset.gwt.xml’ в пакет com.jorambarrez (соответствующий тому, что вы положили в web.xml) . Просто скопируйте следующие строки, и не беспокойтесь о размещении там дескрипторов GWT надстройки (что было бы логично), плагины maven автоматически найдут их в банках надстроек.
|
1
2
3
4
5
6
7
|
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE module PUBLIC "-//Google Inc.//DTD Google Web Toolkit 1.7.0//EN"<module> <inherits name="com.vaadin.terminal.gwt.DefaultWidgetSet" /></module> |
Запустите веб-приложение
Перейдите в свой проект и выполните следующую команду:
мвн чистый пакет причал: запустить
Это запускает веб-сервер Jetty и развертывает наше веб-приложение. Теперь вы сможете поиграть с веб-приложением.
Эта проблема
При выполнении предыдущей команды вы увидите, что компилятор GWT запускает и компилирует пользовательский виджет. Проблема в том, что компилятор GWT тратит свое время на магию (1,30 минуты на моей машине, а простой запуск Jetty занимает 5 секунд).
Я не собираюсь сидеть и смотреть, как компилятор GWT разбрасывает пыльцу пикси поверх моих надстроек каждый раз, когда я хочу запустить свое приложение. Конечно, JRebel мог бы сильно помочь здесь, но совершенно определенно не обязательно, чтобы мои виджеты компилировались каждый раз . В конце концов, я вообще не меняю эти дополнения, верно.
Тонкая настройка pom.xml (продолжение)
Итак, мы только что узнали, что pom.xml по умолчанию, сгенерированный архетипом Vaadin, не подходит для надстроек. Если вы посмотрите на конфигурацию плагина компилятора GWT, вы заметите, что скомпилированные виджеты добавляются в целевую папку, а не в источники вашего проекта:
<WebappDirectory> $ {project.build.directory} / $ {project.build.finalName} / Vaadin / widgetsets </ webappDirectory>
Если мы изменим это в нашу исходную папку:
<WebappDirectory> SRC / Основной / WebApp / Vaadin / widgetsets </ webappDirectory>
Результат компиляции GWT помещен в исходный текст моего веб-приложения. Это также означает, что я могу просто проверить их вместе с остальной частью моего веб-приложения.
Единственное, что нам теперь нужно сделать, это убедиться, что мы не перекомпилируем виджеты при каждом запуске. Я решил просто поместить его в профиль следующим образом:
|
1
2
3
4
5
6
7
8
9
|
<profiles> <profile> <id>compile-widgetset</id> <build> <plugins> <plugin> <groupId>org.codehaus.mojo</groupId> <artifactId>gwt-maven-plugin</artifactId> .... |
Каждый раз, когда я добавляю новую надстройку в проект, я запускаю следующую команду:
mvn -Pcompile-widgetset clean compile
и он скомпилирует все дополнения и поместит результат в мои исходные папки. Запустив веб-сервер Jetty, как показано выше, теперь просто скопируйте эти источники в файл war, и время загрузки снова уменьшится до минимума (5 секунд здесь).
Источник
Все веб-приложение, как описано в приведенных выше шагах, полностью доступно на GitHub: https://github.com/jbarrez/vaadin-mvn-addon
Вывод
Использование дополнений в Maven не так сложно, все это хорошо документировано (как и все в Vaadin). Однако архетип Maven создает конфигурацию Maven, которая не столь эффективна, поскольку он перекомпилирует дополнительные виджеты при каждом запуске. Вышеуказанные шаги показывают, как настроить конфигурацию, чтобы сделать ее более подходящей для реального быстрого развития!
Любые комментарии или улучшения приветствуются, конечно!
Ссылка: Как: дополнения Vaadin и Maven от нашего партнера JCG Джорама Барреса в блоге « Маленькие шаги с большими ногами»
Статьи по Теме :