未验证 提交 072b540c 编写于 作者: O openharmony_ci 提交者: Gitee

!19097 断链+UI通用说明文档添加版本号-19096的挑单

Merge pull request !19097 from LiAn/OpenHarmony-4.0-Beta1
......@@ -4,7 +4,7 @@
> **说明:**
>
> 该组件从API version7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
> 该组件从API version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 子组件
......@@ -22,46 +22,46 @@ Progress(options: {value: number, total?: number, type?: ProgressType})
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- |
| value | number | 是 | 指定当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为total。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| total | number | 否 | 指定进度总长。<br/>默认值:100<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| type<sup>8+</sup> | [ProgressType](#progresstype枚举说明) | 否 | 指定进度条类型。<br/>默认值:ProgressType.Linear<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| style<sup>deprecated</sup> | [ProgressStyle](#progressstyle枚举说明) | 否 | 指定进度条样式。<br/>该参数从API version8开始废弃,建议使用type替代。<br/>默认值:ProgressStyle.Linear |
| 参数名 | 参数类型 | 必填 | 参数描述 |
| -------------------------- | ----------------------------------- | ---- | ---------------------------------------- |
| value | number | 是 | 指定当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为total。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| total | number | 否 | 指定进度总长。<br/>默认值:100<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| type<sup>8+</sup> | [ProgressType](#progresstype枚举说明) | 否 | 指定进度条类型。<br/>默认值:ProgressType.Linear<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| style<sup>deprecated</sup> | [ProgressStyle](#progressstyle枚举说明) | 否 | 指定进度条样式。<br/>该参数从API version8开始废弃,建议使用type替代。<br/>默认值:ProgressStyle.Linear |
## ProgressType枚举说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| -------- | -------- |
| Linear | 线性样式。从API version9开始,高度大于宽度的时候自适应垂直显示。 |
| Ring<sup>8+</sup> | 环形无刻度样式,环形圆环逐渐显示至完全填充效果。 |
| Eclipse<sup>8+</sup> | 圆形样式,显示类似月圆月缺的进度展示效果,从月牙逐渐变化至满月。|
| ScaleRing<sup>8+</sup> | 环形有刻度样式,显示类似时钟刻度形式的进度展示效果。从API version9开始,刻度外圈出现重叠的时候自动转换为环形无刻度进度条。|
| Capsule<sup>8+</sup> | 胶囊样式,头尾两端圆弧处的进度展示效果与Eclipse相同;中段处的进度展示效果与Linear相同。高度大于宽度的时候自适应垂直显示。 |
| 名称 | 描述 |
| ---------------------- | ---------------------------------------- |
| Linear | 线性样式。从API version9开始,高度大于宽度的时候自适应垂直显示。 |
| Ring<sup>8+</sup> | 环形无刻度样式,环形圆环逐渐显示至完全填充效果。 |
| Eclipse<sup>8+</sup> | 圆形样式,显示类似月圆月缺的进度展示效果,从月牙逐渐变化至满月。 |
| ScaleRing<sup>8+</sup> | 环形有刻度样式,显示类似时钟刻度形式的进度展示效果。从API version9开始,刻度外圈出现重叠的时候自动转换为环形无刻度进度条。 |
| Capsule<sup>8+</sup> | 胶囊样式,头尾两端圆弧处的进度展示效果与Eclipse相同;中段处的进度展示效果与Linear相同。高度大于宽度的时候自适应垂直显示。 |
## ProgressStyle枚举说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| --------- | ------------------------------------------------------------ |
| Linear | 线性样式。 |
| Ring | 环形无刻度样式,环形圆环逐渐显示至完全填充效果。 |
| Eclipse | 圆形样式,显示类似月圆月缺的进度展示效果,从月牙逐渐变化至满月。|
| ScaleRing | 环形有刻度样式,显示类似时钟刻度形式的进度展示效果。|
| 名称 | 描述 |
| --------- | ---------------------------------------- |
| Linear | 线性样式。 |
| Ring | 环形无刻度样式,环形圆环逐渐显示至完全填充效果。 |
| Eclipse | 圆形样式,显示类似月圆月缺的进度展示效果,从月牙逐渐变化至满月。 |
| ScaleRing | 环形有刻度样式,显示类似时钟刻度形式的进度展示效果。 |
| Capsule | 胶囊样式,头尾两端圆弧处的进度展示效果与Eclipse相同;中段处的进度展示效果与Linear相同。高度大于宽度的时候自适应垂直显示。 |
## 属性
除支持[通用属性](ts-universal-attributes-size.md)外,还支持以下属性:
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| value | number | 设置当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为total。非法数值不生效。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置进度条前景色。<br/>默认值:'\#ff007dff'<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundColor | [ResourceColor](ts-types.md#resourcecolor) | 设置进度条底色。<br/>默认值:'\#19182431'<br/><br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| 名称 | 参数类型 | 描述 |
| ------------------ | ---------------------------------------- | ---------------------------------------- |
| value | number | 设置当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为total。非法数值不生效。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置进度条前景色。<br/>默认值:'\#ff007dff'<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundColor | [ResourceColor](ts-types.md#resourcecolor) | 设置进度条底色。<br/>默认值:'\#19182431'<br/><br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| style<sup>8+</sup> | {<br/>strokeWidth?:&nbsp;[Length](ts-types.md#length),<br/>scaleCount?:&nbsp;number,<br/>scaleWidth?:&nbsp;[Length](ts-types.md#length)<br/>} | 定义组件的样式。<br/>-&nbsp;strokeWidth:&nbsp;设置进度条宽度(不支持百分比设置)。从API version9开始,环形进度条设置宽度大于等于半径时,默认修改宽度至半径值的二分之一。<br/>默认值:4.0Vp<br/>-&nbsp;scaleCount:&nbsp;设置环形进度条总刻度数。<br>默认值:120<br/>-&nbsp;scaleWidth:&nbsp;设置环形进度条刻度粗细(不支持百分比设置),刻度粗细大于进度条宽度时,为系统默认粗细。<br>默认值:2.0Vp<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 事件
......@@ -128,4 +128,4 @@ struct ProgressExample {
}
```
![progress](figures/progress.png)
![progress](figures/arkts-progress.png)
......@@ -4,7 +4,7 @@
> **说明:**
>
> 该组件从API&nbsp;Version&nbsp;9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
> 该组件从API Version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
>
> 本组件为系统接口。
......@@ -29,9 +29,9 @@ AbilityComponent(want: Want)
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- |
| want | [Want](../apis/js-apis-app-ability-want.md) | 是 | 默认加载的Ability描述。 |
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ---- | ---------------------------------------- | ---- | --------------- |
| want | [Want](../apis/js-apis-app-ability-want.md) | 是 | 默认加载的Ability描述。 |
## 事件
......
# 自定义组件的生命周期
自定义组件的生命周期回调函数用于通知用户该自定义组件的生命周期,这些回调函数是私有的,在运行时由开发框架在特定的时间进行调用,不能从应用程序中手动调用这些回调函数。
>**说明:**
> **说明:**
>
>允许在生命周期函数中使用Promise和异步回调函数,比如网络资源获取,定时器设置等;
> - 本模块首批接口从API version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
> - 允许在生命周期函数中使用Promise和异步回调函数,比如网络资源获取,定时器设置等。
## aboutToAppear
......@@ -123,8 +122,8 @@ onRecycle?(params: { [key: string]: unknown }): void
**参数:**
| 参数名 | 类型 | 说明 |
| ------ | -------------------------- | -------------------- |
| 参数名 | 类型 | 说明 |
| ------ | -------------------------- | ---------- |
| params | { [key: string]: unknown } | 自定义组件的构造参数 |
......
# 像素单位
为开发者提供4种像素单位,框架采用vp为基准数据单位。
ArkUI为开发者提供4种像素单位,框架采用vp为基准数据单位。
> **说明:**
>
> 本模块首批接口从API version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
| 名称 | 描述 |
| ---- | ------------------------------------------------------------ |
| px | 屏幕物理像素单位。 |
| 名称 | 描述 |
| ---- | ---------------------------------------- |
| px | 屏幕物理像素单位。 |
| vp | 屏幕密度相关像素,根据屏幕像素密度转换为屏幕物理像素,当数值不带单位时,默认单位vp。在实际宽度为1440物理像素的屏幕上,1vp约等于3px。 |
| fp | 字体像素,与vp类似适用屏幕密度变化,随系统字体大小设置变化。 |
| fp | 字体像素,与vp类似适用屏幕密度变化,随系统字体大小设置变化。 |
| lpx | 视窗逻辑像素单位,lpx单位为实际屏幕宽度与逻辑宽度(通过designWidth配置)的比值,designWidth默认值为720。当designWidth为720时,在实际宽度为1440物理像素的屏幕上,1lpx为2px大小。 |
......@@ -15,12 +19,12 @@
提供其他单位与px单位互相转换的方法。
| 接口 | 描述 |
| --------------------------------------------------- | ------------------------------------------------------------ |
| vp2px(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将vp单位的数值转换为以px为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| px2vp(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将px单位的数值转换为以vp为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| fp2px(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将fp单位的数值转换为以px为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| px2fp(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将px单位的数值转换为以fp为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| 接口 | 描述 |
| ---------------------------------------- | ---------------------------------------- |
| vp2px(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将vp单位的数值转换为以px为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| px2vp(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将px单位的数值转换为以vp为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| fp2px(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将fp单位的数值转换为以px为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| px2fp(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将px单位的数值转换为以fp为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| lpx2px(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将lpx单位的数值转换为以px为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| px2lpx(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将px单位的数值转换为以lpx为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
......
# 类型定义
> **说明:**
>
> 本模块首批接口从API version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## Resource
资源引用类型,用于设置组件属性的值。
......@@ -24,49 +28,49 @@
长度类型,用于描述尺寸单位。
| 类型 | 说明 |
| -------- | -------------------------------------- |
| string | 需要显式指定像素单位,如'10px',也可设置百分比字符串,如'100%'。 |
| number | 默认单位vp。 |
| [Resource](#resource) | 资源引用类型,引入系统资源或者应用资源中的尺寸。 |
| 类型 | 说明 |
| --------------------- | -------------------------------------- |
| string | 需要显式指定像素单位,如'10px',也可设置百分比字符串,如'100%'。 |
| number | 默认单位vp。 |
| [Resource](#resource) | 资源引用类型,引入系统资源或者应用资源中的尺寸。 |
## ResourceStr
字符串类型,用于描述字符串入参可以使用的类型。
| 类型 | 说明 |
| -------- | ---------------------------- |
| string | 字符串类型。 |
| 类型 | 说明 |
| --------------------- | ------------------------- |
| string | 字符串类型。 |
| [Resource](#resource) | 资源引用类型,引入系统资源或者应用资源中的字符串。 |
## Padding
内边距类型,用于描述组件不同方向的内边距。
| 名称 | 类型 | 必填 | 说明 |
| ------ | ------ | ---- | --------------- |
| top | [Length](#length) | 否 | 上内边距,组件内元素距组件顶部的尺寸。 |
| right | [Length](#length) | 否 | 右内边距,组件内元素距组件右边界的尺寸。 |
| bottom | [Length](#length) | 否 | 下内边距,组件内元素距组件底部的尺寸。 |
| left | [Length](#length) | 否 | 左内边距,组件内元素距组件左边界的尺寸。 |
| 名称 | 类型 | 必填 | 说明 |
| ------ | ----------------- | ---- | -------------------- |
| top | [Length](#length) | 否 | 上内边距,组件内元素距组件顶部的尺寸。 |
| right | [Length](#length) | 否 | 右内边距,组件内元素距组件右边界的尺寸。 |
| bottom | [Length](#length) | 否 | 下内边距,组件内元素距组件底部的尺寸。 |
| left | [Length](#length) | 否 | 左内边距,组件内元素距组件左边界的尺寸。 |
## Margin
外边距类型,用于描述组件不同方向的外边距。
| 名称 | 类型 | 必填 | 说明 |
| ------ | ------ | ---- | --------------- |
| top | [Length](#length) | 否 | 上外边距,组件顶部距组件外元素的尺寸。 |
| right | [Length](#length) | 否 | 右外边距,组件右边界距组件外元素的尺寸。 |
| bottom | [Length](#length) | 否 | 下外边距,组件底部距组件外元素的尺寸。 |
| left | [Length](#length) | 否 | 坐外边距,组件左边界距组件外元素的尺寸。 |
| 名称 | 类型 | 必填 | 说明 |
| ------ | ----------------- | ---- | -------------------- |
| top | [Length](#length) | 否 | 上外边距,组件顶部距组件外元素的尺寸。 |
| right | [Length](#length) | 否 | 右外边距,组件右边界距组件外元素的尺寸。 |
| bottom | [Length](#length) | 否 | 下外边距,组件底部距组件外元素的尺寸。 |
| left | [Length](#length) | 否 | 坐外边距,组件左边界距组件外元素的尺寸。 |
## EdgeWidths<sup>9+</sup>
边框宽度类型,用于描述组件边框不同方向的宽度。
| 名称 | 类型 | 必填 | 说明 |
| ------ | ------ | ---- | -------- |
| 名称 | 类型 | 必填 | 说明 |
| ------ | ----------------- | ---- | -------- |
| top | [Length](#length) | 否 | 组件上边框宽度。 |
| right | [Length](#length) | 否 | 组件右边框宽度。 |
| bottom | [Length](#length) | 否 | 组件下边框宽度。 |
......@@ -76,8 +80,8 @@
圆角类型,用于描述组件边框圆角半径。
| 名称 | 类型 | 必填 | 说明 |
| ----------- | ------ | ---- | ---------- |
| 名称 | 类型 | 必填 | 说明 |
| ----------- | ----------------- | ---- | ---------- |
| topLeft | [Length](#length) | 否 | 组件左上角圆角半径。 |
| topRight | [Length](#length) | 否 | 组件右上角圆角半径。 |
| bottomLeft | [Length](#length) | 否 | 组件左下角圆角半径。 |
......@@ -87,8 +91,8 @@
边框颜色,用于描述组件边框四条边的颜色。
| 名称 | 类型 | 必填 | 说明 |
| ------ | ------------- | ---- | -------- |
| 名称 | 类型 | 必填 | 说明 |
| ------ | ------------------------------- | ---- | -------- |
| top | [ResourceColor](#resourcecolor) | 否 | 组件上边框颜色。 |
| right | [ResourceColor](#resourcecolor) | 否 | 组件右边框颜色。 |
| bottom | [ResourceColor](#resourcecolor) | 否 | 组件下边框颜色。 |
......@@ -98,8 +102,8 @@
边框样式,用于描述组件边框四条边的样式。
| 名称 | 类型 | 必填 | 说明 |
| ------ | ----------- | ---- | -------- |
| 名称 | 类型 | 必填 | 说明 |
| ------ | ---------------------------------------- | ---- | -------- |
| top | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 组件上边框样式。 |
| right | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 组件右边框样式。 |
| bottom | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 组件下边框样式。 |
......@@ -110,8 +114,8 @@
相对布局完成位置坐标偏移量。
| 名称 | 类型 | 必填 | 说明 |
| ---- | ------ | ---- | -------- |
| 名称 | 类型 | 必填 | 说明 |
| ---- | ----------------- | ---- | -------- |
| dx | [Length](#length) | 是 | 水平方向偏移量。 |
| dy | [Length](#length) | 是 | 竖直方向偏移量。 |
......@@ -119,27 +123,27 @@
颜色类型,用于描述资源颜色类型。
| 类型 | 说明 |
| ---------------------------------------- | ------------------------------------------------- |
| [Color](ts-appendix-enums.md#color) | 颜色枚举值。 |
| number | HEX格式颜色,支持rgb。示例:0xffffff。 |
| string | rgb或者argb格式颜色。示例:'#ffffff', '#ff000000', 'rgb(255, 100, 255)', 'rgba(255, 100, 255, 0.5)'。 |
| [Resource](#resource) | 使用引入资源的方式,引入系统资源或者应用资源中的颜色。 |
| 类型 | 说明 |
| ----------------------------------- | ---------------------------------------- |
| [Color](ts-appendix-enums.md#color) | 颜色枚举值。 |
| number | HEX格式颜色,支持rgb。示例:0xffffff。 |
| string | rgb或者argb格式颜色。示例:'#ffffff', '#ff000000', 'rgb(255, 100, 255)', 'rgba(255, 100, 255, 0.5)'。 |
| [Resource](#resource) | 使用引入资源的方式,引入系统资源或者应用资源中的颜色。 |
## ColoringStrategy
智能取色枚举类型,用于设置前景色。
| 名称 | 描述 |
| --------- | ------- |
| INVERT | 设置前景色为控件背景色的反色。|
| 名称 | 描述 |
| ------ | --------------- |
| INVERT | 设置前景色为控件背景色的反色。 |
## LengthConstrain
长度约束,用于对组件最大、最小长度做限制。
| 名称 | 类型 | 必填 | 说明 |
| --------- | ------ | ---- | ------- |
| 名称 | 类型 | 必填 | 说明 |
| --------- | ----------------- | ---- | ------- |
| minLength | [Length](#length) | 是 | 组件最小长度。 |
| maxLength | [Length](#length) | 是 | 组件最大长度。 |
......@@ -148,12 +152,12 @@
设置文本样式。
| 名称 | 类型 | 必填 | 说明 |
| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ |
| size | [Length](#length) | 否 | 设置文本尺寸,Length为number类型时,使用fp单位。不支持设置百分比字符串。 |
| weight | [FontWeight](ts-appendix-enums.md#fontweight) \| number \| string | 否 | 设置文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。 |
| family | string \| [Resource](#resource) | 否 | 设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial, sans-serif'。当前只支持'sans-serif'字体。 |
| style | [FontStyle](ts-appendix-enums.md#fontstyle) | 否 | 设置文本的字体样式。 |
| 名称 | 类型 | 必填 | 说明 |
| ------ | ---------------------------------------- | ---- | ---------------------------------------- |
| size | [Length](#length) | 否 | 设置文本尺寸,Length为number类型时,使用fp单位。不支持设置百分比字符串。 |
| weight | [FontWeight](ts-appendix-enums.md#fontweight) \| number \| string | 否 | 设置文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。 |
| family | string \| [Resource](#resource) | 否 | 设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial, sans-serif'。当前只支持'sans-serif'字体。 |
| style | [FontStyle](ts-appendix-enums.md#fontstyle) | 否 | 设置文本的字体样式。 |
## Area<sup>8+</sup>
......@@ -170,8 +174,8 @@
位置类型,用于表示一个坐标点。
| 名称 | 类型 | 必填 | 说明 |
| ---- | ------ | ---- | --------------------------- |
| 名称 | 类型 | 必填 | 说明 |
| ---- | ----------------- | ---- | --------------------------- |
| x | [Length](#length) | 否 | x轴坐标,作为返回值时,类型为number,单位vp。 |
| y | [Length](#length) | 否 | y轴坐标,作为返回值时,类型为number,单位vp。 |
......@@ -179,8 +183,8 @@
设置约束尺寸,组件布局时,进行尺寸范围限制。
| 名称 | 类型 | 必填 | 说明 |
| --------- | ------ | ---- | ------- |
| 名称 | 类型 | 必填 | 说明 |
| --------- | ----------------- | ---- | ------- |
| minWidth | [Length](#length) | 否 | 元素最小宽度。 |
| maxWidth | [Length](#length) | 否 | 元素最大宽度。 |
| minHeight | [Length](#length) | 否 | 元素最小高度。 |
......@@ -190,8 +194,8 @@
设置宽高尺寸。
| 名称 | 类型 | 必填 | 说明 |
| ------ | ------ | ---- | ----- |
| 名称 | 类型 | 必填 | 说明 |
| ------ | ----------------- | ---- | ----- |
| width | [Length](#length) | 否 | 元素宽度。 |
| height | [Length](#length) | 否 | 元素高度。 |
......@@ -202,9 +206,9 @@
| 名称 | 类型 | 必填 | 说明 |
| ------ | ---------------------------------------- | ---- | ------- |
| width | [Length](#length) \| [EdgeWidths](#edgewidths9)<sup>9+</sup> | 否 | 边框宽度。 |
| width | [Length](#length) \| [EdgeWidths](#edgewidths9)<sup>9+</sup> | 否 | 边框宽度。 |
| color | [ResourceColor](#resourcecolor) \| [EdgeColors](#edgecolors9)<sup>9+</sup> | 否 | 边框颜色。 |
| radius | [Length](#length) \| [BorderRadiuses](#borderradiuses9)<sup>9+</sup> | 否 | 边框圆角半径。 |
| radius | [Length](#length) \| [BorderRadiuses](#borderradiuses9)<sup>9+</sup> | 否 | 边框圆角半径。 |
| style | [BorderStyle](ts-appendix-enums.md#borderstyle) \| EdgeStyles<sup>9+</sup> | 否 | 边框样式。 |
## ColorFilter<sup>9+</sup>
......@@ -228,19 +232,19 @@
像素扩展属性集合,用于描述像素扩展的信息。
| 名称 | 类型 | 必填 | 说明 |
| ----------- | ------ | ---- | ---------- |
| left | [Length](#length) | 否 | 组件图像左边沿扩展距离。 |
| right | [Length](#length) | 否 | 组件图像右边沿像素扩展距离。 |
| top | [Length](#length) | 否 | 组件图像上边沿像素扩展距离。 |
| 名称 | 类型 | 必填 | 说明 |
| ------ | ----------------- | ---- | -------------- |
| left | [Length](#length) | 否 | 组件图像左边沿扩展距离。 |
| right | [Length](#length) | 否 | 组件图像右边沿像素扩展距离。 |
| top | [Length](#length) | 否 | 组件图像上边沿像素扩展距离。 |
| bottom | [Length](#length) | 否 | 组件图像下边沿像素扩展距离。 |
## ModalTransition<sup>10+</sup>
全屏模态转场方式枚举类型,用于设置全屏模态转场类型。
| 名称 | 描述 |
| --------- | ------- |
| None | 全屏模态无转场动画。 |
| Default | 全屏模态上下切换动画。 |
| Alpha | 全屏模态透明度渐变动画。 |
\ No newline at end of file
| 名称 | 描述 |
| ------- | ------------ |
| None | 全屏模态无转场动画。 |
| Default | 全屏模态上下切换动画。 |
| Alpha | 全屏模态透明度渐变动画。 |
\ No newline at end of file
......@@ -156,6 +156,7 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true })
## 场景示例
- 用于启动操作。
可以用按钮启动任何用户界面元素,按钮会根据用户的操作触发相应的事件。例如,在List容器里通过点击按钮进行页面跳转。
```ts
......@@ -195,6 +196,7 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true })
- 用于表单的提交。
在用户登录/注册页面,使用按钮进行登录或注册操作。
```ts
......@@ -218,6 +220,7 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true })
![zh-cn_image_0000001562940473](figures/zh-cn_image_0000001562940473.png)
- 悬浮按钮
在可以滑动的界面,滑动时按钮始终保持悬浮状态。
```ts
......@@ -258,4 +261,4 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true })
}
```
![GIF](figures/GIF.gif)
![floating_button](figures/floating_button.gif)
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册