android 如何在Jetpack Compose中删除LazyVerticalGrid中的项目之间的空间？

bcs8qyzn 于 2023-06-28 发布在 Android

关注(0)|答案(2)|浏览(163)

如何在Jetpack Compose中删除LazyVerticalGrid中的项目之间的空间？我想删除项目之间的空格。

val list = mutableListOf("lorem", "ipsum", "dolor", "sit")

@Composable
fun MyUi() {
    LazyVerticalGrid(
        columns = GridCells.Fixed(2),
        content = {
            items(list.size) { index ->
                Text(
                    text = list[index],
                )
            }
        })
}

我所拥有的

lorem                 ipsum
dolor                 sit

我想要的

lorem ipsum
dolor sit

android

来源：https://stackoverflow.com/questions/76534444/how-to-remove-space-between-items-in-lazyverticalgrid-in-jetpack-compose

2条答案

按热度按时间

zf9nrax11#

这确实回答了最初提出的问题。
我在这里分享这一点，因为OP在评论中问过这个问题。

// Note: In the screenshots provided the text used is large
// I am truncating it here as it is not relevant
val words = "Lorem ipsum dolor sit amet, consectetur adipiscing elit.".split(" ")

@Composable
fun LazyGridUsingLazyColumnDemo(
    items: List<String> = words,
    columns: Int = 2,
) {
    val density = LocalDensity.current
    val configuration = LocalConfiguration.current
    val screenWidth = configuration.screenWidthDp.dp
    val textMeasurer: TextMeasurer = rememberTextMeasurer()

    val rows = ceil(items.size.toDouble() / columns).toInt()
    var nthColumnWidth = MutableList(columns) { col ->
        items.filterIndexed { index, _ ->
            index % columns == col
        }.maxOf {
            with(density) {
                textMeasurer.measure(it).size.width.toDp()
            }
        }
    }

    // This is a fallback to act similar to a grid view when there is not enough space for all the columns to be as large as required
    var calculatedColWidthSum = 0.dp
    nthColumnWidth.forEach {
        calculatedColWidthSum += it
    }
    if (calculatedColWidthSum > screenWidth) {
        nthColumnWidth = MutableList(columns) {
            screenWidth / columns
        }
    }

    LazyColumn(
        modifier = Modifier
            .fillMaxSize()
            .statusBarsPadding()
            .navigationBarsPadding(),
    ) {
        items(rows) { row ->
            Row {
                repeat(columns) { col ->
                    val index = row * columns + col
                    if (index < items.size) {
                        Text(
                            text = items[index],
                            modifier = Modifier
                                .then(
                                    if (col < nthColumnWidth.size) {
                                        Modifier
                                            .width(
                                                width = nthColumnWidth[col],
                                            )
                                    } else {
                                        Modifier
                                    }
                                ),
                        )
                    }
                }
            }
        }
    }
}

输出量