Moving to Vaadin 7 involves migrating from Vaadin 6 to take advantage of new features in Vaadin 7 including a new windowing API, improved field groups and converters, and SASS based themes. The migration involves updating dependencies to Vaadin 7, replacing the Application and Window classes with the UI class, and converting themes to use SASS. Many APIs are backwards compatible but some changes like separate presentation of field groups and converters may require updates to code. The Vaadin documentation provides guides on migration and information on new features in Vaadin 7.
3. Vaadin 7 in brief for migration
First new major version since 2009,
1.5 years in development
In addition to new features, reworking
(and breaking) some old APIs
Most APIs backwards compatible -
some since 2002
4. Major features in Vaadin 7 for
migration
New windowing API
New FieldGroups and Converters
for easier and more flexible forms
New packaging (including GWT)
5. ... and some more
SASS based themes
Simplified extending and widget
development
Much, much more - see
https://vaadin.com/vaadin7
9. UI Instead of Application and
Window
import com.vaadin.Application;
import com.vaadin.ui.*;
public class V6Application extends Application
{
@Override
public void init() {
Window mainWindow = new Window("V6");
Label label = new Label("Hello!");
mainWindow.addComponent(label);
setMainWindow(mainWindow);
setTheme(âmythemeâ);
} import com.vaadin.server.*;
} import com.vaadin.ui.*;
@Theme("mytheme")
@PreserveOnRefresh
public class V7UI extends UI {
@Override
protected void init(VaadinRequest request) {
VerticalLayout view = new VerticalLayout();
view.addComponent(new Label("Hello!"));
setContent(view);
}
}
10. First steps
Update dependencies
public class
V6Application
extends
UI replacing Application and Application
Window public class V7UI
extends UI
@Theme("mytheme")
Update theme
styles.scss:
import "../reindeer/legacy-styles.css"
14. Navigation and built-in multi-
tab support
@PreserveOnRefresh
public class NavigationtestUI extends UI {
@Override
public void init(VaadinRequest request) {
// Create Navigator, use the UI content layout to display the views
Navigator navigator = new Navigator( this, this);
// Add some Views
// Could also use a ViewProvider
navigator.addView(MainView.NAME, new MainView()); // no fragment
// #count will be a new instance each time we navigate to it, counts:
navigator.addView(CountView.NAME, CountView. class);
// The Navigator attached to the UI will automatically navigate to the
// initial fragment once the UI has been initialized.
}
}
http://server/test#!count/params
15. Theming with SASS
SCSS compiled to CSS
Variables, nesting, mix-ins, ...
Composite themes, multiple themes on a
page, theme by component etc.
17. Client side widgets
Easier to develop
Layouting and client-server communication
rewritten - RPC, shared state, ...
GWT included in Vaadin
18. Add-ons and Widgetsets
Inherit com.vaadin.DefaultWidgetSet
Most/all add-ons need to be updated for
Vaadin 7
Currently 135 Vaadin 7 compatible add-ons:
http://vaadin.com/directory#:vaadin=7
19. Extending servlets
Both applications and add-ons can customize
start-up page without servlet subclass
@JavaScript on components to inject
JavaScript
UIProvider, VaadinServletSession,
VaadinSession, VaadinService etc. reduce
the need to subclass servlets
20. For more information
What's new
https://vaadin.com/vaadin7
Vaadin 7 tutorials
https://vaadin.com/wiki/-/wiki/Main/Vaadin+7
Migration guide
https://vaadin.com/wiki/-
/wiki/Main/Migrating+from+Vaadin+6+to+Va
adin+7