HarmonyOS 如何在Row中设置子组件为右侧对齐？

Question

参数附件中的UI设计图，我想用Row来实现

左侧一个图片 + 中间部分（Column + ROw） + 右侧图片

我在很多的文档中都没有看到设置子组件的对齐方式，都是父控件设置子组件的对齐方式的，实际开发中会有很多的需求，需要为每个子组件设置对齐方式，对于我给的UI设计图，能够给出你们所认为的最佳的组件配合方式呢（Samplecode）？

Answer 1

您可以在Stack组件中通过每个子组件的justifyContent属性，设置对齐方式

如下是一个简单的示例demo，可供参考

@Entry 
@Component 
struct linshi { 
  build() { 
    Stack() { 
      Row() { 
        Text('子组件1') 
}.justifyContent(FlexAlign.Start).width('100%').height('100%') 
      Row() { 
        Text('子组件2') 
}.justifyContent(FlexAlign.Center).width('100%').height('100%') 
      Row() { 
        Text('子组件3')    }.justifyContent(FlexAlign.End).width('100%').height('100%') 
    } 
  } 
}

可以尝试flex

@Entry 
@Component 
struct linshi { 
  build() { 
    Stack() { 
      Flex({ justifyContent: FlexAlign.SpaceBetween }) { 
        Text('1').width('20%').height(50).backgroundColor(0xF5DEB3) 
        Text('2').width('20%').height(50).backgroundColor(0xD2B48C) 
        Text('3').width('20%').height(50).backgroundColor(0xF5DEB3) 
      } 
    } 
  } 
}