Gwt TabLayoutPanel选项卡在单击按钮后不显示

我正在尝试使用

TabLayoutPanel

，当它是我放在页面上的第一件事时，它似乎工作正常，但当我在按下按钮（例如）后这样做时，它没有正确显示。例如，如果我做了这样的事情，效果很好：

TabLayoutPanel tlp = new TabLayoutPanel(2.5, Style.Unit.EM);

tlp.add(new HTML("Tab1"), "Tab 1 title");
tlp.add(new HTML("Tab2"), "Tab 2 title");
tlp.add(new HTML("Tab3"), "Tab 3 title");
tlp.setPixelSize(500, 400);

RootLayoutPanel.get().add(tlp);

但是，如果我执行以下操作，当我单击按钮时，我看到显示的是“Tab1”，没有其他选项卡，没有“Tab1 title”，等等：

有什么想法吗？我在某个地方读到，我正在使用的IE8中的

TabLayoutPanel

存在问题，但由于它在第一种情况下显示正常，我怀疑这是问题所在。我想看看Chrome和Firefox会发生什么，但花了几个小时在这些浏览器上安装GWT开发者插件却没有任何运气

---

我所做的事情是否有内在的问题？有人看到我的代码有问题吗？有人能建议如何调试此问题吗？

第二个实现问题的解决方案如下：

    final HorizontalPanel hp = new HorizontalPanel();
    Button btn = new Button("push");
    final TabLayoutPanel tlp = new TabLayoutPanel(2.5,Style.Unit.EM);

    hp.add(btn);
    tlp.add(new HTML("Tab1"), "Tab 1 title");
    tlp.add(new HTML("Tab2"), "Tab 2 title");
    tlp.add(new HTML("Tab3"), "Tab 3 title");
    tlp.setPixelSize(500, 400);

    RootLayoutPanel.get().add(hp);

    btn.addClickHandler(new ClickHandler(){

        @Override
        public void onClick(ClickEvent event) {

            RootLayoutPanel.get().remove(hp);
            RootLayoutPanel.get().add(tlp);             
        }

    });

---

您的错误是您将小部件连接到

RootLayoutPanel

的顺序，我最终使用了一个选项卡面板，从而解决了我的问题。我仍然不知道为什么TabLayoutPanel不工作。在Chrome33.0和Firefox24.0上测试

    final HorizontalPanel hp = new HorizontalPanel();
    Button btn = new Button("push");
    final TabLayoutPanel tlp = new TabLayoutPanel(2.5,Style.Unit.EM);

    hp.add(btn);
    tlp.add(new HTML("Tab1"), "Tab 1 title");
    tlp.add(new HTML("Tab2"), "Tab 2 title");
    tlp.add(new HTML("Tab3"), "Tab 3 title");
    tlp.setPixelSize(500, 400);

    RootLayoutPanel.get().add(hp);

    btn.addClickHandler(new ClickHandler(){

        @Override
        public void onClick(ClickEvent event) {

            RootLayoutPanel.get().remove(hp);
            RootLayoutPanel.get().add(tlp);             
        }

    });