1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    1
    Vote Rating
    0
    fcomte is on a distinguished road

      0  

    Default Unanswered: Problem using TabPanel, only first tab is displaying correctly

    Unanswered: Problem using TabPanel, only first tab is displaying correctly


    Hi,

    I'm testing GXT 3.0.0b and building a sample app.
    When nesting ContentPanel inside a TabPanel, i'm facing the following problem : the first tab is always displaying correctly but the content of the following tabs is not correct (only a part of the button is visible or the whole content is missing).

    Here is the screenshot gxt_problem.jpg

    And the source code of the example :

    Code:
    public class Application implements EntryPoint {
    
        public void onModuleLoad() {
    
    
            BorderLayoutContainer mainContainer = new BorderLayoutContainer();
    
    
            TabPanel mainTabPanel = new TabPanel();
    
    
            BorderLayoutData centerData = new BorderLayoutData();
            centerData.setMargins(new Margins(5));
    
    
            VerticalLayoutContainer mainContent = new VerticalLayoutContainer();
            mainContent.add(mainTabPanel, new VerticalLayoutData(1, 1));
    
    
            mainContainer.setCenterWidget(mainContent, centerData);
    
    
            mainTabPanel.setBodyBorder(false);
            mainTabPanel.setResizeTabs(true);
            mainTabPanel.setTabWidth(Integer.MAX_VALUE);
    
    
            VerticalLayoutContainer contentPanel1Container = new VerticalLayoutContainer();
            ContentPanel contentPanel1 = new ContentPanel();
            contentPanel1.setPixelSize(500, 250);
            contentPanel1.addButton(new TextButton("Submit 1"));
            contentPanel1Container.add(contentPanel1);
    
    
            VerticalLayoutContainer contentPanel2Container = new VerticalLayoutContainer();
            ContentPanel contentPanel2 = new ContentPanel();
            contentPanel2.setPixelSize(500, 250);
            contentPanel2.addButton(new TextButton("Submit 2"));
            contentPanel2Container.add(contentPanel2);
    
    
            mainTabPanel.add(contentPanel1Container, "Tab 1");
            mainTabPanel.add(contentPanel2Container, "Tab 2");
    
    
            Viewport viewport = new Viewport();
            viewport.add(mainContainer);
    
    
            RootPanel.get().add(viewport);
        }
    }
    Is it possible to use a content panel inside a tab panel? Should I use another container?

  2. #2
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,332
    Answers
    124
    Vote Rating
    83
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    Hi fcomte,


    I guess you need re-layout your panel on tab change for this you can call forceLayout() method on tabpanel change something like that .
    for more info see http://stackoverflow.com/questions/4...in-ext-gwt-gxt
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  3. #3
    Sencha User
    Join Date
    Nov 2012
    Posts
    3
    Vote Rating
    0
    zrk9k37m1 is on a distinguished road

      0  

    Default try this one

    try this one


    Hi, I also have the same issue.
    My workaround was to readd the invisible tab :

    Code:
     TabPanel folder = new TabPanel();
        public void onModuleLoad() {
    //firstTab framedPanel
            final CampaignEditor campaignEditor=new CampaignEditor();
    //secondTab  
          final ImportEditor importEditor=new ImportEditor();
            folder.add(campaignEditor.asWidget(),new TabItemConfig("Campaigns"));
            folder.add(importEditor.asWidget(),new TabItemConfig("Imports",false));
            RootPanel.get().add(folder);
    
    
            folder.addSelectionHandler(new SelectionHandler<Widget>() {
                @Override
                public void onSelection(SelectionEvent<Widget> event) {
              FramedPanel w=(FramedPanel)event.getSelectedItem();
                    w.forceLayout();
                    if(w.equals(importEditor.asWidget())&&!imports_redrawed)
                    {
                        ((FramedPanel) importEditor.asWidget()).forceLayout();
                        folder.remove(w);
                        imports_redrawed=true;
                        folder.add(importEditor.asWidget(),new TabItemConfig("Imports", false));
                    }
    
    
    
    
    
    
                    folder.setActiveWidget(w);
                }
            });
    
    
        }
        boolean imports_redrawed=false;
    }

  4. #4
    Sencha User
    Join Date
    Jan 2013
    Posts
    9
    Vote Rating
    0
    jongraf is on a distinguished road

      0  

    Default


    Calling tabPanel.forceLayout() solved this issue for me!

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar