目录

鸿蒙ArkUI-基础篇-06-组件基础语法-ColumnRowText

鸿蒙ArkUI 基础篇-06-组件基础语法-Column/Row/Text


掌握组件写法,使用组件布局界面

ArkUI与组件

ArkUI(方舟开发框架):构建 鸿蒙 应用 界面 的框架

组件 :界面 构建与显示的最小单位

先布局再内容

https://i-blog.csdnimg.cn/direct/d73a531b7b0f4a20931ac53ea7528a9f.png

DevEco Studio代码实战

@Entry
@Component
struct Index {

  // build 里面要有唯一的容器根组件
  build() {
    Column() {
      Column() {
        Text('大壮')
        Text('中壮')
        Text('小壮')
      }
      Row() {
        Text('大壮')
        Text('中壮')
        Text('小壮')
      }
    }
  }
}

预览效果

https://i-blog.csdnimg.cn/direct/def1286cfa824069924cdaa7f1fc28cb.png

总结

https://i-blog.csdnimg.cn/direct/96634b58788349638443d4298017fc98.png

练习

https://i-blog.csdnimg.cn/direct/5f25aa9e5a464191a671f3f5dc683198.png