Important Notice - Forums is archived

To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Product icon

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.

Building UI's at Run-time

Chris Lapes
7 years ago Jun 16, 2015 1:14pm
Enver Haase
7 years ago Jun 17, 2015 4:27pm

While Vaadin views *can* be created in a declarative fashion (please also see the new Vaadin Designer, vaadin.com/designer) it is quite usual (the "normal way") to create views programmatically, so why not from layouts stored in a database.

Just generate the Vaadin7 sample project in Eclipse Luna with the Vaadin plugin, and change it
slightly like the below code.

To simulate your use case I use plain reflection here -- note that the "com.vaadin.ui.Button"
class name can be read from the database, or can be calculated from something read from
the database.
The same applies to the caption string.
Finally, if you have scripted logic then I assume you have an execution engine that "does
the right thing".
In this case I made the application check for the type of the dynamically created component,
and if it is a button, add the behavior of what should happen when being clicked.
Here your execution engine can run the script downloaded from the database.
If needed, you can also manipulate other objects on the view - for example, buttons have click() methods to programmatically simulate a user click. And of course, you can iterate containers to find out what objects are there in the dynamic fashion you need.

I have not worked with Sencha GXT so I cannot help you there.

Object o = null;
        try {
            o = Class.forName("com.vaadin.ui.Button").newInstance();
        } catch (InstantiationException | IllegalAccessException
                | ClassNotFoundException e) {
            // TODO Auto-generated catch block
        Component component = (Component) o;
        component.setCaption("string from database");

        if (component instanceof Button){
            Button button = (Button) component;
            button.addClickListener(new Button.ClickListener() {
                public void buttonClick(ClickEvent event) {



Chris Lapes
7 years ago Jun 26, 2015 3:45pm
Claudio Crociati
7 years ago Jun 26, 2015 10:01pm
Ladislav Jech
5 years ago Aug 24, 2017 3:44pm
tonkp haha
5 years ago Sep 19, 2017 5:27am
Alejandro Duarte
5 years ago Dec 15, 2017 10:57am