Vaadin with CDI

Todays post will show a mini tutorial on how to use CDI with the current Vaadin version (7.1.8). To keep it simple, I will just extend the official Vaadin-HelloWorld-Program a bit.

The normal Non-CDI-HelloWorld-Program works like that: There is a "Click Me"-Button on the screen and when you click that button, a label with the text "Thanks for clicking" is added below that button.
I will extend that HelloWorld-Program by using (injecting) our RapidPM-CDILogger which prints a WARN-Message on the console ("Button was clicked").

The project structure looks like the following:

I created that Vaadin-project via Maven (see https://vaadin.com/download).

To get the program working, we have to make the following changes:

1. Add the Vaadin-CDI-support and the RapidPM-Modules as dependencies in the pom.xml
2. Create a log4j.properties in the resources-folder to configure the logger
3. Modify the Vaadin UI-Class (called MyVaadinUI per default)

That's all. So let's start:

1)
Add the following dependency entries to the pom.xml:

<dependency>
      <groupId>com.vaadin</groupId>
      <artifactId>vaadin-cdi</artifactId>
      <version>1.0.0.alpha1</version>
</dependency> 
<dependency>
       <groupId>org.rapidpm.modul</groupId>
       <artifactId>cdi-commons</artifactId>
       <version>1.2-SNAPSHOT</version>
       <scope>compile</scope>
       <type>jar</type>
</dependency> 

The first dependency is needed to get Vaadin working with CDI, the second is needed to use our RapidPM-Logger.
Attention: The logger won't work with cdi-commons in version 1.1.1

2)
Create a file called log4j.properties:

log4j.rootLogger=DEBUG,stdout
log4j.appender.stdout=org.apache.log4j.ConsoleAppender
log4j.appender.stdout.Target=System.out
log4j.appender.stdout.layout=org.apache.log4j.PatternLayout
log4j.appender.stdout.layout.ConversionPattern=%d %p [%c] - %m%n

That file is needed for log4j, which is used by our CDILogger. Put it into src/main/resources. I had to create that resources-folder and mark it as a source-folder manually.

3)
Modify the MyVaadinUI-Class so it looks like the following:

import com.vaadin.annotations.Theme;
import com.vaadin.annotations.VaadinServletConfiguration;
import com.vaadin.cdi.CDIUI;
import com.vaadin.server.VaadinRequest;
import com.vaadin.server.VaadinServlet;
import com.vaadin.ui.Button;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Label;
import com.vaadin.ui.UI;
import com.vaadin.ui.VerticalLayout;
import org.rapidpm.demo.cdi.commons.logger.CDILogger;
import org.rapidpm.module.se.commons.logger.Logger;

import javax.inject.Inject;
import javax.servlet.annotation.WebServlet;

@Theme("mytheme")
@SuppressWarnings("serial")
@CDIUI
public class MyVaadinUI extends UI
{

    /*
    @WebServlet(value = "/*", asyncSupported = true)
    @VaadinServletConfiguration(productionMode = false, ui = MyVaadinUI.class, widgetset = "VaadinWithCDI.AppWidgetSet")
    public static class Servlet extends VaadinServlet {
    }
    */

    @Inject
    @CDILogger
    private Logger logger;

    @Override
    protected void init(VaadinRequest request) {
        final VerticalLayout layout = new VerticalLayout();
        final Button button = new Button("Click Me");
        button.addClickListener(new Button.ClickListener() {
            public void buttonClick(ClickEvent event) {
                layout.addComponent(new Label("Thank you for clicking"));
                logger.warn("Button was clicked");
            }
        });
        configureLayout(layout, button); //Only configuring layouting-issues
    }

    private void configureLayout(final VerticalLayout layout, final Button button) {
        layout.setMargin(true);
        layout.setWidth("100%");
        layout.addComponent(button);
        setContent(layout);
    }
}

Explanation:
- The @CDIUI Annotation at line 19 is needed to make the project use CDI.
- Recognize that the inner class at lines 24-27 must be commented out (you can delete those lines completely, of course). If this isn't commented out the Logger is not injected properly and a NullPointerException is thrown when calling methods of it.
- The CDILogger is injected in lines 30-32
- When the button is clicked, a label is added to the layout and a WARN-message is posted on the console via our logger (lines 40/41).

-----------------------------

The result looks like the following:

links:
-  Vaadin-CDI-integration