App Inventor and the Advanced Features

How to work with the checkbox advanced features

It was asked in the forum How to add the number of check boxes that are checked with a result shown: I'm trying to create a list of details that a user will either check or not check and based on the number of boxes checked the sum will be shown either at the bottom of the page or on a separate page....Also need a reset button to uncheck all boxes when needed.

This is a nice example to work with the advanced features, in this case the checkbox advanced features. We are using a button, 3 checkboxes and 2 labels for this example and drag them into the designer window. For layout reasons I used additionally a vertical and horizontal arrangement.

Then in the block edidor we add some code.
1. We use a variable listCheckboxCom and define it as an empty list. Then in Screen1.Initialize we define the list of our checkbox components. We have to do that during Screen1.Initialize, because references to components have to be defined during runtime!

Correct Definition

This would be wrong (Definition outside of Screen1.Initialize)

2. Then we define a new procedure calcScore, see screenshot. You will find the Checkbox.Checked(component) block in the advanced section Any Checkbox.

3. We call the calcScore block in each of the checkbox.Changed blocks, see screenshot.

4. Then we define the btnReset.Click block, see screenshot.

5. Ready!

For questions about App Inventor,
please ask in the App Inventor forum.Thank you.

Adding more checkboxes: in the designer drag another checkbox into Screen 1. Then in the blocks editor just add the component of the new checkbox in Screen1.Initialize, create a new checkbox.changed block and put a calcScore block in. That's all.

All blocks of the example


Developing and maintaining snippets, tutorials and extensions for App Inventor takes a lot of time.
I hope it saved some of your time. If yes, then you might consider to donate a small amount!

Donation amount:

or donate some mBTC to Bitcoin Address:

Thank you! Taifun

Download aia file for App Inventor

Back to top of page ...

Creative Commons License
This work by Pura Vida Apps is licensed under a Creative Commons Attribution-ShareAlike 3.0 Unported License
with attribution (name=Pura Vida Apps and link to the source site) required.

Home | Snippets | Tutorials | Extensions | Links | Search | Privacy Policy | Contact