Android Jetpack Compose中LazyVerticalGrid底部元素被BottomNavigation遮挡问题

问题核心是你未正确处理Scaffold的内边距，手动添加的Spacer无法影响LazyVerticalGrid的滚动区域，以下是具体修复方案：

核心修复步骤 #

1. 移除无效注解并利用Scaffold内边距
   删除@SuppressLint("UnusedMaterialScaffoldPaddingParameter")，Scaffold的content lambda会自动传入PaddingValues，该值已计算TopAppBar和BottomNavigation（若在Scaffold的bottomBar配置）的占用空间，直接应用给内容容器即可。

2. 给LazyVerticalGrid添加底部内容内边距
   通过LazyVerticalGrid的contentPadding参数额外设置底部间距，确保最后一个Card完全显示在BottomNavigation上方，数值可根据BottomNavigation的实际高度调整。

3. 删除无效的底部Spacer
   你放在Box中的底部Spacer无法影响LazyVerticalGrid的滚动范围，直接删除即可。

修改后的完整代码 #

@Composable
fun DaysScreen() {
    // 优化列表初始化方式
    val wordsList = listOf(
        WordsModel("Sunday", " रविवार(Raviwar)", R.drawable.sunday, R.drawable.save),
        WordsModel("Monday", "सोमवार(Somvar)", R.drawable.monday, R.drawable.save),
        WordsModel("Tuesday", "मंगलवार(Mangalwar)", R.drawable.tuesday, R.drawable.save),
        WordsModel("Wednesday", "बुधवार (Budhwar)", R.drawable.wednesday, R.drawable.save),
        WordsModel("Thursday", "गुरुवार(Guruwar)", R.drawable.thursday, R.drawable.save),
        WordsModel("Friday", "शुक्रवार(Shukrawar)", R.drawable.friday, R.drawable.save),
        WordsModel("Saturday", "शनिवार(Shaniwar)", R.drawable.saturday, R.drawable.save)
    )

    var searchText by remember { mutableStateOf("") }
    var filteredList by remember { mutableStateOf(wordsList) }

    fun filterList(query: String) {
        searchText = query
        filteredList = wordsList.filter {
            it.englishName.contains(query, ignoreCase = true) || it.hindiName.contains(query, ignoreCase = true)
        }
    }

    val navController = rememberNavController()
    val onBackPressedDispatcher = LocalOnBackPressedDispatcherOwner.current?.onBackPressedDispatcher

    Scaffold(
        topBar = {
            Box(
                modifier = Modifier
                    .fillMaxWidth()
                    .background(
                        brush = Brush.linearGradient(
                            colors = listOf(
                                Color(0xFF7bd596),
                                Color(0xFF71d29c),
                                Color(0xFF49c5ac)
                            )
                        )
                    )
            )
            TopAppBar(
                title = { Text(text = "Days") },
                modifier = Modifier.height(100.dp),
                navigationIcon = {
                    IconButton(onClick = { navController.popBackStack() }) {
                        Icon(
                            Icons.Default.ArrowBack,
                            contentDescription = "Back",
                            modifier = Modifier
                                .padding(16.dp)
                                .clickable { onBackPressedDispatcher?.onBackPressed() }
                        )
                    }
                },
                actions = {
                    searchView1(languageList = wordsList, filteredList = filteredList) { quer ->
                        filteredList = wordsList.filter { it.englishName.contains(quer, ignoreCase = true) }
                    }
                },
                backgroundColor = Color(0xFF71d29c),
                elevation = 0.dp
            )
        }
    ) { innerPadding ->
        Box(modifier = Modifier.fillMaxSize().padding(innerPadding)) {
            LazyVerticalGrid(
                columns = GridCells.Fixed(2),
                // 添加底部内边距，数值可根据BottomNavigation高度调整
                contentPadding = PaddingValues(horizontal = 8.dp, bottom = 80.dp),
                verticalArrangement = Arrangement.spacedBy(10.dp)
            ) {
                items(filteredList.size) { index ->
                    val item = filteredList[index]
                    Card(
                        shape = RoundedCornerShape(30.dp),
                        modifier = Modifier
                            .width(180.dp)
                            .height(200.dp)
                            .clip(RoundedCornerShape(16.dp)),
                        elevation = 6.dp,
                    ) {
                        Box {
                            Column(
                                Modifier
                                    .fillMaxSize()
                                    .padding(5.dp)
                                    .background(
                                        brush = Brush.linearGradient(
                                            colors = listOf(
                                                Color(0xFF7bd596),
                                                Color(0xFF71d29c),
                                                Color(0xFF49c5ac)
                                            )
                                        )
                                    )
                                    .clip(RoundedCornerShape(20.dp)),
                                horizontalAlignment = Alignment.CenterHorizontally,
                                verticalArrangement = Arrangement.Center,
                            ) {
                                Image(
                                    painter = painterResource(id = item.imageId),
                                    contentDescription = "Day Image"
                                )

                                Spacer(modifier = Modifier.height(5.dp))
                                Text(
                                    text = item.englishName,
                                    color = Color(0xFF0e63b0),
                                    fontWeight = FontWeight.Bold
                                )
                                Spacer(modifier = Modifier.height(5.dp))
                                Text(
                                    text = item.hindiName,
                                    color = Color(0xFF0e63b0),
                                    fontWeight = FontWeight.Bold
                                )
                            }
                            Image(
                                painter = painterResource(id = item.saveImageId),
                                contentDescription = "Save Icon",
                                modifier = Modifier
                                    .padding(8.dp)
                                    .padding(top = 10.dp)
                                    .align(Alignment.TopEnd)
                            )
                        }
                    }
                }
            }
        }
    }
}

额外优化点 #

• 用listOf直接初始化wordsList，避免lateinit和重复添加的冗余代码
• 通过index获取filteredList元素，避免原列表与过滤列表不一致的问题
• 用verticalArrangement = Arrangement.spacedBy(10.dp)替代Card的padding(top = 10.dp)，布局更统一
• 将Spacer(modifier = Modifier.padding(bottom = 5.dp))替换为Modifier.height(5.dp)，语义更清晰

内容的提问来源于stack exchange，提问作者Tejas Khartude