HarmonyOS ArkUI常用布局及组件库介绍

目录

常用布局

线性布局(Row/Column)

层叠布局(Stack)

弹性布局(Flex)

相对布局(RelativeContainer)

栅格布局(GridRow/GridCol)

列表(List)

创建网格(Grid/GridItem)

轮播(Swiper)

常用组件

按钮(Button)

单选框(Radio)

切换按钮(Toggle)

进度条(Progress)

文本组件(Text/Span)

文本输入(TextInput/TextArea)

自定义弹窗(CustomDialog)

图片(Image)

Web组件


常用布局

官方文档:文档中心

线性布局(Row/Column)

控制其子元素在线性方向上(水平方向和垂直方向)依次排列

层叠布局(Stack)

层叠布局通过Stack容器组件实现位置的固定定位与层叠,容器中的子元素(子组件)依次入栈,后一个子元素覆盖前一个子元素,子元素可以叠加,也可以设置位置

弹性布局(Flex)

弹性布局提供更加有效的方式对容器中的子元素进行排列、对齐和分配剩余空间

相对布局(RelativeContainer)

RelativeContainer为采用相对布局的容器,支持容器内部的子元素设置相对位置关系。子元素支持指定兄弟元素作为锚点,也支持指定父容器作为锚点,基于锚点做相对位置布局

栅格布局(GridRow/GridCol)

是一种通用的辅助定位工具通常用于不同尺寸设备的自动换行和自适应的效果

列表(List)

当列表项达到一定数量,内容超过屏幕大小时,可以自动提供滚动功能

创建网格(Grid/GridItem)

具有较强的页面均分能力,子组件占比控制能力

轮播(Swiper)

Swiper本身是一个容器组件,当设置了多个子组件后,可以对这些子组件进行轮播显示

常用组件

官方文档:文档中心

按钮(Button)

其类型包括胶囊按钮、圆形按钮、普通按钮

单选框(Radio)

切换按钮(Toggle)

提供勾选效果以及开关效果,可根据设置的类型进行控制

进度条(Progress)

可通过类型设置条状,环状,月牙状

文本组件(Text/Span)

文本输入(TextInput/TextArea)

TextArea用于多行文本输入

自定义弹窗(CustomDialog)

可用于广告、中奖、警告、软件更新等与用户交互响应操作。开发者可以通过CustomDialogController类显示自定义弹窗

图片(Image)

可设置图片缩放类型、重复样式、渲染模式、解码尺寸、设置滤镜等操作

 

Web组件

Web组件用于在应用程序中显示本地或网络Web页面内容,为开发者提供页面加载、页面交互、页面调试等能力

猜你喜欢

转载自blog.csdn.net/weixin_44640245/article/details/135355731