android 在Jetpack Compose中以约束方式包含两个文本的行

xtupzzrd  于 2023-04-04  发布在  Android
关注(0)|答案(3)|浏览(139)

我想在一行中包含两个文本,其中第一个文本的宽度达到第二个文本的开头,如

我正在尝试修改器权重,但获得的结果是不一样的。有没有一种方法可以通过使用行本身而不是ConstraintLayout来实现。
编辑:

Row(modifier = Modifier.fillMaxWidth()) {
          Text(
            "Some long title abcd efgh ijkl mnop qrst uvwx yzzzzz Some long title abcd efgh ijkl mnop qrst uvwx yzzzzz",
            maxLines = 1,
            overflow = TextOverflow.Ellipsis,
            modifier = Modifier.weight(5f)
          )
          Text("View all", modifier = Modifier.weight(1f))
        }

这个工作,请建议一个更好的解决方案,如果我错过了什么。
编辑2:它给我这样的结果:

我希望标题从行的开头开始

46qrfjad

46qrfjad1#

您可以使用类似于以下内容的内容:

Row(
    modifier = Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.SpaceBetween) {
    Text(
        "Short title",
        maxLines = 1,
        overflow = TextOverflow.Ellipsis,
        modifier = Modifier.weight(1f)
    )
    Text("View all")
}

第一节第一节第一节第一节第一次

au9on6nz

au9on6nz2#

只是为了比较,这是相同的解决方案,但使用ConstraintLayout

ConstraintLayout(
    modifier = Modifier.fillMaxSize()
) {
    val (title, viewAll) = createRefs()

    Text(text = "View all", Modifier
        .background(Color.Green)
        .constrainAs(viewAll) {
            top.linkTo(parent.top, 8.dp)
            end.linkTo(parent.end, 8.dp)
        })

    Text(text = "Short title",
        maxLines = 1,
        overflow = TextOverflow.Ellipsis,
        modifier = Modifier
            .background(Color.White)
            .constrainAs(title) {
                top.linkTo(parent.top, 8.dp)
                start.linkTo(parent.start, 8.dp)
                end.linkTo(viewAll.start, 8.dp)
                width = Dimension.fillToConstraints
            })
}

第一节第一节第一节第一节第一次

eimct9ow

eimct9ow3#

如果您有所有单行文本,则只需使用此

Row(
    modifier = Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.SpaceBetween
) {
    Text(text = "Start")
    Text(text = "End")
}

当我们使用horizontalArrangement = Arrangement.SpaceBetween时,如果文本总是单行的,我们不需要分配weights
同样对于三个Texts

Row(
    modifier = Modifier.fillMaxWidth(),
    horizontalArrangement = Arrangement.SpaceBetween
) {
    Text(text = "Start")
    Text(text = "Center")
    Text(text = "End")
}

并进一步使它们整齐地CenterVertically

{
    Text(
         text = "Start",
         modifier = Modifier.align(Alignment.CenterVertically)
   )
    Text(text = "End",
         modifier = Modifier.align(Alignment.CenterVertically)
   )
}

相关问题