40、鸿蒙/布局/Flex实现标签效果

案例

@Component
export struct FlexLayout2 {
  build() {
    Column(){
      Text('课程选择').fontSize(26).padding(15).width('100%')
      Flex({
        wrap: FlexWrap.Wrap
      }){
        Text('JAVA').backgroundColor('#f1f1f1').padding(10).margin(5)
        Text('VUE').backgroundColor('#f1f1f1').padding(10).margin(5)
        Text('ArkTs').backgroundColor('#f1f1f1').padding(10).margin(5)
        Text('数据库').backgroundColor('#f1f1f1').padding(10).margin(5)
        Text('人工智能').backgroundColor('#f1f1f1').padding(10).margin(5)
      }
    }
  }
}