简体   繁体   English

Android 撰写 LazyColumn:ConstraintLayout 中的项目:上下滚动 - 文本不再可见

[英]Android Compose LazyColumn: Item in a ConstraintLayout: Scrolling up and down - Text no longer visible

When using ConstraintLayout in a LazyColumn a simple Text does not appear when we simply scroll up and down.在 LazyColumn 中使用 ConstraintLayout 时,当我们简单地向上和向下滚动时,不会出现简单的文本。 Changing the Item from a ConstraintLayout to a Row fixes the issue thus I conclude either my code is bugged or ConstraintLayout alpha has a bug.将 Item 从 ConstraintLayout 更改为 Row 解决了这个问题,因此我得出结论,要么我的代码有错误,要么 ConstraintLayout alpha 有错误。

You can see in the Layout inspector picture the Text is supposed to display a -6.40 euro您可以在布局检查器图片中看到文本应该显示 -6.40 欧元

edit: I also posted it on the android bug tracker as I wasn't sure if it was my problem or a bug https://issuetracker.google.com/issues/188855913 - Will close this soon most probably编辑:我还将它发布在 android 错误跟踪器上,因为我不确定这是我的问题还是错误https://issuetracker.google.com/issues/188855913 - 很可能很快就会关闭

LazyColumn(
    modifier = modifier,
    verticalArrangement = Arrangement.spacedBy(smallMargin),
) {
    item {
        header()
    }
    transactionsGroupedPer.forEach { (section, transactions) ->
        item {
            Text(
                modifier = modifier.padding(start = largeMargin, end = largeMargin, top = normalMargin),
                text = section.uppercase(),
                style = MyTheme.typography.label
            )
        }
        items(items) {
            MyItem(
                item = it,
                modifier = Modifier.fillParentMaxWidth(),
            )
        }
    }
}


@Composable
fun MyItem(
    name: String,
    amount: Money,
    modifier: Modifier = Modifier,
    textColor: Color = Color.Unspecified,
) {
    val constraints = ConstraintSet {
        val titleSubTitle = createRefFor(ModifierId.TITLE_SUBTITLE)
        val logo = createRefFor(ModifierId.LOGO)
        val amount = createRefFor(ModifierId.AMOUNT)

        constrain(amount) {
            top.linkTo(parent.top, margin = xsmallMargin)
            bottom.linkTo(parent.bottom, margin = xsmallMargin)
            end.linkTo(parent.end, margin = smallMargin)
        }
        constrain(logo) {
            start.linkTo(parent.start, margin = smallMargin)
            bottom.linkTo(parent.bottom) 
        }
        constrain(titleSubTitle) {
            top.linkTo(logo.top)
            bottom.linkTo(logo.bottom)
            start.linkTo(logo.end, margin = smallMargin)
            end.linkTo(amount.start, margin = smallMargin)
            width = Dimension.fillToConstraints
        }
    }

    ConstraintLayout(constraints,
        modifier = modifier.fillMaxWidth().wrapContentHeight()
    ) {
        Text(
            color = textColor,
            modifier = Modifier.layoutId(ModifierId.AMOUNT),
            text = amount.toMoneyAnnotatedString(),
            style = amountStyle,
        )
        ImageContainer(Modifier.layoutId(ModifierId.LOGO), image = image, size = logoSize)
        Column(modifier = Modifier.layoutId(ModifierId.TITLE_SUBTITLE), verticalArrangement = Arrangement.Center) {
            Text(
                color = textColor,
                maxLines = maxLines,
                text = name,
                style = MyTheme.typography.bodyBold
            )
            if (showSubTitle) {
                Text(
                    color = textColor,
                    text = date.formatDateTime(DateFormat.LONG), 
                    style = MyTheme.typography.meta
                )
            }
        }
    }
}

布局检查器

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM