最后一个元素在 LazyColumn 中不可见。Jetpack 组合

Question

我从这个 Codelab中举了一个例子

\n

override fun onCreateView(\n    inflater: LayoutInflater,\n    container: ViewGroup?,\n    savedInstanceState: Bundle?\n): View {\n    return ComposeView(requireContext()).apply {\n    setContent {\n        //Column(modifier = Modifier.background(Color.LightGray)) {\n            //Text(text = "!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!", modifier = Modifier.weight(1f))\n            val scrollState = rememberLazyListState()\n\n            LazyColumn(state = scrollState, modifier = Modifier\n                .background(Color.Cyan).fillMaxWidth()) {\n                items(100) {\n                    Text("Item #$it")\n                }\n            }\n        //}\n\n    }\n  } \n}\n

\n

但最新的元素在我的屏幕上不可见。PS我已经滚动到最后了

\n

\n

在列中添加高度时 - 最后一个元素可见，但LazyColumn会延伸到整个高度

\n

LazyColumn(state = scrollState, modifier = \n Modifier.background(Color.Cyan).fillMaxWidth().height(350.dp)) {         \n   items(100) {\n    Text("Item #$it")\n   }\n}\n

\n

\n

发生这种情况是因为该列是根元素。好的，添加Column()到根元素并LazyColumn()添加到根中，但我希望Lazy\xd0\xa1olumn占据整个高度

\n

override fun onCreateView(\n    inflater: LayoutInflater,\n    container: ViewGroup?,\n    savedInstanceState: Bundle?\n): View {\nreturn ComposeView(requireContext()).apply {\n    setContent {\n        Column(modifier = Modifier.background(Color.LightGray)) {\n            val scrollState = rememberLazyListState()\n\n            LazyColumn(state = scrollState, modifier = Modifier\n                .background(Color.Cyan).fillMaxWidth()/*.height(350.dp)*/) {\n                items(100) {\n                    Text("Item #$it")\n                }\n            }\n        }\n\n     }\n  }\n}\n

\n

最后一个元素不可见

\n

理想情况下，我想制作一个带有静态标题的滚动表

\n

UPD：\n当我在 LazyColumn() 上和下添加 Text() 时，最后一个元素也不可见

\n

setContent {\n            MaterialTheme {\n                Column(modifier = Modifier\n                    .background(Color.LightGray)\n                    .fillMaxSize()) {\n                    Text(text = "!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!", modifier = Modifier.background(Color.Red).weight(1f)\n                    )\n                    val scrollState = rememberLazyListState()\n\n                    LazyColumn(\n                        state = scrollState,\n                        modifier = Modifier\n                            .background(Color.Cyan)\n                            .fillMaxWidth()\n                            .weight(4f)\n                    ) {\n                        items(100) {\n                            Text("Item #$it")\n                        }\n                    }\n                    Text(text = "!!!!!!!!!!!!!!!!!!!!", modifier = Modifier.background(Color.Red).weight(1f))\n                }\n            }\n\n        }\n

\n

Answer 1

用 包裹LazyColumn并Scaffold设置contentPadding为LazyColumn提供的填充值Scaffold：

Scaffold { paddingValues ->
    LazyColumn(
        modifier = Modifier.fillMaxSize(),
        contentPadding = paddingValues
    ) {
      ...
    }
 }

Answer 2

尝试这个：

override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View {
return ComposeView(requireContext()).apply {
    setContent {
        Box(modifier = Modifier.background(Color.LightGray)) {
            val scrollState = rememberLazyListState()

            LazyColumn(state = scrollState, modifier = Modifier
                .background(Color.Cyan).fillMaxSize()) {
                items(100) {
                    Text("Item #$it")
                }
            }
        }

     }
  }
}