[英]How to make middle view sit in bound of between two images? (JetpackCompose)
I have such a view我有这样的看法
@Composable
fun LongText() {
ConstraintLayout(
) {
val (leftImg, headerTitle, rightImg) = createRefs()
Image(
modifier = Modifier
.constrainAs(leftImg) {
top.linkTo(parent.top)
start.linkTo(parent.start)
bottom.linkTo(parent.bottom)
},
painter = painterResource(id = R.drawable.ic_launcher_foreground),
contentDescription = ""
)
Text(
text = "LONGTEXTLONGTEXTLONGTEXTLONGTEXTLONGTEXT",
textAlign = TextAlign.Left,
modifier = Modifier
.padding(start = 8.dp)
.constrainAs(headerTitle) {
start.linkTo(leftImg.end)
top.linkTo(parent.top)
end.linkTo(rightImg.start)
bottom.linkTo(parent.bottom)
},
maxLines = 1,
overflow = TextOverflow.Ellipsis,
color = Color.Red
)
Image(
modifier = Modifier
.constrainAs(rightImg) {
top.linkTo(parent.top)
end.linkTo(parent.end)
bottom.linkTo(parent.bottom)
},
painter = painterResource(id = R.drawable.ic_launcher_foreground),
contentDescription = ""
)
}
}
There are two problems that I am trying to find out:我试图找出两个问题:
maxLines
& overflow
doesn't work for Text view?maxLines
& overflow
不适用于文本视图? I expect that verylong
text will be collapsed with three dots once it reaches the image on the right, what is the problem here?verylong
的文本一旦到达右侧的图像就会被三个点折叠起来,这里有什么问题?maxLines = 1,
overflow = TextOverflow.Ellipsis
Result:结果:
textAlign = TextAlign.Left
I expect that short text appear on the left, close to the left image, however instead I have this text in the middletextAlign = TextAlign.Left
我希望短文本出现在左侧,靠近左侧图像,但是我在中间有这个文本Result:结果:
You can use a simple Row
applying a weight(1f)
modifier to the Text
您可以使用一个简单的
Row
将weight(1f)
修饰符应用于Text
Row(Modifier.fillMaxWidth()) {
Image(
painter = painterResource(id = R.drawable.xxx),
contentDescription = ""
)
Text(
text = "LONGTEXTLONGTEXTLONGTEXTLONGTEXTLONGTEXT",
textAlign = TextAlign.Left,
modifier = Modifier
.padding(start = 8.dp).weight(1f),
maxLines = 1,
overflow = TextOverflow.Ellipsis,
color = Color.Red
)
Image(
painter = painterResource(id = R.drawable.ic_xxx),
contentDescription = ""
)
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.