GWT TabLayoutPanel ie7 first tab collapsed

Question

I have a TabLayoutPanel that I access from ie7. The first time I view the tab it is collapsed ~32px x 32px. If I select the second tab, the content area fills, and I can go back to the first tab and it looks correct. I am using and all the ancestors of the tablayoutpanel are some form of layoutpanel. It works in ie8 and chrome. Any ideas?

Update: I have noticed that it is the resizing that is not working for the tab panel. The panel will only resize when I switch between tabs. When I change the browser window size, the tab panel stays the same size. The second I change tabs, the tab panel fills the browser correctly.

Answer 1

I don't see how Issue 4596 is fixed ( not in 2.3.0 anyway), I'm seeing the exact same effect under ie7.

Fortunately here's a workaround you can add in your view or whatever composite you're using. It works for me, however note that I specify the size of the TabLayoutPanel, since it's in the middle of an HTMLPanel.

@Override
protected void onAttach() {
  super.onAttach();
  tabPanel.forceLayout();
}

Answer 2

Guillaume's solution almost worked for me, except that I had to run it during the next event loop (don't ask me why):

Scheduler.get().scheduleDeferred(new Scheduler.ScheduledCommand()
{
  public void execute()
  {
    tabPanel.forceLayout();
  }
});

Answer 3

Are you by chance adding the tabs to the TabLayoutPanel before adding it to the page?

I've noticed that if you add the TabLayoutPanel to the page, then add the tabs, this problem will go away.

Answer 4

I have a similar problem. I explicitly call

tabPanel.selectTab(0);

and then the first time that I visit my UI with the tabbed panel the components are shown correctly.