Stay organized with collections
Save and categorize content based on your preferences.
Lists are continuous, vertical indexes of elements. Use ScalingLazyColumn
to create lists on Wear OS.
ScalingLazyColumn is built specifically for Wear OS and extends
the LazyColumn class. Lists offer scaling and transparency,
which allows content to shrink and fade at the top and bottom of the screen
to help users see what to focus on. Lists are anchored on the center of the
screen, which gives additional emphasis to the items in the middle of the
list.
Lists can contain items of fixed or variable height. List content should
have margin enough to accommodate for circular displays. If
autoCentering is enabled, both the first and last item in
the last will be centered in the viewport when you scroll to that point in
the list.
Snapping behavior
To give emphasis to a list item when scrolling, use snapping. Use snapping
when items are tall but not taller than the screen.
Snapping behaviour comes in two forms. ItemCenter uses the
center of the item as a reference point. ItemStart uses the
edge of the item as a reference point. Use the first to center one item on
the screen, use the second to center two items on the screen. Set this
behavior using the
anchorType parameter.
For further control over the snapping behavior in a list, define custom
flingBehavior in your ScalingLazyColumn
declaration.
Usage
See the following examples of how to use lists on watches.
Content and code samples on this page are subject to the licenses described in the Content License. Java and OpenJDK are trademarks or registered trademarks of Oracle and/or its affiliates.
Last updated 2024-01-03 UTC.
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"Missing the information I need"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"Too complicated / too many steps"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"Out of date"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"Samples / code issue"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"Other"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"Easy to understand"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"Solved my problem"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"Other"
}]