Layout vaadin 7:打开/关闭对话框窗口后替换的布局

Layout vaadin 7:打开/关闭对话框窗口后替换的布局,layout,vaadin,Layout,Vaadin,我对论坛和编程都是新手,希望我能给你们足够的细节和准确的信息来理解我的问题 我在JavaEEWeb应用程序中使用Vaadin7,我有一个布局问题/幻象,我无法解释,也无法在网上找到解决方案。基本上,当我启动服务器并在本地主机上测试我的应用程序时,一切看起来都正常。当我打开一个对话窗口并再次关闭它时,该站点的布局看起来发生了变化。我找不到导致这种效果的点击模式。有时,当我只改变一个视图时,也会发生这种情况。这是,这是在应用程序中工作之后 我在浏览器中查看了devlooper工具,注意到在工作htm

我对论坛和编程都是新手,希望我能给你们足够的细节和准确的信息来理解我的问题

我在JavaEEWeb应用程序中使用Vaadin7,我有一个布局问题/幻象,我无法解释,也无法在网上找到解决方案。基本上,当我启动服务器并在本地主机上测试我的应用程序时,一切看起来都正常。当我打开一个对话窗口并再次关闭它时,该站点的布局看起来发生了变化。我找不到导致这种效果的点击模式。有时,当我只改变一个视图时,也会发生这种情况。这是,这是在应用程序中工作之后

我在浏览器中查看了devlooper工具,注意到在工作html中,gridlayout槽设置了属性“top”和“left”。在置换布局中,未设置这些属性。此外,这个问题似乎更多地发生在chrome中。firefox中也有这种情况,但不太常见

我使用垂直布局、GridLayout和FormLayout

你有类似的经历吗?我想知道如何以及何时从vaadin代码生成html文件,以找出它们发生更改的原因以及如何修复它

我不确定到底是哪个代码导致了这个问题,所以我不确定该发布什么。如果你有一个想法在哪里看,我可以添加更多的代码。以下是对话框的设置方式:

public class Dialog extends Window implements ClickListener

public Dialog(CustomController controller, String title)
  {
    super(title);
    setModal(true);
    setStyleName("dialogWindow");

    this.controller = controller;
    setWidth("65.0%");
    setHeight("90.0%");

    // top level component properties
    panLayout = new GridLayout();
    panLayout.setWidth("100%");
    panLayout.setHeight("100%");

    buildPanToolbar();
    panLayout.addComponent(panToolbar);

    buildPanTop();
    panLayout.addComponent(panTop);

    buildPanTabs();
    panLayout.addComponent(tabsheet);
    panLayout.setComponentAlignment(tabsheet, Alignment.MIDDLE_CENTER);
    panLayout.setRowExpandRatio(2, 1.0f);

    tfThema.focus();

    setContent(panLayout);

  }
buildSomething()
函数都是GridLayout、FormLayout、HorizontalLayout和VerticalLayout的组合。下面是
buildPanToolbar()
函数的示例

  private void buildPanToolbar()
  {
    panToolbar = new HorizontalLayout();
    panToolbar.setImmediate(false);
    panToolbar.setWidth("100%");
    panToolbar.setHeight("25px");
    panToolbar.setMargin(false);
    panToolbar.setSpacing(true);
    panToolbar.setStyleName("toolbar");

    HorizontalLayout panHelpToolbar = new HorizontalLayout();
    panHelpToolbar.setImmediate(false);
    panHelpToolbar.setWidth("-1px");
    panHelpToolbar.setHeight("25px");
    panHelpToolbar.setMargin(false);
    panHelpToolbar.setSpacing(true);
    panHelpToolbar.setStyleName("toolbarButtons");
    panToolbar.addComponent(panHelpToolbar);


    pbButton1 = new Button();
    pbButton1.setCaption("Button1Text");
    pbButton1.setStyleName(BaseTheme.BUTTON_LINK);
    pbButton1.setImmediate(true);
    pbButton1.setWidth("100px");
    pbButton1.setHeight("-1px");
    pbButton1.setIcon(new ThemeResource("../images/pic1.gif"));
    pbButton1.addClickListener(controller);
    panHelpToolbar.addComponent(pbButton1);
    panHelpToolbar.setComponentAlignment(pbButton1, Alignment.MIDDLE_LEFT);

    pbButton2= new Button();
    pbButton2.setCaption("Button2 Text");
    pbButton2.setImmediate(true);
    pbButton2.setWidth("100%");
    pbButton2.setHeight("-1px");
    pbButton2.setStyleName(BaseTheme.BUTTON_LINK);
    pbButton2.setIcon(new ThemeResource("../images/pic.gif"));
    pbButton2.addClickListener(this);

    panHelpToolbar.addComponent(pbButton2);
    panHelpToolbar.setComponentAlignment(pbButton2, Alignment.MIDDLE_LEFT);

  }

请显示生成屏幕/对话框所需的代码谢谢Andre。我不确定哪种代码会有用。现在,我添加了一个对话框设置示例。请让我知道,如果你正在寻找不同的东西。屏幕采用类似的样式。请显示生成屏幕/对话框所需的代码。谢谢Andre。我不确定哪种代码会有用。现在,我添加了一个对话框设置示例。请让我知道,如果你正在寻找不同的东西。屏幕遵循类似的风格。