HarmonyOS Text 组件后面再跟一个组件，撑满文字显示省略号，但后面的组件不显示？

Question

昵称旁边有个性别组件，当昵称很长的情况下，要实现省略号，并且后面紧跟的性别图标也要正常显示。另外文字少的情况下，性别也要紧跟其后。

问题：

Text组件之后紧跟一个组件，当文字显示省略号了，但是后面的图标没法正常显示。

以下是demo代码：

RelativeContainer(){
  Text('发的哈放大放大放大防静电拉法基倒垃圾放大发动机阿伏咖啡到啦放大')
    .id('IdText1')
    .textOverflow({overflow:  TextOverflow.Ellipsis})
    .maxLines(1)
    .alignRules({
      left: {anchor: '__container__', align: HorizontalAlign.Start},
    })

  Text('Test')
    .maxLines(1)
    .id('IdText2')
    .alignRules({
      left: {anchor: 'IdText1', align: HorizontalAlign.End},
      right: {anchor: '__container__', align: HorizontalAlign.End}
    })
}
.width('100%')

Answer 1

请尝试使用flex布局：

Flex({direction:FlexDirection.Row,justifyContent:FlexAlign.Start}){
  Text('发的放大放大放发的放大放大发的放大放大发的放大放大发的放大放大发的放大放大发的放大放大')
    .textOverflow({overflow: TextOverflow.Ellipsis})
    .maxLines(1)
  Image($r('app.media.startIcon'))
    .width(15).height(15)
}