本文介绍了如何在Compose中围绕多行文本绘制边框的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我想像这样在Text周围画一个边框，
Text("Box around text",
modifier = Modifier
.padding(top = 8.dp)
.border(width = 2.dp, color = Color.Red)
.background(Color.DarkGray))
Text("Box around text with a very very very very longlonglonglongword",
modifier = Modifier
.padding(top = 8.dp)
.border(width = 2.dp, color = Color.Red)
.background(Color.DarkGray)
)
但对于多行文本，它看起来不太好。
边框和文本之间的右侧有间隙。
那么如何在多行文本周围绘制边框，使其适合文本宽度？
推荐答案
我不确定这是错误还是预期行为。对于我创建的第一个案例this issue，我们将看看维护人员的想法。
以下是手动限制的方法：
var textWidth by remember { mutableStateOf<Int?>(null) }
Text(
"Box around text with a very very very very longlonglonglongword",
color = Color.White,
onTextLayout = { layoutResult ->
textWidth = (0 until layoutResult.lineCount)
.maxOf {
ceil(layoutResult.getLineRight(it)).toInt()
}
},
modifier = Modifier
.border(width = 2.dp, color = Color.Red)
.width(with(LocalDensity.current) { textWidth?.toDp() ?: Dp.Unspecified })
.drawWithContent {
// prevent full with text from being drawn
if (textWidth != null) {
drawContent()
}
}
.background(Color.DarkGray)
)
结果：
这篇关于如何在Compose中围绕多行文本绘制边框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除！