Checkbox
Checkboxes allow users to select one or more items from a set. Checkboxes can turn an option on or off.
Parameters
whether Checkbox is checked or unchecked
callback to be invoked when checkbox is being clicked, therefore the change of checked state is requested. If null, then this is passive and relies entirely on a higher-level component to control the "checked" state.
Modifier to be applied to the layout of the checkbox
whether the component is enabled or grayed out
The content size of the CheckBox.
CheckboxColor that will be used to determine the color of the checkmark / box / border in different states.
the MutableInteractionSource representing the stream of Interactions for this Checkbox. You can create and pass in your own remembered MutableInteractionSource if you want to observe Interactions and customize the appearance / behavior of this Checkbox in different Interactions.
See also
if you require support for an indeterminate state, or more advanced color customization between states.
Samples
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.state.ToggleableState
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.pico.spatial.ui.design.Checkbox
import com.pico.spatial.ui.design.Text
import com.pico.spatial.ui.design.TriStateCheckbox
fun main() {
//sampleStart
var checked by remember { mutableStateOf(true) }
Checkbox(
modifier = Modifier.semantics { contentDescription = "Demo" },
checked = checked,
onCheckedChange = { checked = !it },
)
//sampleEnd
}Checkboxes allow users to select one or more items from a set. Checkboxes can turn an option on or off.
Parameters
whether Checkbox is checked or unchecked
callback to be invoked when checkbox is being clicked, therefore the change of checked state is requested. If null, then this is passive and relies entirely on a higher-level component to control the "checked" state.
Modifier to be applied to the layout of the checkbox
whether the component is enabled or grayed out
The content size of the CheckBox.
CheckboxColor that will be used to determine the color of the checkmark / box / border in different states.
CheckboxVibrants that will be used to determine the vibrant of the checkmark / box / border in different states.
the MutableInteractionSource representing the stream of Interactions for this Checkbox. You can create and pass in your own remembered MutableInteractionSource if you want to observe Interactions and customize the appearance / behavior of this Checkbox in different Interactions.
See also
if you require support for an indeterminate state, or more advanced color customization between states.
Samples
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.state.ToggleableState
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.pico.spatial.ui.design.Checkbox
import com.pico.spatial.ui.design.Text
import com.pico.spatial.ui.design.TriStateCheckbox
fun main() {
//sampleStart
var checked by remember { mutableStateOf(true) }
Checkbox(
modifier = Modifier.semantics { contentDescription = "Demo" },
checked = checked,
onCheckedChange = { checked = !it },
)
//sampleEnd
}