rememberTransformingLazyColumnFirstLayoutItemProvider

Functions summary

Functions

rememberTransformingLazyColumnFirstLayoutItemProvider

@Composable
fun rememberTransformingLazyColumnFirstLayoutItemProvider(
    itemInfo: () -> TransformingLazyColumnFirstLayoutItemProvider.ItemInfo?
): TransformingLazyColumnFirstLayoutItemProvider

Creates and remembers a TransformingLazyColumnFirstLayoutItemProvider that delegates to the provided itemInfo lambda.

import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.mutableIntStateOf
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.wear.compose.foundation.lazy.TransformingLazyColumn
import androidx.wear.compose.foundation.lazy.TransformingLazyColumnFirstLayoutItemProvider
import androidx.wear.compose.foundation.lazy.rememberTransformingLazyColumnState
import androidx.wear.compose.material3.AppScaffold
import androidx.wear.compose.material3.Card
import androidx.wear.compose.material3.CardDefaults
import androidx.wear.compose.material3.OutlinedCard
import androidx.wear.compose.material3.ScreenScaffold
import androidx.wear.compose.material3.SurfaceTransformation
import androidx.wear.compose.material3.Text
import androidx.wear.compose.material3.lazy.layoutItemInfoOf
import androidx.wear.compose.material3.lazy.rememberTransformationSpec
import androidx.wear.compose.material3.lazy.rememberTransformingLazyColumnFirstLayoutItemProvider
import androidx.wear.compose.material3.lazy.transformedHeight

val state = rememberTransformingLazyColumnState()
val transformationSpec = rememberTransformationSpec()

// This sample demonstrates how to use rememberTransformingLazyColumnFirstLayoutItemProvider
// to control the expansion direction of a dynamically resizing item. By using the voice input
// card's Bottom/End edge as the layout reference, the card predictably expands upwards.
// The constant key safely falls back to default layout behavior when scrolled off-screen.
val firstLayoutItemProvider = rememberTransformingLazyColumnFirstLayoutItemProvider {
    state.layoutItemInfoOf(
        itemKey = "voice_input",
        itemEdge = TransformingLazyColumnFirstLayoutItemProvider.ItemEdge.End,
    )
}

var isListening by remember { mutableStateOf(false) }
var lineCount by remember { mutableIntStateOf(0) }
// Simple loop simulating text lines arriving over time
LaunchedEffect(isListening) {
    if (isListening) {
        while (lineCount < 5) {
            delay(300)
            lineCount++
        }
        isListening = false
    }
}

AppScaffold {
    ScreenScaffold(state) { contentPadding ->
        TransformingLazyColumn(
            state = state,
            contentPadding = contentPadding,
            firstLayoutItemProvider = firstLayoutItemProvider,
        ) {
            items(count = 3, key = { "message_$it" }) { index ->
                Card(
                    onClick = {},
                    modifier =
                        Modifier.minimumVerticalContentPadding(
                                CardDefaults.minimumVerticalListContentPadding
                            )
                            .transformedHeight(this, transformationSpec)
                            .animateItem(placementSpec = null),
                    transformation = SurfaceTransformation(transformationSpec),
                ) {
                    Text("Previous message $index")
                }
            }

            item(key = "voice_input") {
                val voiceText = (1..lineCount).joinToString("\n") { "Voice Input line $it" }

                OutlinedCard(
                    onClick = {
                        if (lineCount >= 5) lineCount = 0
                        isListening = !isListening
                    },
                    modifier =
                        Modifier.minimumVerticalContentPadding(
                                CardDefaults.minimumVerticalListContentPadding
                            )
                            .transformedHeight(this, transformationSpec)
                            .animateItem(placementSpec = null),
                    transformation = SurfaceTransformation(transformationSpec),
                ) {
                    Text(text = voiceText.ifEmpty { "Tap to speak" })
                }
            }
        }
    }
}
Parameters
itemInfo: () -> TransformingLazyColumnFirstLayoutItemProvider.ItemInfo?

A lambda returning the TransformingLazyColumnFirstLayoutItemProvider.ItemInfo of the item to use as the first item to layout, or null to fall back to the default layout behavior.