HarmonyOS鸿蒙Next中两个Text组件的字为什么没有对齐

HarmonyOS鸿蒙Next中两个Text组件的字为什么没有对齐 cke_820.png

这是源码

@Entry
@Component
struct BuilderDemo {

  build() {
    Column(){
      this.showTextBuilder();
      this.showTextValueBuilder('Hello @Builder');
    }
  }

  @Builder
  showTextBuilder(){
    Text('Hello World')
      .fontSize(30)
      .fontWeight(FontWeight.Bold);
  }

  @Builder
  showTextValueBuilder(param:string){
    Text(param)
      .fontSize(30)
      .fontWeight(FontWeight.Bold);
  }
}

更多关于HarmonyOS鸿蒙Next中两个Text组件的字为什么没有对齐的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复

这是因为，column组件的宽度是被内容中最大的那个组件撑起来的，它的宽度是最大内容的宽度，而column组件默认是居中显示的，才导致了现在这个问题，两个内容不对齐。

更多关于HarmonyOS鸿蒙Next中两个Text组件的字为什么没有对齐的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


默认值是center

应该是column让子组件居中了 你看hello@那个把组件撑大了 然后helloworld正好在组件的中间 你可以一下交叉轴布局 就可以了设置成start，

两个Text组件未对齐，常见原因是未统一设置 textAlign 属性（如 TextAlign.Start），或 fontSize、lineHeight 不一致导致基线偏移。请检查两个组件的这些属性值是否相同。

在 Column 容器中，子组件默认按“左对齐”排列。您给出的两个 Text 组件虽然内容长度不同（分别为 'Hello World' 和 'Hello @Builder'），但它们的左侧起始位置是严格对齐的。由于右侧边界不齐，容易产生“字没有对齐”的错觉，实际上左侧的字符是对齐的。如需让文本在水平方向居中对齐，可设置 Column 的 alignItems(HorizontalAlign.Center)，或给每个 Text 指定相同宽度并使用 textAlign(TextAlign.Center)。

回到顶部