Wednesday, February 6, 2013

CustomScrollPanel problem with TabLayoutPanel

Briefly, if the CustomScrollPanel in not in the foremost tab when the TabLayoutPanel is attached, the CustomScrollPanel's scrollbars never work. They draw, but there are no thumbs for scrolling regardless of how big the interior widget is or grows to be.

I want to know, is this a bug with CustomScrollPanel? Seems like it to me.

I'll explain the problem and give my workaround.

In my app I have a Widget with containing a TabLayoutPanel. Each tab contains a cascade of layout widgets that include a CustomScrollPanel like:

      <g:LayoutPanel>
        <g:layer left='0px' right='0px' top='0px' bottom='35px'>
          <g:CustomScrollPanel ui:field='scrollPanel' styleName='{style.noMargins}'
              alwaysShowScrollBars='true'>
            <g:AbsolutePanel ui:field='drawingPanel' styleName='{local.panelBackground}'
                title="Drawing Area" />
          </g:CustomScrollPanel>
        </g:layer>
      </g:LayoutPanel>

In the Activity's start() method, a scheduler is called to initialize the panels:

    Scheduler.get().scheduleDeferred(new Scheduler.ScheduledCommand() {
      @Override
      public void execute() {
        view.initializePanels();
      }
    });

In the view's Impl, initializePanels() calls TabAWidget.initializePanel() and TabBWidget.initializePanel(). These methods set the size of the AbsolutePanel so the background image it contains fills the CustomScrollPanel. In the foremost tab, TabA, I see the scrollers. However when I switch to TabB, the scollbars are there but empty although FireBug|Developer Tools confirms that the AbsolutePanel is larger than the CustomScrollPanel's content area.

If the view's initialize method puts TabB in front, TabB's scrollbars are good, but TabA now has the defective scrollbars.

Regardless of how big I make the AbsolutePanel--like zooming in and out on a Canvas I put there--the scollbars remain empty.

So, is this a bug with CustomScrollPanel?

My fix: In TabB, I only declare the LayoutPanel:

      <g:LayoutPanel ui:field='imageLayout'>
      </g:LayoutPanel>

In the view's initialize method,

    tabPanel.addSelectionHandler(new SelectionHandler<Integer>() {
      @Override
      public void onSelection(SelectionEvent<Integer> event) {
        switch (event.getSelectedItem()) {
        case TAB_B:
          tabB.initializePanel(); ...

Now TabBWidget must have a boolean to test "have I been initialized already?" so I don't mess stuff up when swapping tabs:

  void initializePanel() {
    if (inited) return;
    inited = true;
    drawingPanel = new AbsolutePanel();
    drawingPanel.addStyleName(localStyle.panelBackground());
    scrollPanel = new CustomScrollPanel(drawingPanel);
    scrollPanel.setAlwaysShowScrollBars(true);
    scrollPanel.addStyleName(localStyle.noMargins());
    imageLayout.add(scrollPanel);
    imageLayout.setWidgetLeftRight(scrollPanel, 0, Unit.PX, 0, Unit.PX);
    imageLayout.setWidgetTopBottom(scrollPanel, 0, Unit.PX, 35, Unit.PX);
    Scheduler.get().scheduleDeferred(new Scheduler.ScheduledCommand() {
      @Override
      public void execute() {
        imagePanel.setSize(...);
      }
    });
  }

Is there a better way?

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

No comments:

Post a Comment