Docs

Docs

Adding Legacy Components to Flow layouts

At this stage, you have everything you need to make a Vaadin 7 or 8 application to run inside a Flow application. Since this is a Flow application, you can add Flow components to the layout alongside the legacy components. You can also create legacy components and add them, dynamically. Below is an example of this:

add(new com.vaadin.flow.component.html.NativeButton(
        "Flow button that adds a FW7 Label", e -> {
            add(new LegacyWrapper(
                    new com.vaadin.ui.Label("Legacy label")));
        }));
add(new LegacyWrapper(new com.vaadin.ui.NativeButton(
        "Legacy button that adds a Flow Label", e -> {
            add(new com.vaadin.flow.component.html.Label("Flow label"));
        })));

Fully qualified names were used in this example to make it clear which class comes from which framework.

See the Adding Legacy Components in a Flow Layout tutorial for more details.

Adding New Views

New views added to the application should follow Flow’s routing system. In Flow, "Views" are called "RouteTargets" and are managed primarily by the @Route annotation. For details on the differences in navigation between Flow and previous Vaadin versions, see the Upgrading Guide.

For more information about Flow’s navigation mechanism, see Routing and Navigation.

Production Mode

After your application is built and it’s running with MPR, you should consider packaging it for production. See the Setting Up Production Mode tutorial for details.

E954A5AC-5915-46A4-A2C4-08E9A2F229A1