美文网首页
【HarmonyOS】鸿蒙Text组件两端对齐

【HarmonyOS】鸿蒙Text组件两端对齐

作者: zhongcx | 来源:发表于2024-09-26 07:26 被阅读0次

实现Text组件中文本两端对齐方案


image.png
@Entry
@Component
struct Page29 {
  @State str_1 :string  = '文本内容'
  @State str_2 :string  = '文本内容文本内容abcd1234也对也不对,八荣八耻。'
  build() {
    Column() {
      Text('单行效果')
      Flex({ direction: FlexDirection.Row, wrap: FlexWrap.Wrap, justifyContent: FlexAlign.SpaceBetween }) {
        ForEach(this.str_1.split(''), (item: string, index: number) => {
          Text(item)
            .fontSize(14)
        })
      }.width(100)
      .backgroundColor(Color.Pink)

      Text('多行效果')
      Flex({ direction: FlexDirection.Row, wrap: FlexWrap.Wrap, justifyContent: FlexAlign.SpaceBetween }) {
        ForEach(this.str_2.split(''), (item: string, index: number) => {
          Text(item)
            .fontSize(14)
        })
      }.width(100)
      .backgroundColor(Color.Pink)
    }
    .height('100%')
    .width('100%')
  }
}

相关文章

网友评论

      本文标题:【HarmonyOS】鸿蒙Text组件两端对齐

      本文链接:https://www.haomeiwen.com/subject/gshcrjtx.html