맞춤 스크롤을 사용 설정하는 버튼 만들기

사용자가 목록의 특정 지점으로 스크롤을 스냅할 수 있는 버튼을 표시하여 시간을 절약하고 사용자 참여도를 높일 수 있습니다.

버전 호환성

이 구현을 사용하려면 프로젝트 minSDK를 API 수준 21 이상으로 설정해야 합니다.

종속 항목

맞춤 스크롤을 사용 설정하는 버튼 만들기

다음 코드를 사용하여 10개의 항목이 있는 세로 레이지 목록에서 원활하게 스크롤할 수 있는 버튼을 만듭니다.

@Composable
fun MessageList(modifier: Modifier = Modifier) {
    val listState = rememberLazyListState()
    val coroutineScope = rememberCoroutineScope()

    LazyColumn(state = listState, modifier = Modifier.height(120.dp)) {
        items(10) { index ->
            Text(
                modifier = Modifier.height(40.dp),
                text = "Item $index"
            )
        }
    }

    Button(onClick = {
        coroutineScope.launch {
            listState.animateScrollToItem(index = 0)
        }
    }) {
        Text(text = "Go top")
    }
}

코드 관련 핵심 사항

  • listState 객체를 사용하여 선택한 위치에 LazyColumn의 스크롤 상태를 저장합니다.
  • 코루틴을 실행하여 스크롤 작업을 애니메이션 처리하는 동안 색인이 생성된 항목으로 스크롤하는 listState.animateScrollToItem를 호출합니다.

결과

활성 버튼이 있는 세로 스크롤 목록
그림 1. 스냅 스크롤 버튼이 있는 세로 스크롤 목록

이 가이드가 포함된 컬렉션

이 가이드는 더 광범위한 Android 개발 목표를 다루는 선별된 빠른 가이드 모음의 일부입니다.

목록과 그리드를 사용하면 앱에서 사용자가 쉽게 소비할 수 있는 시각적으로 만족스러운 형식으로 컬렉션을 표시할 수 있습니다.
구성 가능한 함수를 사용하여 Material Design 디자인 시스템을 기반으로 멋진 UI 구성요소를 쉽게 만드는 방법을 알아보세요.
이 동영상 시리즈에서는 다양한 Compose API를 소개하고 사용 가능한 API와 사용 방법을 빠르게 보여줍니다.

질문이나 의견이 있으신가요?

자주 묻는 질문(FAQ) 페이지로 이동하여 빠른 가이드를 알아보거나 문의하여 의견을 보내주세요.