ListSubHeader

ListHeaderSample

@Preview
@Composable
fun ListHeaderSample() {
    val transformationSpec = rememberTransformationSpec()
    val scrollState = rememberTransformingLazyColumnState()
    AppScaffold {
        ScreenScaffold(scrollState = scrollState) { contentPadding ->
            TransformingLazyColumn(
                state = scrollState,
                modifier = Modifier.fillMaxSize(),
                horizontalAlignment = Alignment.CenterHorizontally,
                contentPadding = contentPadding,
            ) {
                item {
                    ListHeader(
                        modifier =
                            Modifier.minimumVerticalContentPadding(
                                    ListHeaderDefaults.minimumTopListContentPadding,
                                    ListHeaderDefaults.minimumBottomListContentPadding,
                                )
                                .transformedHeight(this, transformationSpec),
                        transformation = SurfaceTransformation(transformationSpec),
                    ) {
                        Text("Settings")
                    }
                }
                item {
                    ListSubHeader(
                        modifier =
                            Modifier.minimumVerticalContentPadding(
                                    ListHeaderDefaults.minimumTopListContentPadding,
                                    ListHeaderDefaults.minimumBottomListContentPadding,
                                )
                                .transformedHeight(this, transformationSpec),
                        transformation = SurfaceTransformation(transformationSpec),
                        icon = {
                            Icon(
                                painter = painterResource(R.drawable.ic_connectivity),
                                contentDescription = "Connectivity",
                            )
                        },
                        label = { Text("Connectivity") },
                    )
                }
                item {
                    Button(
                        modifier =
                            Modifier.fillMaxWidth()
                                .minimumVerticalContentPadding(
                                    ButtonDefaults.minimumVerticalListContentPadding
                                )
                                .transformedHeight(this, transformationSpec),
                        transformation = SurfaceTransformation(transformationSpec),
                        onClick = {},
                        icon = {
                            Icon(
                                painter = painterResource(R.drawable.ic_bluetooth),
                                contentDescription = "Bluetooth",
                                modifier = Modifier.size(ButtonDefaults.IconSize),
                            )
                        },
                    ) {
                        Text("Bluetooth")
                    }
                }
                item {
                    Button(
                        modifier =
                            Modifier.fillMaxWidth()
                                .minimumVerticalContentPadding(
                                    ButtonDefaults.minimumVerticalListContentPadding
                                )
                                .transformedHeight(this, transformationSpec),
                        transformation = SurfaceTransformation(transformationSpec),
                        onClick = {},
                        icon = {
                            Icon(
                                painter = painterResource(R.drawable.ic_wifi),
                                contentDescription = "Wifi",
                                modifier = Modifier.size(ButtonDefaults.IconSize),
                            )
                        },
                    ) {
                        Text("Wifi")
                    }
                }
                item {
                    ListSubHeader(
                        modifier =
                            Modifier.minimumVerticalContentPadding(
                                    ListHeaderDefaults.minimumTopListContentPadding,
                                    ListHeaderDefaults.minimumBottomListContentPadding,
                                )
                                .transformedHeight(this, transformationSpec),
                        transformation = SurfaceTransformation(transformationSpec),
                    ) {
                        Text("Display")
                    }
                }
                item {
                    Button(
                        modifier =
                            Modifier.fillMaxWidth()
                                .minimumVerticalContentPadding(
                                    ButtonDefaults.minimumVerticalListContentPadding
                                )
                                .transformedHeight(this, transformationSpec),
                        transformation = SurfaceTransformation(transformationSpec),
                        onClick = {},
                    ) {
                        Text("Change Watchface")
                    }
                }
                item {
                    Button(
                        modifier =
                            Modifier.fillMaxWidth()
                                .minimumVerticalContentPadding(
                                    ButtonDefaults.minimumVerticalListContentPadding
                                )
                                .transformedHeight(this, transformationSpec),
                        transformation = SurfaceTransformation(transformationSpec),
                        onClick = {},
                    ) {
                        Text("Brightness")
                    }
                }
            }
        }
    }
}