PDA

View Full Version : Problem with the AccordionLayoutContainer



smcdonald45
22 Jul 2014, 11:35 PM
Hi all,

i have a question to the AccordionLayoutContainer. In my use-case i have a AccordionLayoutContainer with TabPanels on it. Each tab may have different heights. If I switch the tab the heigth is not recalculated. It always uses the height of the first displayed tab. If I put the TabPanels on a normal VerticalLayoutContainer the heights are switched correct. Can anyone help me?

Here is the code:


package client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.IsWidget;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.VerticalPanel;
import com.google.gwt.user.client.ui.Widget;
import com.sencha.gxt.widget.core.client.ContentPanel;
import com.sencha.gxt.widget.core.client.TabPanel;
import com.sencha.gxt.widget.core.client.container.AccordionLayoutContainer;
import com.sencha.gxt.widget.core.client.container.VerticalLayoutContainer;


public class GXTTest implements IsWidget, EntryPoint {


private VerticalPanel vp;


public Widget asWidget() {
if (vp == null) {


ContentPanel cp1 = createContentPanel();
cp1.setHeadingText("CP 1");


ContentPanel cp2 = createContentPanel();
cp2.setHeadingText("CP 2");


ContentPanel cp3 = createContentPanel();
cp3.setHeadingText("CP 1");


ContentPanel cp4 = createContentPanel();
cp4.setHeadingText("CP 2");


VerticalLayoutContainer container1 = new VerticalLayoutContainer();
container1.add(cp1);
container1.add(cp2);


AccordionLayoutContainer container2 = new AccordionLayoutContainer();
container2.add(cp3);
container2.add(cp4);


vp = new VerticalPanel();
vp.setWidth("100%");
vp.setSpacing(20);
vp.add(container1);
vp.add(container2);
}


return vp;
}


public void onModuleLoad() {
RootPanel.get().add(asWidget());
}


private ContentPanel createContentPanel() {
String txt = "TestData.DUMMY_TEXT_SHORT";


HTML shortText = new HTML(txt);
shortText.addStyleName("pad-text");


HTML longText = new HTML(txt + "<br><br>" + txt);
longText.addStyleName("pad-text");


TabPanel folder = new TabPanel();
folder.setWidth(450);
folder.add(shortText, "Short Text");
folder.add(longText, "Long Text");


ContentPanel cp1 = new ContentPanel();
cp1.setWidget(folder);


return cp1;
}
}

smcdonald45
23 Jul 2014, 1:23 AM
Got it :) Have to set the correct expand mode:


container2.setExpandMode(AccordionLayoutContainer.ExpandMode.SINGLE);