赞
踩
image组件基本使用
- image($r('app.media.logo'))#设置图片源
- width(78)
- height(78)#设置图片大小
text组件基本使用
- #设置文本内容 支持string和resource
- Text('登录页面')
- #设置文本大小 支持number string resource
- fontSize(24)
- #设置文本粗细 支持number和 fontweight Lighter Normal Regular Medium Bold Bolder
- fontWeight(FontWeight.Medium)
- #设置文本颜色 支持color.black number string resource
- fontCOlor('#182431')
Textlnout
- #设置提示文本
- TextInput({placeholder:'账号'})
- #设置最大输入字符数
- maxLength(11)
- #设置文本框输入类型
- type(InputTyre.Number)
- #设置onChange事件
- onChange((value:string)) =>{
- this.account = value:
- })
Button组件
- #设置按钮样式
- Button('登录',{ type:ButtonType.Capsule})
- #设置按钮点击事件
- onClick(() => {
- //登录逻辑
- })
布局容器
Column表示垂直方向布局容器(Column的主轴)
Row表示沿水平方向布局的容器(Row的主轴)
属性名:justifycontent:设置子组件在主轴方向上的对齐方式。
其参数类型有Start,Center,End,SpaceBetween,SpaceAround,SpaceEvenly
接口:Column(value?:{space?:string|number})
alignltems:设置子组件在交叉方向上的对齐格式。
其类型有Start,Center,End,Top,Center,Bottom
接口:Row(value?:{space?:string|number})
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。