html - Vaadin 标签对齐

Question

我有一个要注入(inject) VerticalSplit 面板的 FormLayout，但我无法将“TOMCAR”文本居中。我试过设置 UndefinedSize 并使用 HTML 居中，但没有成功。

我的代码:

HorizontalSplitPanel panel = new HorizontalSplitPanel();
    VerticalSplitPanel vpanel = new VerticalSplitPanel();
    FormLayout leftLayout = new FormLayout();
    FormLayout rightLayout = new FormLayout();

    Label enter = new Label();
    enter.setContentMode(ContentMode.HTML);
    enter.setValue("<br></br>");

    panel.setWidth(Page.getCurrent().getBrowserWindowWidth(), Sizeable.Unit.PIXELS);
    panel.setSplitPosition((Page.getCurrent().getBrowserWindowWidth()) / 8, Sizeable.Unit.PIXELS);
    panel.setLocked(true);
    panel.setHeight(Page.getCurrent().getBrowserWindowHeight(), Sizeable.Unit.PIXELS);

    viewBZ.setWidth("70%");
    leftLayout.addComponent(viewBZ);
    leftLayout.addComponent(configureAccount);

    for (int i = 0; i < 5; i++) {
        leftLayout.addComponent(enter);
    }

    leftLayout.addComponent(adminContact);

    for (int i = 0; i < 10; i++) {
        leftLayout.addComponent(enter);
    }
    leftLayout.addComponent(logout);

    panel.addComponent(leftLayout);

    content.addValueChangeListener(content);

    vpanel.setHeight((Page.getCurrent().getBrowserWindowHeight()) / 8, Sizeable.Unit.PIXELS);
    vpanel.setWidth((Page.getCurrent().getBrowserWindowWidth()) - (Page.getCurrent().getBrowserWindowWidth() / 8) - 8, Sizeable.Unit.PIXELS);
    vpanel.setLocked(true);

    Label label = new Label();   
    label.setWidth(null);


    label.setValue("<center>TOMCAR</center>");

    rightLayout.setMargin(false);
    rightLayout.setWidth(vpanel.getWidth() - panel.getWidth(), Sizeable.Unit.PIXELS);
    rightLayout.setHeight((Page.getCurrent().getBrowserWindowHeight()) / 100, Sizeable.Unit.PIXELS);


    rightLayout.addComponent(label);
    rightLayout.setExpandRatio(label, 1.0f);
    rightLayout.setComponentAlignment(label, Alignment.MIDDLE_RIGHT);

    vpanel.addComponent(rightLayout);

    vpanel.addComponent(content);
    panel.addComponent(vpanel);

    CssLayout css = new CssLayout(panel);

    setCompositionRoot(css);

第二件事不是优先事项，但这些输入是否是将按钮向下设置的正确解决方案？也许还有另一种方法可以做到这一点？

谢谢:)

Answer 1

您可以使用 css 居中对齐。

使用label.setStyleName("center"):

// add this in your scss
.center {
    text-align: center;
}