Checkbox
The Checkbox widget is a selection widget that toggles between two states, on and off. Use it for terms-of-service consent, multi-select lists, and similar cases.
info
Example file: 07_Work_with_Widgets/checkbox_objet.lfp
Definition and role
The Checkbox widget draws a square check area, and tapping it animates the switch between checked and unchecked. Every state change runs the onChanged action. Set the size, colors, and border.
- Category: Contents (input and selection)
- Default state: off (unchecked)
Features
| Feature | Description |
|---|---|
| Two-state toggle | Tapping switches between checked and unchecked, with a transition animation. |
| Change detection | onChanged runs whenever the state changes and passes the new value. |
| Appearance settings | Adjusts the size, border, checked and unchecked background colors, and check mark color. |
How to use
- Open the Contents category in the left widget palette.
- Drag and drop the Checkbox item onto the canvas.
- Set the initial state (
value), the size, and the colors in the Properties panel. - Connect the action to run on a state change to
onChanged.
Properties
| Property | Description | Default | Value / type |
|---|---|---|---|
value | Whether the box is checked (initial state) | Off (false) | True / false |
size | Checkbox size | 30 | Number (px) |
borderColor | Border color | #666666 | Color |
borderWidth | Border thickness | 1 | Number (0 or greater) |
borderRadius | Corner radius | 0 | Number |
activeColor | Background color when checked | #00AAFF | Color |
inactiveColor | Background color when unchecked | #FFFFFF | Color |
checkColor | Check mark (✔) color | #FF0000 | Color |
unCheckColor | Unchecked mark color | Transparent | Color |
Notes and tips
tip
The action connected to onChanged receives the state value after the change — true or false.
tip
Style the checked state with both activeColor (the background) and checkColor (the ✔ mark).
Learn more
tip
For the full set of Widget Control items (Property, Method, and Event) that script this widget, visit Checkbox Widget Control.