ScalingLazyColumn

Composable Function

Android

Deprecated Please use the new overload with additional rotaryBehavior parameter

@Composable
public fun ScalingLazyColumn(
    modifier: Modifier = Modifier,
    state: ScalingLazyListState = rememberScalingLazyListState(),
    contentPadding: PaddingValues = PaddingValues(horizontal = 10.dp),
    reverseLayout: Boolean = false,
    verticalArrangement: Arrangement.Vertical =
        Arrangement.spacedBy(
            space = 4.dp,
            alignment = if (!reverseLayout) Alignment.Top else Alignment.Bottom,
        ),
    horizontalAlignment: Alignment.Horizontal = Alignment.CenterHorizontally,
    flingBehavior: FlingBehavior = ScrollableDefaults.flingBehavior(),
    userScrollEnabled: Boolean = true,
    scalingParams: ScalingParams = ScalingLazyColumnDefaults.scalingParams(),
    anchorType: ScalingLazyListAnchorType = ScalingLazyListAnchorType.ItemCenter,
    autoCentering: AutoCenteringParams? = AutoCenteringParams(),
    content: ScalingLazyListScope.() -> Unit,
)

A scrolling scaling/fisheye list component that forms a key part of the Wear Material Design language. Provides scaling and transparency effects to the content items.

ScalingLazyColumn is designed to be able to handle potentially large numbers of content items. Content items are only materialized and composed when needed.

If scaling/fisheye functionality is not required then a LazyColumn should be considered instead to avoid any overhead of measuring and calculating scaling and transparency effects for the content items.

This overload supports rotary input. Rotary input allows users to scroll the content of the ScalingLazyColumn - by using a crown or a rotating bezel on their Wear OS device. If you want to modify its behavior please use another ScalingLazyColumn overload with rotaryBehavior parameter.

Example of a ScalingLazyColumn with default parameters:

Example of a ScalingLazyColumn using ScalingLazyListAnchorType.ItemStart anchoring, in this configuration the edge of list items is aligned to the center of the screen. Also this example shows scrolling to a clicked list item with ScalingLazyListState.animateScrollToItem:

Example of a ScalingLazyColumn with snap of items to the viewport center:

Example of a ScalingLazyColumn where autoCentering has been disabled and explicit contentPadding provided to ensure there is space above the first and below the last list item to allow them to be scrolled into view on circular screens:

