viewcompose-ui-foundation/com.viewcompose.ui.foundation/CircularProgressIndicator

CircularProgressIndicator

fun UiTreeBuilder.CircularProgressIndicator(progress: Float? = null, overrides: CircularProgressIndicatorOverrides = CircularProgressIndicatorOverrides.None, key: Any? = null, modifier: Modifier = Modifier)(source)

Emits a circular determinate or indeterminate progress indicator.

A null progress selects indeterminate mode. Appearance resolves once from instance, scoped, and semantic defaults in that order.

Receiver

active tree builder that receives the emitted indicator node

Parameters

progress

determinate fraction interpreted by the renderer, or null for indeterminate mode

overrides

sparse instance appearance applied after scoped ProvideCircularProgressIndicatorOverrides

key

optional stable sibling identity used during reconciliation

modifier

ordered configuration appended after the resolved square size

Samples

val node = buildVNodeTree {
    ProvideButtonOverrides(ButtonOverrides(contentColor = 0xFFFFFFFF.toInt())) {
        ProvideButtonOverrides(ButtonOverrides(containerColor = 0xFF0055AA.toInt())) {
            Button(
                text = "Scoped action",
                overrides = ButtonOverrides(borderWidth = 2.dp),
            )
        }
    }
}.single()
val spec = node.spec as ButtonNodeProps

check(spec.textColor == 0xFFFFFFFF.toInt())
check(spec.backgroundColor == 0xFF0055AA.toInt())
check(spec.borderWidth == 2.dp)

val actionNodes = buildVNodeTree {
    Column {
        Button(text = "Learn more", onClick = {}, variant = ButtonVariant.Text)
        ProvideIconButtonOverrides(IconButtonOverrides(contentColor = 0xFF0055AA.toInt())) {
            IconButton(
                icon = ImageSource.Resource(1),
                contentDescription = "Close",
                onClick = {},
            )
        }
    }
}.single()
check(actionNodes.children.size == 2)

val inputNodes = buildVNodeTree {
    ProvideTextFieldOverrides(TextFieldOverrides(containerColor = 0xFFF4F6F8.toInt())) {
        ProvideCheckboxOverrides(CheckboxOverrides(uncheckedColor = 0xFF667788.toInt())) {
            ProvideSwitchOverrides(
                SwitchOverrides(
                    checkedThumbColor = 0xFFFFFFFF.toInt(),
                    checkedTrackColor = 0xFF0055AA.toInt(),
                ),
            ) {
                ProvideRadioButtonOverrides(
                    RadioButtonOverrides(checkedColor = 0xFF0055AA.toInt()),
                ) {
                    ProvideSliderOverrides(
                        SliderOverrides(activeTrackColor = 0xFF0055AA.toInt()),
                    ) {
                        Column {
                            TextField(state = TextFieldState(), placeholder = "Name")
                            Checkbox(text = "Email updates", checked = false, onCheckedChange = {})
                            Switch(text = "Sync", checked = true, onCheckedChange = {})
                            RadioButton(text = "Primary", checked = true, onCheckedChange = {})
                            Slider(value = 50, onValueChange = {})
                        }
                    }
                }
            }
        }
    }
}.single()
check(inputNodes.children.size == 5)

val navigationNodes = buildVNodeTree {
    Column {
        ProvideSegmentedControlOverrides(
            SegmentedControlOverrides(indicatorColor = 0xFF0055AA.toInt()),
        ) {
            SegmentedControl(
                items = listOf(
                    SegmentedControlItem(key = "day", label = "Day"),
                    SegmentedControlItem(key = "week", label = "Week"),
                ),
                selectedIndex = 0,
                onSelectionChange = {},
            )
        }
        ProvideTabRowOverrides(TabRowOverrides(indicatorColor = 0xFF0055AA.toInt())) {
            TabRow(selectedIndex = 0, onTabSelected = {}) {
                Tab(
                    key = "summary",
                    contentRevision = StaticContentRevision,
                ) { Text("Summary") }
            }
        }
        ProvideNavigationBarOverrides(
            NavigationBarOverrides(indicatorColor = 0xFFCCE4FF.toInt()),
        ) {
            NavigationBar(selectedIndex = 0, onItemSelected = {}) {
                Item(key = "home", label = "Home", icon = ImageSource.Resource(1))
            }
        }
        ProvideLinearProgressIndicatorOverrides(
            LinearProgressIndicatorOverrides(indicatorColor = 0xFF0055AA.toInt()),
        ) {
            LinearProgressIndicator(progress = 0.5f)
        }
        ProvideCircularProgressIndicatorOverrides(
            CircularProgressIndicatorOverrides(indicatorColor = 0xFF0055AA.toInt()),
        ) {
            CircularProgressIndicator(progress = 0.5f)
        }
    }
}.single()
check(navigationNodes.children.size == 5)