LogoLogo
v7.0.0
v7.0.0
  • TotalCross Overview
  • TotalCross Javadoc
  • TotalCross Changelog
  • Roadmap
  • Documentation
    • Getting Started
      • First embedded project with TotalCross
    • Components
      • Accordion
      • Aligned Labels
      • Button
      • Check
      • ComboBox
      • Dynamic Scroll
      • Edit
      • Floating Button
      • Gpiod
      • Grid
      • GridContainer
      • Image
      • ImageControl
      • ImageList
      • Label
      • Material Icons
      • Material Window
      • MessageBox
      • Multi Edit
      • Progress Bar
      • Progress Box
      • Radio
      • Radio Group
      • Scroll Container
      • Side Menu
      • Slider
      • Sliding Window
      • Spin List
      • Spinner
      • Switch
      • Tabbed Container
      • Velocimeter
    • APIs
      • API Overview
      • API Rest
      • Asynchronous Task
      • Camera
      • Control
        • Main Window
        • Window
        • Container
      • GPS
      • HTTPS and SSL
      • JSON
      • Maps
        • Maps - Deprecated
        • Static Map
      • Material Design Standards
      • Ninepath
      • Notifications
      • PrinterManager
      • Push Notification Firebase
      • Scanner
      • SOAP
      • Socket
      • SocketServer
      • SQLite Encryption
      • QR Code Generator
      • totalcross.sys
      • Youtube API
    • Creating an Issue
    • Contributing
      • Branch workflow
      • Writing documentation
    • Guides
      • App Architecture
        • Suggested Architecture
        • Why do Design Patterns help with the application's organization?
          • MVC Architecture Pattern
          • Template Pattern
          • Data Persistence: DAO Pattern.
        • Separation of concepts: What is the best way to create UI interfaces?
        • Positioning
          • Manual Positioning
        • Relative Positioning
        • Best practices to improve project maintenance
      • Device Simulator
      • Package your app from scratch
        • TotalCross SDK
        • Environment Variables in IDE
          • Eclipse
          • IntelliJ
        • Deploy your app with a dependecy TC
        • Deploy iOS
          • Using Development certificate to test your apps
      • Understanding TotalCross for Linux ARM
      • Running C++ applications with TotalCross
      • Web Services
    • Miscelaneous
      • Java JDK 8
      • Maven
      • Installing Visual Studio Code
    • FAQ
      • IMEI in Android 10
Powered by GitBook
On this page
  • Overview
  • Source Code
  • Attributes
  • Methods
  • References

Was this helpful?

  1. Documentation
  2. Components

Accordion

PreviousComponentsNextAligned Labels

Last updated 6 years ago

Was this helpful?

Overview

Accordions are used to show and hide text through user interaction.

In Totalcross this component is called AccordionContainer

Source Code

AccordionSample.java
import totalcross.sys.Settings;
import totalcross.ui.AccordionContainer;
import totalcross.ui.MainWindow;
import totalcross.ui.MultiEdit;
import totalcross.ui.font.Font;
import totalcross.ui.gfx.Color;

public class AccordionSample extends MainWindow {

	public AccordionSample() {
		setUIStyle(Settings.MATERIAL_UI);
		Settings.uiAdjustmentsBasedOnFontHeight = true;
	}

	public void initUI() {
		int gap = (int) (Settings.screenDensity * 20);

		AccordionContainer.Group gr = new AccordionContainer.Group();
		AccordionContainer ac[] = new AccordionContainer[5];
		MultiEdit me[] = new MultiEdit[5];

		for (int i = 0; i < ac.length; i++) {
			ac[i] = new AccordionContainer(gr);
			ac[i].setFont(font.asBold());
			me[i] = new MultiEdit(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].new Caption("...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) {
			case 1:
				ac[i].add(ac[i].new Caption("...the most famous forest?"), LEFT, TOP, FILL, PREFERRED);
				break;
			case 2:
				ac[i].add(ac[i].new Caption("...the current president?"), LEFT, TOP, FILL, PREFERRED);
				break;
			case 3:
				ac[i].add(ac[i].new Caption("...the most famous river?"), LEFT, TOP, FILL, PREFERRED);
				break;
			case 4:
				ac[i].add(ac[i].new Caption("...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;
		}
	}

	public int getScreenWidth() {
		return Settings.screenWidth;
	}
}

Attributes

Type

Name

Description

int

minH

Minimum height of the closed accordion

Methods

Type

Name

Description

Constructor

AccordionContainer( )

Creates a empty accordion

Constructor

AccordionContainer(AccordionContainer.Group g)

Creates a list of accordions from the accordion group.

void

collapse( )

Closes the accordion

void

collapse(boolean showAnimation)

Closes the accordion with animation(depending on the parameter)

void

expand( )

Open the accordion

void

expand(boolean showAnimation)

Open the accordion with animation(depending on the parameter)

int

getPreferredHeight( )

Returns the accordion´s minimum height

boolean

isExpanded( )

Retorna true if the accordion is open

void

onAnimationFinished(ControlAnimation anim)

This method is called after the animation is finished

void

setPos(int x, int y)

Set the accordion´s x and y position

References

See also our on how to add other components within an accordion.

See the for more information.

quick video tutorial
Java Docs