SubComponent from CustomComponent can't show in Window

Hi everybody, I am newie in vaadin, I try to use UI designer to create an new component,and I get the following code:


package com.example.hellovaadin;

import com.vaadin.annotations.AutoGenerated;
import com.vaadin.ui.AbsoluteLayout;
import com.vaadin.ui.Button;
import com.vaadin.ui.Window;
import com.vaadin.ui.CustomComponent;
import com.vaadin.ui.PasswordField;
import com.vaadin.ui.TextField;


public class LoginWindow extends CustomComponent {

	@AutoGenerated
	private AbsoluteLayout mainLayout;
	@AutoGenerated
	private TextField textField_1;
	@AutoGenerated
	private PasswordField passwordField_1;
	@AutoGenerated
	private Button button_1;

	/*- VaadinEditorProperties={"grid":"RegularGrid,20","showGrid":true,"snapToGrid":true,"snapToObject":true,"movingGuides":false,"snappingDistance":10} */

	

	/*- VaadinEditorProperties={"grid":"RegularGrid,20","showGrid":true,"snapToGrid":true,"snapToObject":true,"movingGuides":false,"snappingDistance":10} */

	

	/*- VaadinEditorProperties={"grid":"RegularGrid,20","showGrid":true,"snapToGrid":true,"snapToObject":true,"movingGuides":false,"snappingDistance":10} */

	/**
	 * The constructor should first build the main layout, set the
	 * composition root and then do any custom initialization.
	 *
	 * The constructor will not be automatically regenerated by the
	 * visual editor.
	 */
	public LoginWindow() {
		buildMainLayout();
		setCompositionRoot(mainLayout);
		// TODO add user code here
	}

	@AutoGenerated
	private AbsoluteLayout buildMainLayout() {
		// common part: create layout
		mainLayout = new AbsoluteLayout();
		mainLayout.setCaption("I am here!");
		mainLayout.setImmediate(true);
		mainLayout.setWidth("100%");
		mainLayout.setHeight("100%");
		mainLayout.setMargin(false);
		
		// top-level component properties
		setWidth("100.0%");
		setHeight("100.0%");
		
		// button_1
		button_1 = new Button();
		button_1.setCaption("Button");
		button_1.setImmediate(true);
		button_1.setWidth("-1px");
		button_1.setHeight("-1px");
		mainLayout.addComponent(button_1, "top:274.0px;left:280.0px;");
		
		// passwordField_1
		passwordField_1 = new PasswordField();
		passwordField_1.setImmediate(true);
		passwordField_1.setWidth("-1px");
		passwordField_1.setHeight("-1px");
		mainLayout.addComponent(passwordField_1, "top:196.0px;left:240.0px;");
		
		// textField_1
		textField_1 = new TextField();
		textField_1.setImmediate(true);
		textField_1.setWidth("-1px");
		textField_1.setHeight("-1px");
		textField_1.setSecret(false);
		mainLayout.addComponent(textField_1, "top:140.0px;left:240.0px;");
		
		return mainLayout;
	}

}

and I try to use LoginWindow class in my application like this:


package com.example.hellovaadin;

import com.vaadin.Application;
import com.vaadin.ui.*;

public class HellovaadinApplication extends Application {
	private static final long serialVersionUID = 7433630160278074017L;

	@Override
	public void init() {
		Window mainWindow = new Window("Hello Vaadin");
		LoginWindow myLoginWindow = new LoginWindow();
                mainWindow.addComponent(myLoginWindow);
		setMainWindow(mainWindow);
	}

}

when I run test, I got nothing show,what wrong with me? Please help me,thanks a lot.

Hi and welcome on board!

In your HellovaadinApplication, wrap the LoginWindow in a VerticalLayout with 100% width and height.


VerticalLayout l = new VerticalLayout();
l.setSizeFull();
mainWindow.setContent(l);

LoginWindow myLoginWindow = new LoginWindow();
mainWindow.addComponent(myLoginWindow);

Thanks! it is work!