Starting It Simple With Eclipse
In the wizard selection, select Vaadin › Vaadin Widget and click Next.
In the New Component Wizard, make the following settings.
Source folder
The root folder of the entire source tree. The default value is the default source tree of your project, and you should normally leave it unchanged unless you have a different project structure.
Package
The parent package under which the new server-side component should be created. If the project does not already have a widget set, one is created under this package in the widgetset subpackage. The subpackage will contain the .gwt.xml descriptor that defines the widget set and the new widget stub under the widgetset.client subpackage.
Name
Superclass
The superclass of the server-side component. It is AbstractComponent by default, but com.vaadin.ui.AbstractField or com.vaadin.ui.AbstractSelect are other commonly used superclasses. If you are extending an existing component, you should select it as the superclass. You can easily change the superclass later.
Template
Select which template to use. The default is Full fledged, which creates the server-side component, the client-side widget, the connector, a shared state object, and an RPC object. The Connector only leaves the shared state and RPC objects out.
Finally, click Finish to create the new component.
The wizard will:
If the project does not already have a widget set, the wizard creates a GWT module descriptor file ( .gwt.xml) in the base package and modifies the servlet class or the web.xml deployment descriptor to specify the widget set class name parameter for the application
Create a client-side widget stub (along with the connector and shared state and RPC stubs) in the client.componentname package under the base package
The structure of the server-side component and the client-side widget, and the serialization of component state between them, is explained in the subsequent sections of this chapter.
The following setting is inserted in the web.xml deployment descriptor to enable the widget set:
You can refactor the package structure if you find need for it, but GWT compiler requires that the client-side code must always be stored under a package named “ client” or a package defined with a source element in the widget set descriptor.
Compiling the Widget Set
After you edit a widget, you need to compile the widget set. The Vaadin Plugin for Eclipse automatically suggests to compile the widget set in various situations, such as when you save a client-side source file. If this gets annoying, you can disable the automatic recompilation in the Vaadin category in project settings, by selecting the Suspend automatic widgetset builds option.
You can compile the widget set manually by clicking the Compile widgetset button in the Eclipse toolbar, shown in , while the project is open and selected. If the project has multiple widget set definition files, you need to select the one to compile in the Project Explorer.
The Compile Widgetset Button in Eclipse Toolbar
The compilation progress is shown in the Console panel in Eclipse, illustrated in Compiling a Widget Set. You should note especially the list of widget sets found in the class path.
Compiling a Widget Set
The compilation output is written under the WebContent/VAADIN/widgetsets folder, in a widget set specific folder.
For more information on compiling widget sets, see . Should you compile a widget set outside Eclipse, you need to refresh the project by selecting it in Project Explorer and pressing F5.