powerparin / gwt-ext

Automatically exported from code.google.com/p/gwt-ext
0 stars 0 forks source link

Scrollbar in TabPanel in the CardLayout doesn't work #523

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
I am working on a panel with a CardLayout which is formerly a
TabPanel. So it looks like a wizard with previous and next buttons.Now
in one of the panels or page I have a TabPanels that shows the
selected materials of the user per tab. The problem is when I have
many tabs that won't fit anymore in the tab panel area, the scroll bar
doesn't show which is expected to show. This happened when I used
CardLayout. I already have the setEnableTabScroll() but still won't
succeed. I have used the doLayout() method of the tabPanel but was not
also successful.

What steps will reproduce the problem?
1. Create a panel with a CardLayout 
2. Create panels to be considered as cards 
3. In one of the cards, add tab panel.  This tab panel's area
for example can only show 5 tabs.
4. Add these cards to the main panel
5. Initially create 10 tabs.
6. Set the active card to 0 meaning the first card.

What is the expected output? What do you see instead?
This shows the tabs but the scrollbar of the tab panel won't
show so you can't navigate to the other tabs currently not shown.

What version of the product are you using? On what operating system?
gwt-windows-1.7.1
xp sp1

Please provide any additional information below.

I made a test to the gwt-ext demo on tab panels. I put it in a
cardLayout
panel.

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;
import com.gwtext.client.core.EventObject;
import com.gwtext.client.widgets.*;
import com.gwtext.client.widgets.event.ButtonListenerAdapter;
import com.gwtext.client.widgets.event.TabPanelListenerAdapter;
import com.gwtext.client.widgets.layout.CardLayout;
import com.gwtext.client.widgets.layout.VerticalLayout;
import com.gwtext.client.widgets.menu.BaseItem;
import com.gwtext.client.widgets.menu.Item;
import com.gwtext.client.widgets.menu.Menu;
import com.gwtext.client.widgets.menu.event.BaseItemListenerAdapter;

public class MyTest implements EntryPoint {

   private TabPanel tabPanel;
   private int index;
   private Menu menu;

