HarmonyOS 如何实现流式布局

@Entry 
@Component 
struct FlowLayOut { 
  @State simpleList: Array<string> = ['hkxxxjh', 'jfgutxxxiuyi', 'ujghxxxgii', 'jgihochosxxxgiowio', 
    'vjuhgjghihioxxxhoihuyoiupoujo', 'dxtdx', 'ytxxxyu','uuioyxxxfoooiuouou','iuyy5jjjxxxkxd89','uiyye9w37e9xxx2379er2739er', 
  'gu','jhhjkjgkgkghh','hgfjsgf','judsgfiusdyhfosiydhfoasiufoidsi'] 
 
 
  build() { 
    Column() { 
      Column({ space: 5 }) { 
        Text('流式布局').fontSize(20).fontColor(0xCCCCCC).width('90%') 
        // 子组件多行布局 
        Flex({ wrap: FlexWrap.Wrap }) { 
          ForEach(this.simpleList, (item: string) => { 
            ChildItem({ item: item }) 
          }, (item: string) => item) 
        } 
        .width('90%') 
        .padding(5) 
        .backgroundColor(0xCCCCCD) 
 
      }.width('100%').margin({ top: 5 }) 
    }.width('100%') 
  } 
} 
@Component 
struct ChildItem { 
  @Prop item: string; 
  build() { 
    Button(this.item,{ buttonStyle: ButtonStyleMode.NORMAL }).margin({left:5,right:5,bottom:5}) 
  } 
}