ArkUI界面开发

发布时间： 位置： 香港

 

ArkUI界面开发

  1. ArkUI构建界面的最小单元是？组件

  2. 组件分类？

    容器组件：
	纵向排列：Column()
	横向排列：Row()
基础组件：Text

  3. 布局思路？先排版，再放内容。注意：build有且只能有一个根元素，且是容器组件

组件的属性方法

.width(200)                   宽度
.height(200)                  高度
.backgroundColor(Color.Pink)  背景色
.fontSize(24)                 字体大小
.fontWeight(FontWeight.Bold)  字体粗细
.fontColor(Color.Pink)        字体颜色

文字溢出省略号、行高

1.文字溢出省略（设置文本超长时的显示方式）
  语法：.textOverflow({
            overflow: TextOverflow.xxx
        })
  注意：需要配合 .maxLines(行数) 使用
2.行高
  语法：.lineHeight(数字)

Image图片组件

作用：界面中展示图片
语法：Image(图片数据源)  支持 网络图片资源 和 本地图片资源  Image($r('app.media.product'))

输入框 与 按钮

TextInput(参数对象)  输入框
	1.参数对象：placeholder        提示文本
	2.属性方法：.type(InputType.xxx)   设置输入框 type 类型
	TextInput({placeholder: '占位符文本'}).type(InputType.Password)
Button('按钮文本')   按钮

控制 Column 和 Row 内元素的间隙，可以使用 space
Column({ space: 10 }) {...}

 

 

标签：