HarmonyOS 鸿蒙Next RelativeContainer的链无法达到预期
HarmonyOS 鸿蒙Next RelativeContainer的链无法达到预期
问题代码如下,RelativeContainer里面放了两个Text,他们形成一条链
我需要的效果是:
当tt_title文字很短的时候效果如下
当tt_title文字很长的时候效果如下
可是现在的效果如下,请问下大佬们该如何写呢?
@Entry
@Component
struct Test {
build() {
RelativeContainer() {
Text('爱的天平如此的倾斜,怎能消除你我之间界限,我无法走进你的世界,两颗心的距离太遥远')
.id('tt_title')
.fontColor('#666666')
.fontSize(10)
.maxLines(1)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.ellipsisMode(EllipsisMode.END)
.margin({ left: 1 })
.backgroundColor('#55ff0000')
.alignRules({
left: { anchor: '__container__', align: HorizontalAlign.Start },
right: { anchor: 'tt_time', align: HorizontalAlign.Start },
bias: { horizontal: 0 }
})
.chainMode(Axis.Horizontal, ChainStyle.PACKED)
Text('2024年12月4日16:45:03')
.id('tt_time')
.fontColor('#999999')
.fontSize(10)
.maxLines(1)
.margin({ left: 2 })
.alignRules({
left: { anchor: 'tt_title', align: HorizontalAlign.End },
right: { anchor: '__container__', align: HorizontalAlign.End }
})
}
.width(200)
.height('auto')
.margin({ left: 20 })
.padding({ top: 5, bottom: 5 })
.backgroundColor('#5555fff0')
}
}
更多关于HarmonyOS 鸿蒙Next RelativeContainer的链无法达到预期的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
4 回复
想设置最大宽度多宽你自己定
更多关于HarmonyOS 鸿蒙Next RelativeContainer的链无法达到预期的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
在第一个TEXT里限制组件最大宽度就行,
.constraintSize({minWidth: 0, maxWidth: 100})
参考官方文档尺寸设置
https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-universal-attributes-size-V5
不要用 RelativeContainer 你这场景 Row 或者 Stack 都可以实现
针对HarmonyOS 鸿蒙Next中RelativeContainer的链无法达到预期的问题,以下是一些可能的解决方案:
-
检查布局参数:
- 确保RelativeContainer及其子组件的布局参数(如leftMargin、topMargin等)设置正确,与期望的布局效果一致。
-
理解锚点与偏移:
- RelativeContainer设置锚点时,是以组件占据的所有空间计算的,包括margin和padding。
- 如果设置了offset或bias,请注意它们可能影响组件的最终位置。
-
组件树渲染:
- 有时组件的最终位置可能在布局渲染完成后才会确定,确保在组件完全渲染后再进行布局调整或位置获取。
-
嵌套容器:
- 如果RelativeContainer嵌套在其他容器中,请检查父容器的布局和位置信息是否正确。
-
API版本与文档:
- 检查HarmonyOS的版本,确保使用的API和属性在当前版本中受支持。
- 查阅官方文档,了解RelativeContainer的详细用法和限制。
如果以上步骤都无法解决问题,建议联系官网客服。官网地址是:https://www.itying.com/category-93-b0.html。