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.

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
another problem or maybe only a question!?
Yesterday i fix the problem by updating my IE 8 to IE11.
After several hours spending time on trying to fix, i decided to work further today.
No i create a new Vaadin Project - Demo ( as the guy in the Demo video on youtoube has done that)
Rightclick to to the src folder , choose new -- others -- Vaadin Composite named it DemoThing.
I try to opend it with rightclick -- openWith-- VaadinEditor (behind the Editor there is a text -- Deprecated)
Nothing happend maybe because of deprecated
Then i tryed to create a VaadinDesign
src -- rightclick - new - - others - VaadinDesign
That works fine - i can drag and drop components to the Grid.
But it will not ( anyhow for me) create the source code, so i can´t work with it.
The Java file looks like this
package com.example.demo;
import com.vaadin.annotations.AutoGenerated;
import com.vaadin.annotations.DesignRoot;
import com.vaadin.ui.AbsoluteLayout;
import com.vaadin.ui.Button;
import com.vaadin.ui.declarative.Design;
/**
* !! DO NOT EDIT THIS FILE !!
*
* This class is generated by Vaadin Designer and will be overwritten.
*
* Please make a subclass with logic and additional interfaces as needed,
* e.g class LoginView extends LoginDesign implements View { … }
*/
@DesignRoot
@AutoGenerated
@SuppressWarnings("serial")
public class MessageThings extends AbsoluteLayout {
protected com.vaadin.ui.Button find;
protected com.vaadin.ui.Button search;
public MessageThings() {
Design.read(this);
}
}
the source Mode in the Designer looks like this
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" name="design-properties" content="{"RULERS_VISIBLE":true,"GUIDELINES_VISIBLE":true,"SNAP_TO_OBJECTS":true,"SNAP_TO_GRID":true,"SNAPPING_DISTANCE":10,"GRID_TYPE":"RegularGrid,36","PAPER_WIDTH":1065,"PAPER_HEIGHT":645,"JAVA_SOURCES_ROOT":"src","THEME":"demo"}">
</head>
<body>
<v-absolute-layout>
<v-text-field :top="115px" :left="46px"></v-text-field>
<v-text-area height="184px" :top="138px" :left="46px"></v-text-area>
<v-horizontal-layout width="183px" height="37px" :top="335px" :left="48px">
<v-button plain-text="" _id="find">
Button
</v-button>
<v-button width-full="true" plain-text="" _id="search">
Button
</v-button>
</v-horizontal-layout>
</v-absolute-layout>
</body>
</html>
thank you for your help
Hi,
I'm not entirely sure what your problem is, but I think it might be that the new Vaadin Designer works differently than the old Visual Designer. In short, it will create a html file with the layout and a Java class that exposes the components to Java. Usually you want to extend the Java class, and add your logic - so in your case:
public class MessageThingsImpl extends MessageThings {
// Your logic goes in this class
public MessageThingsImpl() {
find.addClickListener(...);
}
}
I do recommend naming the design (the layout you make with the Designer) SomethingDesign or SomethingLayout. This way you'll end up with structures like:
- LoginDesign.html
- LoginDesign.java
- LoginView.java extends LoginDesign (<- your code)
or
- MainLayout.html
- MainLayout.java
- MainView.java extends MainLayout (<- your code)
(In some cases you might also use the design class (e.g LoginDesign) directly in compositions or such.)
Please review to chapter 10 in the Book of Vaadin for some more details: https://vaadin.com/book/-/page/designer.html
Did this answer your question?
Best Regards,
Marc