Checkbox - Create Customizable Checkboxes

Extensions
1

Create customizable checkboxes.

Configure the size, border color, fill color, and verification style of the checkboxes. Additionally, it includes an event that is fired when the checkbox changes state.

New features added

Features:

blocks (4)
blocks (4)1092×578 62 KB

  • parent: 'AndroidViewComponent' - Parent component in which the checkbox will be added.
  • id: 'int' - Unique identifier for the checkbox.
  • size: 'int' - Size of the checkbox.
  • checkedColorHex: 'String' - Color in hexadecimal for the checked state.
  • borderWidth: 'int' - Width of the checkbox border.
  • borderColorHex: 'String' - Hexadecimal color for the border.
  • verificationStyle: 'String' - Verification style (e.g., "Check", "Cross", "Circle", "Rounded", "Triangle", "Rectangle", "Star", "HorizontalLine").
  • text: ''String' - Text associated with the checkbox.
  • textColorHex: 'String' - Hexadecimal color for the text.
  • textSize: 'int' - Text size.

blocks (5)
blocks (5)812×162 14.9 KB

  • id: 'int' - Unique identifier of the checkbox.
  • visible: 'boolean' - Visibility of the checkbox (true for visible, false for hidden).

component_method

  • id: 'int' - Unique identifier of the checkbox.
  • newText: 'String' - New text for the checkbox.

component_method (1)
component_method (1)752×158 12.8 KB

  • id: 'int' - Unique identifier of the checkbox.
  • newColorHex: 'String' - New color in hexadecimal for the checkbox text.

component_method (2)

  • id: 'int' - Unique identifier of the checkbox.

component_method (4)

  • id: 'int' - Unique identifier of the checkbox.
  • checked: 'boolean' - State of the checkbox (true for checked, false for unchecked).

blocks (3)
blocks (3)872×214 19.6 KB

  • id: 'int' - Unique identifier of the checkbox.
  • textSize: 'int' - Checkbox text size.
  • textStyle: 'int' - Style of the text (e.g., Typeface.NORMAL, Typeface.BOLD, etc.). (1 = NORMAL, 2 = BOLD, 3 = ITALIC).

component_method (6)
component_method (6)718×158 11.9 KB

  • id: 'int' - Unique identifier of the checkbox.
  • iconName: 'String' - Name of the icon resource.

component_method (3)

  • id: 'int' - Unique identifier of the checkbox.
  • size: 'int' - Size of the checkbox.

component_method (5)
component_method (5)778×158 13.6 KB

  • id: 'int' - Unique identifier of the checkbox.
  • verificationStyle: 'String' - Verification style (e.g., "Check", "Cross", "Circle", etc.).

Events:

component_event (2)

  • id: 'int' - Unique identifier of the checkbox.
  • isChecked: 'boolean' - State of the checkbox (true for checked, false for unchecked).

component_event (3)

  • id: 'int' - Unique identifier of the checkbox.

Example:

Screenshot_2024-06-09-22-58-33-809_edu.mit.appinventor.aicompanion3
Screenshot_2024-06-09-22-58-33-809_edu.mit.appinventor.aicompanion31080×2340 145 KB

Extension: Versión 2
CheckboxU.aix (14.5 KB)

Thanks.

6 Likes
3

What type of component is the "parent" ?

4

I used HorizontalArrangement, I have not tested it with any other component, I will do more tests later

5

Updated extension

8

Hi, I am new to App Inventor and I think I don't understand yet how to use this extension. I've installed it, but I don't get the call block above, but a slightly different one (no drop down list for CheckboxU1, just call CheckboxUCreateCheckBox, and an extra notch for Component which I don't know what block to fill with). And where should this call block go? Thank you!

EDIT: OK, I figured it out, Component should be filled with CheckboxU1, now to figure out the second part of the question, where does the entire call block go to create a custom checkbox.

9

Show me what you have done or send me your aia to verify it.

1 Like
10

Hi and thank you for the quick reply! I restarted and I got the call block to look exactly as above, but I still haven't managed to use it properly, sorry. I will send you a message with the .aia now, thank you again!

1 Like
11
  • Matanga says the Changa :rofl: :rofl: :rofl: :rofl: (even more funny)

Thanx for your work, i'll tested.

1 Like
12

Thank you.

In parent you will need to put a HorizontalArrangement.

Later I will change the block so that there is no confusion in that parameter.

1 Like
13

Now I'm testing it with dynamic components, as if it were a Badge (Favorite, Like, Etc.)

  • It would be good if you kept it in mind for an upcoming update. Well, it would be a great feature. :wink:

In fact, it has unlimited potential.

14

Are you referring to something similar to Facebook reactions?

1 Like
15

Yes, but imagine expand it to dynamics forms creation, social or product or customer surveys, etc.

Because sometimes you need information about feelings and how it made you feel because 0 to 100%, 0 to 10, True or False, etc. It does not return the necessary information.

That's why there's a lot of difference in how something or someone makes you feel, sense, and what you think and thought about it, etc.

Many times the reactions to something or someone are varied, including "weird".

  • all that emotions, feelings, thoughts, and reactions can be measured by True, False, even the Null ones gives you information about.

Memerize information:

:ok_hand: = it's ok
:pinched_fingers: = Whaaaaaaat....!!!
:+1: = i like it
:-1: = Dont like it
:nail_care: = I'm not interested, it's even worth my time, try something else.
:eyes: = WaTaFuuuuu!!!!!????...
:angry: = Angry
:rage: = Rage
:face_with_symbols_over_mouth: = Insult
:exploding_head: = Ooooohhh... wooooo!!!! Blow my mind!!!!
:astonished: = Astonished, I dont want it... i need it!!!!
:hushed: = Amazing! i want more
:open_mouth: = Amazing.

And now... What if?? every reaction it's stored (True, False, even Nulls) and take it by an a LLM like GPT, and resume reactions from 0<X.xx <100 about your actual/next product.

And balance Decisions, projects, etc. on that resumes?

1 Like
16

See! Sometimes it's not about seeing "the product" itself, but beyond!

  • That's what I saw in your extension.

:grimacing:

1 Like
17

This is interesting, I'll investigate more about it and see what I can do.

1 Like