CheckBox

import { CheckBox } from "material.slint";
export component Example inherits Window {
    width: 200px;
    height: 100px;
    background: transparent;
    CheckBox {
        x: 10px;
        y: 10px;
    }
}

slint

A CheckBox is a control that allows users to select one or more options from a set. It can be in three states: unchecked, checked, or partially checked (when tristate is enabled).

Properties

check_state

CheckState (in-out) default: CheckState.unchecked

The current state of the checkbox. Can be unchecked, partially_checked, or checked.

CheckBox {
    check_state: CheckState.checked;
}

slint

checked

bool (out) default: false

Whether the checkbox is checked (either fully or partially).

enabled

bool default: true

Whether the checkbox is enabled and can be interacted with.

error

bool default: false

Whether the checkbox should display an error state.

tristate

bool default: false

Whether the checkbox supports three states (unchecked, partially checked, checked).

Functions

toggle()

Toggles the checkbox state. In tristate mode, cycles through unchecked → partially checked → checked → unchecked.

CheckBox {
    clicked() => {
        self.toggle();
    }
}

slint