Jetpack Compose - 检测 LazyColumn 的滚动位置何时位于第一个索引

Question

我想要为我的LazyColumn添加一个

滚动回到顶部按钮

。我成功地使按钮起作用了。但如果我已经位于

LazyColumn

的顶部，我希望它不可见。我怎样才能实现这个目标？

Answer 1

LazyColumn

具有

state

属性，如果您传递自定义值而不是默认值，则可以对状态更改做出反应。

为了防止冗余重组，在这种情况下应该使用

derivedStateOf

：只有当基于其他状态变量的生成结果发生更改时，它才会触发重组：

Box {
    val state = rememberLazyListState()
    LazyColumn(state = state) {
        // ...
    }
    val firstItemVisible by remember {
        derivedStateOf {
            state.firstVisibleItemIndex == 0
        }
    }
    if (!firstItemVisible) {
        Button(onClick = { /*TODO*/ }) {

        }
    }
}

Answer 2

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        startActivity(intent)

        setContent {
            val scrollState = rememberLazyListState()
            val coroutineScope = rememberCoroutineScope()

            Column(modifier = Modifier.fillMaxSize()) {
                if (scrollState.firstVisibleItemIndex > 0) {
                    Button(onClick = {
                        coroutineScope.launch {
                            scrollState.scrollToItem(0)
                        }
                    }, enabled = scrollState.firstVisibleItemIndex > 0) {
                        Text("Scroll to top")
                    }
                }

                LazyColumn(modifier = Modifier.fillMaxSize(), state = scrollState) {
                    items(MutableList(100) { it }) { i ->
                        Text(i.toString())
                    }
                }
            }
        }
    }
}

Answer 3

要知道您是否位于列表的最前面，请使用

val isOnTopOfList = lazyListState.firstVisibleItemIndex == 0 && lazyListState.firstVisibleItemScrollOffset == 0