For more information, see the Lists(https://developer.android.com/training/wearables/components/lists) guide.

Parameters

modifierThe modifier to be applied to the component
stateThe state of the component
contentPaddingThe padding to apply around the contents
reverseLayoutreverse the direction of scrolling and layout, when true items will be composed from the bottom to the top
verticalArrangementThe vertical arrangement of the layout's children. This allows us to add spacing between items and specify the arrangement of the items when we have not enough of them to fill the whole minimum size
horizontalAlignmentthe horizontal alignment applied to the items
flingBehaviorLogic describing fling behavior. If snapping is required use ScalingLazyColumnDefaults.snapFlingBehavior.
userScrollEnabledwhether the scrolling via the user gestures or accessibility actions is allowed. You can still scroll programmatically using the state even when it is disabled.
scalingParamsThe parameters to configure the scaling and transparency effects for the component
anchorTypeHow to anchor list items to the center-line of the viewport
autoCenteringAutoCenteringParams parameter to control whether space/padding should be automatically added to make sure that list items can be scrolled into the center of the viewport (based on their anchorType). If non-null then space will be added before the first list item, if needed, to ensure that items with indexes greater than or equal to the itemIndex (offset by itemOffset pixels) will be able to be scrolled to the center of the viewport. Similarly space will be added at the end of the list to ensure that items can be scrolled up to the center. If null no automatic space will be added and instead the developer can use contentPadding to manually arrange the items.
contentThe content of the ScalingLazyColumn
Android

Deprecated Please use the new overload with additional overscrollEffect parameter

@Composable
public fun ScalingLazyColumn(
    modifier: Modifier = Modifier,
    state: ScalingLazyListState = rememberScalingLazyListState(),
    contentPadding: PaddingValues = PaddingValues(horizontal = 10.dp),
    reverseLayout: Boolean = false,
    verticalArrangement: Arrangement.Vertical =
        Arrangement.spacedBy(
            space = 4.dp,
            alignment = if (!reverseLayout) Alignment.Top else Alignment.Bottom,
        ),
    horizontalAlignment: Alignment.Horizontal = Alignment.CenterHorizontally,
    flingBehavior: FlingBehavior = ScrollableDefaults.flingBehavior(),
    userScrollEnabled: Boolean = true,
    scalingParams: ScalingParams = ScalingLazyColumnDefaults.scalingParams(),
    anchorType: ScalingLazyListAnchorType = ScalingLazyListAnchorType.ItemCenter,
    autoCentering: AutoCenteringParams? = AutoCenteringParams(),
    rotaryScrollableBehavior: RotaryScrollableBehavior? = RotaryScrollableDefaults.behavior(state),
    content: ScalingLazyListScope.() -> Unit,
): Unit

A scrolling scaling/fisheye list component that forms a key part of the Wear Material Design language. Provides scaling and transparency effects to the content items.

ScalingLazyColumn is designed to be able to handle potentially large numbers of content items. Content items are only materialized and composed when needed.

If scaling/fisheye functionality is not required then a LazyColumn should be considered instead to avoid any overhead of measuring and calculating scaling and transparency effects for the content items.

This overload supports rotary input. Rotary input allows users to scroll the content of the ScalingLazyColumn - by using a crown or a rotating bezel on their Wear OS device. It can be modified with rotaryScrollableBehavior param. If scroll with fling is required use RotaryScrollableDefaults.behavior. If snapping is required use RotaryScrollableDefaults.snapBehavior. Note that rotary scroll and touch scroll should be aligned. If rotaryScrollableBehavior is set for snap (using RotaryScrollableDefaults.snapBehavior), flingBehavior should be set for snap as well (using ScalingLazyColumnDefaults.snapFlingBehavior). This composable uses requestFocusOnHierarchyActive to request focus for rotary support. It requires that this ScalingLazyColumn this can be configured by adding hierarchicalFocusGroup to the modifier parameter or on an ancestor composable. hierarchicalFocusGroup is already used in BasicSwipeToDismissBox (and other components), which is a part of material Scaffold - meaning that, in most cases, rotary will be able to request focus without any additional changes.

Example of a ScalingLazyColumn with default parameters:

Example of a ScalingLazyColumn using ScalingLazyListAnchorType.ItemStart anchoring, in this configuration the edge of list items is aligned to the center of the screen. Also this example shows scrolling to a clicked list item with ScalingLazyListState.animateScrollToItem:

Example of a ScalingLazyColumn with snap of items to the viewport center:

Example of a ScalingLazyColumn where autoCentering has been disabled and explicit contentPadding provided to ensure there is space above the first and below the last list item to allow them to be scrolled into view on circular screens:

For more information, see the Lists(https://developer.android.com/training/wearables/components/lists) guide.

Parameters

modifierThe modifier to be applied to the component
stateThe state of the component
contentPaddingThe padding to apply around the contents
reverseLayoutreverse the direction of scrolling and layout, when true items will be composed from the bottom to the top
verticalArrangementThe vertical arrangement of the layout's children. This allows us to add spacing between items and specify the arrangement of the items when we have not enough of them to fill the whole minimum size
horizontalAlignmentthe horizontal alignment applied to the items
flingBehaviorLogic describing fling behavior for touch scroll. If snapping is required use ScalingLazyColumnDefaults.snapFlingBehavior. Note that when configuring fling or snap behavior, this flingBehavior parameter and the rotaryScrollableBehavior parameter that controls rotary scroll are expected to produce similar list scrolling. For example, if rotaryScrollableBehavior is set for snap (using RotaryScrollableDefaults.snapBehavior), flingBehavior should be set for snap as well (using ScalingLazyColumnDefaults.snapFlingBehavior)
userScrollEnabledwhether the scrolling via the user gestures or accessibility actions is allowed. You can still scroll programmatically using the state even when it is disabled.
scalingParamsThe parameters to configure the scaling and transparency effects for the component
anchorTypeHow to anchor list items to the center-line of the viewport
autoCenteringAutoCenteringParams parameter to control whether space/padding should be automatically added to make sure that list items can be scrolled into the center of the viewport (based on their anchorType). If non-null then space will be added before the first list item, if needed, to ensure that items with indexes greater than or equal to the itemIndex (offset by itemOffset pixels) will be able to be scrolled to the center of the viewport. Similarly space will be added at the end of the list to ensure that items can be scrolled up to the center. If null no automatic space will be added and instead the developer can use contentPadding to manually arrange the items.
rotaryScrollableBehaviorParameter for changing rotary scrollable behavior. Supports scroll RotaryScrollableDefaults.behavior and snap RotaryScrollableDefaults.snapBehavior. Note that when configuring fling or snap behavior, this rotaryBehavior parameter and the flingBehavior parameter that controls touch scroll are expected to produce similar list scrolling. For example, if rotaryScrollableBehavior is set for snap (using RotaryScrollableDefaults.snapBehavior), flingBehavior should be set for snap as well (using ScalingLazyColumnDefaults.snapFlingBehavior). Can be null if rotary support is not required or when it should be handled externally - with a separate Modifier.rotaryScrollable modifier.
contentThe content of the ScalingLazyColumn
Android
@Composable
public fun ScalingLazyColumn(
    modifier: Modifier = Modifier,
    state: ScalingLazyListState = rememberScalingLazyListState(),
    contentPadding: PaddingValues = PaddingValues(horizontal = 10.dp),
    reverseLayout: Boolean = false,
    verticalArrangement: Arrangement.Vertical =
        Arrangement.spacedBy(
            space = 4.dp,
            alignment = if (!reverseLayout) Alignment.Top else Alignment.Bottom,
        ),
    horizontalAlignment: Alignment.Horizontal = Alignment.CenterHorizontally,
    flingBehavior: FlingBehavior = ScrollableDefaults.flingBehavior(),
    userScrollEnabled: Boolean = true,
    scalingParams: ScalingParams = ScalingLazyColumnDefaults.scalingParams(),
    anchorType: ScalingLazyListAnchorType = ScalingLazyListAnchorType.ItemCenter,
    autoCentering: AutoCenteringParams? = AutoCenteringParams(),
    rotaryScrollableBehavior: RotaryScrollableBehavior? = RotaryScrollableDefaults.behavior(state),
    overscrollEffect: OverscrollEffect? = rememberOverscrollEffect(),
    content: ScalingLazyListScope.() -> Unit,
)

A scrolling scaling/fisheye list component that forms a key part of the Wear Material Design language. Provides scaling and transparency effects to the content items.

ScalingLazyColumn is designed to be able to handle potentially large numbers of content items. Content items are only materialized and composed when needed.

If scaling/fisheye functionality is not required then a LazyColumn should be considered instead to avoid any overhead of measuring and calculating scaling and transparency effects for the content items.

This overload supports rotary input. Rotary input allows users to scroll the content of the ScalingLazyColumn - by using a crown or a rotating bezel on their Wear OS device. It can be modified with rotaryScrollableBehavior param. If scroll with fling is required use RotaryScrollableDefaults.behavior. If snapping is required use RotaryScrollableDefaults.snapBehavior. Note that rotary scroll and touch scroll should be aligned. If rotaryScrollableBehavior is set for snap (using RotaryScrollableDefaults.snapBehavior), flingBehavior should be set for snap as well (using ScalingLazyColumnDefaults.snapFlingBehavior). This composable uses requestFocusOnHierarchyActive to request focus for rotary support. It requires that this ScalingLazyColumn this can be configured by adding hierarchicalFocusGroup to the modifier parameter or on an ancestor composable. hierarchicalFocusGroup is already used in BasicSwipeToDismissBox (and other components), which is a part of material Scaffold - meaning that, in most cases, rotary will be able to request focus without any additional changes.

Example of a ScalingLazyColumn with default parameters:

Example of a ScalingLazyColumn using ScalingLazyListAnchorType.ItemStart anchoring, in this configuration the edge of list items is aligned to the center of the screen. Also this example shows scrolling to a clicked list item with ScalingLazyListState.animateScrollToItem:

Example of a ScalingLazyColumn with snap of items to the viewport center:

Example of a ScalingLazyColumn where autoCentering has been disabled and explicit contentPadding provided to ensure there is space above the first and below the last list item to allow them to be scrolled into view on circular screens:

For more information, see the Lists(https://developer.android.com/training/wearables/components/lists) guide.

Parameters

modifierThe modifier to be applied to the component
stateThe state of the component
contentPaddingThe padding to apply around the contents
reverseLayoutreverse the direction of scrolling and layout, when true items will be composed from the bottom to the top
verticalArrangementThe vertical arrangement of the layout's children. This allows us to add spacing between items and specify the arrangement of the items when we have not enough of them to fill the whole minimum size
horizontalAlignmentthe horizontal alignment applied to the items
flingBehaviorLogic describing fling behavior for touch scroll. If snapping is required use ScalingLazyColumnDefaults.snapFlingBehavior. Note that when configuring fling or snap behavior, this flingBehavior parameter and the rotaryScrollableBehavior parameter that controls rotary scroll are expected to produce similar list scrolling. For example, if rotaryScrollableBehavior is set for snap (using RotaryScrollableDefaults.snapBehavior), flingBehavior should be set for snap as well (using ScalingLazyColumnDefaults.snapFlingBehavior)
userScrollEnabledwhether the scrolling via the user gestures or accessibility actions is allowed. You can still scroll programmatically using the state even when it is disabled.
scalingParamsThe parameters to configure the scaling and transparency effects for the component
anchorTypeHow to anchor list items to the center-line of the viewport
autoCenteringAutoCenteringParams parameter to control whether space/padding should be automatically added to make sure that list items can be scrolled into the center of the viewport (based on their anchorType). If non-null then space will be added before the first list item, if needed, to ensure that items with indexes greater than or equal to the itemIndex (offset by itemOffset pixels) will be able to be scrolled to the center of the viewport. Similarly space will be added at the end of the list to ensure that items can be scrolled up to the center. If null no automatic space will be added and instead the developer can use contentPadding to manually arrange the items.
rotaryScrollableBehaviorParameter for changing rotary scrollable behavior. Supports scroll RotaryScrollableDefaults.behavior and snap RotaryScrollableDefaults.snapBehavior. Note that when configuring fling or snap behavior, this rotaryBehavior parameter and the flingBehavior parameter that controls touch scroll are expected to produce similar list scrolling. For example, if rotaryScrollableBehavior is set for snap (using RotaryScrollableDefaults.snapBehavior), flingBehavior should be set for snap as well (using ScalingLazyColumnDefaults.snapFlingBehavior). Can be null if rotary support is not required or when it should be handled externally - with a separate Modifier.rotaryScrollable modifier.
overscrollEffectthe OverscrollEffect that will be used to render overscroll for this layout. Note that the OverscrollEffect.node will be applied internally as well - you do not need to use Modifier.overscroll separately.
contentThe content of the ScalingLazyColumn