I’ve started to build a new UI with Vaadin for an existing Spring MVC application. I read the book of Vaadin and lots of articles here in the forum but I have still have problems to “find the right way”. My basic problem is how to convert the old page centric design to the one-window-Vaadin design.
My first idea was to create one Window class per old page. But with this approach I saw, that I couldn’t replace the main window without a browser refresh or opening a new browser window.
So here are my questions:
how do you design your real world applications? Do you use Windows or Panels as “Pages” or do you wrap your pages into Views and switch between them?
If you use Views and one Main Window: do you link all your callbacks into this one main window?
Important thing is not to try to simulate page flows with Vaadin - as this is not a page oriented framework.
You should think the UI as a set of components - each implementing its own “view” to some functionality or data in the system. Then put the components together in a way that make user use-cases natural and usable.
CustomComponent is your best friend when implementing the UI functionality. Extend it to create functional pieces.
Using windows to simulate web pages not a good idea - do not try it
Designing navigation depends from application to application. For one example and practice, take a look at
Navigator add-on .
In the meantime, I found out myself, that Windows won’t help me a lot. So far, I’m descending my components from HorizontalLayout or VerticalLayout. I will definetely look at the CustomComponent.
I think the Navigator add-on is a must for my application, because I need to access different “pages” resp. “views” from outside (via link).
As a programmer I learn best from examples. Do you have some more source code examples at hand? Or do you know open source projects using vaadin?
There are quite a few open source projects using Vaadin.
One list I know is at
https://www.masterbranch.com/vaadin-projects . It also contains many non-Vaadin projects, though - I guess it is automatically generated based on some keyword search.