Accordions are used to show and hide text through user interaction.
In Totalcross this component is called AccordionContainer
Source Code
AccordionSample.java
importtotalcross.sys.Settings;importtotalcross.ui.AccordionContainer;importtotalcross.ui.MainWindow;importtotalcross.ui.MultiEdit;importtotalcross.ui.font.Font;importtotalcross.ui.gfx.Color;publicclassAccordionSampleextendsMainWindow {publicAccordionSample() {setUIStyle(Settings.MATERIAL_UI);Settings.uiAdjustmentsBasedOnFontHeight=true; }publicvoidinitUI() {int gap = (int) (Settings.screenDensity*20);AccordionContainer.Group gr =new AccordionContainer.Group();AccordionContainer ac[] =newAccordionContainer[5];MultiEdit me[] =newMultiEdit[5];for (int i =0; i <ac.length; i++) { ac[i] =newAccordionContainer(gr); ac[i].setFont(font.asBold()); me[i] =newMultiEdit(50, gap /4); me[i].setText("Type here!"); }add(ac[0], CENTER, AFTER + gap *2, SCREENSIZE +85, PREFERRED); ac[0].setBackForeColors(0xBFDCF7,Color.BLACK); ac[0].add(ac[0].newCaption("...the biggest state?"), LEFT, TOP, FILL, PREFERRED); ac[0].add(me[0], LEFT + gap *4, AFTER + gap, FILL, FONTSIZE +600); me[0].transparentBackground=true; me[0].setFont(Font.getFont(false,this.getFont().size));for (int i =1; i <ac.length; i++) {add(ac[i], CENTER, AFTER + gap /2, SCREENSIZE +85, PREFERRED); ac[i].setBackForeColors(0xBFDCF7,Color.BLACK);switch (i) {case1: ac[i].add(ac[i].newCaption("...the most famous forest?"), LEFT, TOP, FILL, PREFERRED);break;case2: ac[i].add(ac[i].newCaption("...the current president?"), LEFT, TOP, FILL, PREFERRED);break;case3: ac[i].add(ac[i].newCaption("...the most famous river?"), LEFT, TOP, FILL, PREFERRED);break;case4: ac[i].add(ac[i].newCaption("...the most famous statue?"), LEFT, TOP, FILL, PREFERRED);break; } ac[i].add(me[i], LEFT + gap *4, AFTER + gap, FILL, FONTSIZE +600); me[i].setFont(Font.getFont(false, ac[i].getFont().size)); me[i].transparentBackground=true; } }publicintgetScreenWidth() {returnSettings.screenWidth; }}
Attributes
Methods
References
See also our quick video tutorial on how to add other components within an accordion.