Skip to main content

CheckBox

CheckBox​

Toggleable boolean control. Emits .onCheckChange((event)) with { isChecked }.

Quick Start​

Controls Checkbox

@view('ControlsCheckbox')
export class ControlsCheckboxView extends BaseExampleScreenView<ControlsCheckboxState> {
  @state isChecked: boolean = false;

  protected getViews(): ViewStruct<ViewState>[] {
    // --- edit below ---

    return [
      VGroup([
        Label({ text: this.isChecked ? 'Checked' : 'Unchecked' }),
        CheckBox({ text: 'Check me', isChecked: this.isChecked, height: 48 })
          .isInitialFocus(true)
          .onCheckChange((event) => { this.isChecked = event.isChecked; })
      ]).itemSpacing(12)
    ];

    // --- edit above ---
  }
}
Tip: Controlled State

Bind isChecked to a @state field and update it inside .onCheckChange.

API Reference​

CheckBox API