   public void onModuleLoad() {

       try{
       Panel panel = new Panel();
       panel.setBorder(false);
       panel.setPaddings(15);
       Panel verticalPanel = new Panel();
       verticalPanel.setLayout(new VerticalLayout(15));

        final Panel mytabPanel = new Panel();//TabPanel -> Panel;
mytabPanel -> myPanelCardLayout
                // mytabPanel.setActiveTab(0);
                 mytabPanel.setLayout(new CardLayout());//CardLayout --
>>fitlayout
                 mytabPanel.setTitle("Request Wizard");
                 mytabPanel.setPaddings(15);
                 mytabPanel.setHeight(850);
                 mytabPanel.setWidth(850);

                 Panel sample1Panel = new Panel();
             sample1Panel.setTitle("Step 1");
            // sample1Panel.setAutoHeight(true);
             sample1Panel.setHeight(800);
             sample1Panel.setWidth(800);
             sample1Panel.setId("card-1");

                 final Panel detailsPanel = new Panel();
                 detailsPanel.setHeight(800);
                 detailsPanel.setWidth(800);
                 //detailsTab.setAutoScroll(true);
                 detailsPanel.setTitle("Step 2");
                 detailsPanel.setId("card-2");

       Button button = new Button("Add Tab", new
ButtonListenerAdapter() {
           public void onClick(Button button, EventObject e) {
               Panel tab = addTab();
               tabPanel.activate(tab.getId());
               tabPanel.scrollToTab(tab, true);
           }
       });
       button.setIconCls("new-tab-icon");
       //verticalPanel.add(button);
       sample1Panel.add(button);

       tabPanel = new TabPanel();
       tabPanel.setResizeTabs(true);
       tabPanel.setMinTabWidth(115);
       tabPanel.setTabWidth(135);
       tabPanel.setEnableTabScroll(true);

       tabPanel.setWidth(450);
       tabPanel.setHeight(250);

       tabPanel.setActiveTab(0);

       tabPanel.addListener(new TabPanelListenerAdapter() {
           public void onContextMenu(TabPanel source, Panel tab,
EventObject e) {
               showMenu(tab, e);
           }
       });

       for (index = 0; index <13; index++) {
           addTab();
       }

       verticalPanel.add(tabPanel);
       detailsPanel.add(verticalPanel);
       mytabPanel.add(sample1Panel);
       mytabPanel.add(detailsPanel);

       //-->>Next and Previous Button
       ButtonListenerAdapter listener = new ButtonListenerAdapter()
{
           public void onClick(Button button, EventObject e) {
               String btnID = button.getId();
               CardLayout cardLayout = (CardLayout)
mytabPanel.getLayout();
               String panelID =
cardLayout.getActiveItem().getId();

               if (btnID.equals("move-prev")) {
                   if (panelID.equals("card-4")) {
                       cardLayout.setActiveItem(2);//
1>2

                   } else if(panelID.equals("card-3")){
                       cardLayout.setActiveItem(1);
                   }else if(panelID.equals("card-2")){
                       cardLayout.setActiveItem(0);
                   }
               } else {   //move-next

               if (panelID.equals("card-1")) {
                   cardLayout.setActiveItem(1);
                  // detailsPanel.doLayout();
                  // mytabPanel.doLayout();
                   //panel.doLayout();
               } else if(panelID.equals("card-2")){
                   cardLayout.setActiveItem(2);
                  // mytabPanel.doLayout();
               }
             }
        }
       };

       Toolbar toolbar = new Toolbar();

       ToolbarButton backButton = new ToolbarButton("Back",
listener);
       backButton.setId("move-prev");
       toolbar.addButton(backButton);
       toolbar.addFill();

       ToolbarButton nextButton = new ToolbarButton("Next",
listener);
       nextButton.setId("move-next");
       toolbar.addButton(nextButton);
        mytabPanel.setBottomToolbar(toolbar);

       mytabPanel.setActiveItem(0);

       panel.add(mytabPanel);

       Viewport viewport = new Viewport(panel);
      // RootPanel.get().add(panel);
       }catch(Exception ex){
               ex.printStackTrace();
       }

   }

   private void showMenu(final Panel tab, EventObject e) {
       if (menu == null) {
           menu = new Menu();
           Item close = new Item("Close Tab");
           close.setId("close-tab-item");
           close.addListener(new BaseItemListenerAdapter() {
               public void onClick(BaseItem item, EventObject e) {
                   tabPanel.remove(tabPanel.getActiveTab());
               }
           });
           menu.addItem(close);

           Item closeOthers = new Item("Close Other Tabs");
           closeOthers.setId("close-others-item");
           closeOthers.addListener(new BaseItemListenerAdapter() {
               public void onClick(BaseItem item, EventObject e) {
                   Component[] items = tabPanel.getItems();
                   /*for (int i = 0; i < items.length; i++) {
                       Component component = items[i];
                       if (!
component.getId().equals(tabPanel.getActiveTab().getId())) {
                           tabPanel.remove(component);
                       }
                   }
                   */
               }
           });
           menu.addItem(closeOthers);
       }

       BaseItem closeOthers = menu.getItem("close-others-item");
       if (tabPanel.getItems().length == 1) {
           closeOthers.disable();
       } else {
           closeOthers.enable();
       }
       menu.showAt(e.getXY());
   }

   private Panel addTab() {

       Panel tab = new Panel();
       tab.setAutoScroll(true);

       tab.setTitle("New Tab " + (++index));
       tab.setIconCls("tab-icon");
       tab.setHtml("Tab Body " + index + "<br/><br/>" +
getBogusMarkup());
       tab.setClosable(true);
       tabPanel.add(tab);
       return tab;
   }

   private static String getBogusMarkup() {
       return "<p>Lorem ipsum dolor sit amet, consectetuer adipiscing
elit. " +
               "Sed metus nibh, sodales a, porta at, vulputate eget,
dui.  " +
               "In pellentesque nisl non sem. Suspendisse nunc sem,
pretium eget, " +
               "cursus a, fringilla vel, urna.";
   }
}

//<<====================

Original issue reported on code.google.com by allan.za...@gmail.com on 5 Apr 2010 at 11:15