java - 如何将在可视化编辑器中创建的 Vaadin Composite 组件嵌入到我的网页中？

Question

我正在尝试为我的网站设计一个网页。我使用 Vaadin 框架和 Java 语言来实现同样的目的。我使用 Vaadin 中的可视化编辑器来放置 UI 元素，即我创建了一个复合组件。这是在类 MyComponent.java 中完成的。我有一个 DownloadManager.java 类，它扩展了 UI 类并显示网页。我尝试在 UI 类中创建 MyComponent.java 对象，以便我使用可视化编辑器添加的所有组件都显示在网页上。但这样做不会显示任何内容，只会显示一个空白页面。我对使用 Vaadin 框架还很陌生，所以如果问题很微不足道，请原谅。我遵循了 Vaadin 之书的指南，但找不到上述问题的答案。以下是我的类(class)的代码片段:

public class DownloadmanagerUI extends UI {

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

    @Override
    protected void init(VaadinRequest request) {
        //final VerticalLayout layout = new VerticalLayout();
        //layout.setMargin(true);
        //setContent(layout);
        MyComponent m = new MyComponent();
        //layout.addComponent(m);
        /*Button button = new Button("Click Me");
        button.addClickListener(new Button.ClickListener() {
            public void buttonClick(ClickEvent event) {

                layout.addComponent(new Label("Thank  for clicking"));
            }
        });
        layout.addComponent(button);*/

    }

MyComponent.java:

public class MyComponent extends CustomComponent {

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

    @AutoGenerated
    private AbsoluteLayout mainLayout;
    @AutoGenerated
    private TextField textField_2;
    @AutoGenerated
    private TextField textField_1;
    @AutoGenerated
    private LoginForm loginForm_1;
    @AutoGenerated
    private Label label_1;
    @AutoGenerated
    private Button button_1;
    /**
     * 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 MyComponent() {
        buildMainLayout();
        setCompositionRoot(mainLayout);

        // TODO add user code here
    }

    @AutoGenerated
    private AbsoluteLayout buildMainLayout() {
        // common part: create layout
        mainLayout = new AbsoluteLayout();
        mainLayout.setImmediate(false);
        mainLayout.setWidth("100%");
        mainLayout.setHeight("100%");

        // 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:314.0px;left:200.0px;");

        // label_1
        label_1 = new Label();
        label_1.setImmediate(false);
        label_1.setWidth("-1px");
        label_1.setHeight("-1px");
        label_1.setValue("Label");
        mainLayout.addComponent(label_1, "top:82.0px;left:131.0px;");

Answer 1

在您的 init 调用中:setContent(m) ( https://vaadin.com/api/7.4.3/com/vaadin/ui/UI.html#setContent%28com.vaadin.ui.Component%29 )