无法正确对齐组件

时间:2015-06-18 11:44:39

标签: vaadin7

我想在窗口中对齐我的组件

enter image description here

问题在于,无论我如何尝试使用布局并设置宽度和高度 - 它都位于窗口顶部(几乎在边框中)或距离中心太远。

目前它看起来像这样

enter image description here

我的窗口代码如下所示

public MakeChoiceWindow(TextPage page) {
    setHeight("300");
    setWidth("550");

    VerticalLayout windowLayout = new VerticalLayout();
    windowLayout.setSizeFull();


    VerticalLayout wrapped = new VerticalLayout();
    wrapped.setWidth("520");
    wrapped.setHeight("250");

    HorizontalLayout textAndChoiceLayout = new HorizontalLayout();
    textAndChoiceLayout.setWidth("400");

    wrapped.addComponent(new Label(" "));

    choiceMessageArea = new TextArea();
    choiceMessageArea.setValue(page.getTextMessage());
    choiceMessageArea.setWidth("250");
    choiceMessageArea.setHeight("150");
    textAndChoiceLayout.addComponent(choiceMessageArea);
    textAndChoiceLayout.setComponentAlignment(choiceMessageArea, Alignment.TOP_LEFT);

    choiceRadioGroup = new OptionGroup("Your choice");
    for(int i = 0; i < page.numberOfChoices(); i++) {
        choiceRadioGroup.addItem(page.getChoice(i));
    }
    choiceRadioGroup.select(page.getChoice(0));
    choiceRadioGroup.setHeight("100");
    textAndChoiceLayout.addComponent(choiceRadioGroup);
    textAndChoiceLayout.setComponentAlignment(choiceRadioGroup, Alignment.TOP_RIGHT);

    wrapped.addComponent(textAndChoiceLayout);
    wrapped.setComponentAlignment(textAndChoiceLayout, Alignment.MIDDLE_CENTER);

    makeChoiceButton = new Button();
    makeChoiceButton.setWidth("100");
    makeChoiceButton.setIcon(FontAwesome.CHECK);
    makeChoiceButton.addClickListener(new ClickListener() {

        @Override
        public void buttonClick(ClickEvent event) {
            MakeChoiceWindow.this.close();
        }

    });

    wrapped.addComponent(makeChoiceButton);
    wrapped.setComponentAlignment(makeChoiceButton, Alignment.BOTTOM_RIGHT);

    windowLayout.addComponent(wrapped);
    windowLayout.setComponentAlignment(wrapped, Alignment.TOP_CENTER);

    setContent(windowLayout);
    center();
    setModal(true);
    setResizable(false);
}

我应该修理什么?

1 个答案:

答案 0 :(得分:0)

我能够以某种方式对齐组件。

因此并不完美(也许我应该使用组件尺寸)

AppName.Debug.CI

现在看起来像这样

enter image description here