How to draw a border around multiline text in compose(如何在Compose中围绕多行文本绘制边框)
本文介绍了如何在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中围绕多行文本绘制边框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
沃梦达教程
本文标题为:如何在Compose中围绕多行文本绘制边框


基础教程推荐
猜你喜欢
- Android:对话框关闭而不调用关闭 2022-01-01
- 如何在没有IB的情况下将2个按钮添加到右侧的UINavigationbar? 2022-01-01
- 当从同一个组件调用时,两个 IBAction 触发的顺序是什么? 2022-01-01
- 如何在 UIImageView 中异步加载图像? 2022-01-01
- 如何在 iPhone 上显示来自 API 的 HTML 文本? 2022-01-01
- 在 gmail 中为 ios 应用程序检索朋友的朋友 2022-01-01
- android 应用程序已发布,但在 google play 中找不到 2022-01-01
- UIWebView 委托方法 shouldStartLoadWithRequest:在 WKWebView 中等效? 2022-01-01
- 如何让对象对 Cocos2D 中的触摸做出反应? 2022-01-01
- Kivy Buildozer 无法构建 apk,命令失败:./distribute.sh -m “kivy"d 2022-01-01