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

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

Merge pull request !19097 from LiAn/OpenHarmony-4.0-Beta1
# 枚举说明 # 枚举说明
> **说明:**
>
> 本模块首批接口从API version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## Color ## Color
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 颜色名称 | 颜色值 | 颜色示意 | | 颜色名称 | 颜色值 | 颜色示意 |
| ------------------------ | -------- | ------------------------------------------------------------ | | ------------------------ | ------------- | ---------------------------------------- |
| Black | 0x000000 | ![zh-cn_image_0000001219864153](figures/zh-cn_image_0000001219864153.png) | | Black | 0x000000 | ![zh-cn_image_0000001219864153](figures/zh-cn_image_0000001219864153.png) |
| Blue | 0x0000ff | ![zh-cn_image_0000001174104404](figures/zh-cn_image_0000001174104404.png) | | Blue | 0x0000ff | ![zh-cn_image_0000001174104404](figures/zh-cn_image_0000001174104404.png) |
| Brown | 0xa52a2a | ![zh-cn_image_0000001219744201](figures/zh-cn_image_0000001219744201.png) | | Brown | 0xa52a2a | ![zh-cn_image_0000001219744201](figures/zh-cn_image_0000001219744201.png) |
| Gray | 0x808080 | ![zh-cn_image_0000001174264376](figures/zh-cn_image_0000001174264376.png) | | Gray | 0x808080 | ![zh-cn_image_0000001174264376](figures/zh-cn_image_0000001174264376.png) |
| Grey | 0x808080 | ![zh-cn_image_0000001174264376](figures/zh-cn_image_0000001174264376.png) | | Grey | 0x808080 | ![zh-cn_image_0000001174264376](figures/zh-cn_image_0000001174264376.png) |
| Green | 0x008000 | ![zh-cn_image_0000001174422914](figures/zh-cn_image_0000001174422914.png) | | Green | 0x008000 | ![zh-cn_image_0000001174422914](figures/zh-cn_image_0000001174422914.png) |
| Orange | 0xffa500 | ![zh-cn_image_0000001219662661](figures/zh-cn_image_0000001219662661.png) | | Orange | 0xffa500 | ![zh-cn_image_0000001219662661](figures/zh-cn_image_0000001219662661.png) |
| Pink | 0xffc0cb | ![zh-cn_image_0000001219662663](figures/zh-cn_image_0000001219662663.png) | | Pink | 0xffc0cb | ![zh-cn_image_0000001219662663](figures/zh-cn_image_0000001219662663.png) |
| Red | 0xff0000 | ![zh-cn_image_0000001219662665](figures/zh-cn_image_0000001219662665.png) | | Red | 0xff0000 | ![zh-cn_image_0000001219662665](figures/zh-cn_image_0000001219662665.png) |
| White | 0xffffff | ![zh-cn_image_0000001174582866](figures/zh-cn_image_0000001174582866.png) | | White | 0xffffff | ![zh-cn_image_0000001174582866](figures/zh-cn_image_0000001174582866.png) |
| Yellow | 0xffff00 | ![zh-cn_image_0000001174582864](figures/zh-cn_image_0000001174582864.png) | | Yellow | 0xffff00 | ![zh-cn_image_0000001174582864](figures/zh-cn_image_0000001174582864.png) |
| Transparent<sup>9+</sup> | rgba(0,0,0,0) | 透明色 | | Transparent<sup>9+</sup> | rgba(0,0,0,0) | 透明色 |
## ImageFit ## ImageFit
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| --------- | ------------------------------------------------------------ | | --------- | ------------------------------- |
| Contain | 保持宽高比进行缩小或者放大,使得图片完全显示在显示边界内。 | | Contain | 保持宽高比进行缩小或者放大,使得图片完全显示在显示边界内。 |
| Cover | 保持宽高比进行缩小或者放大,使得图片两边都大于或等于显示边界。 | | Cover | 保持宽高比进行缩小或者放大,使得图片两边都大于或等于显示边界。 |
| Auto | 自适应显示 | | Auto | 自适应显示 |
| Fill | 不保持宽高比进行放大缩小,使得图片充满显示边界。 | | Fill | 不保持宽高比进行放大缩小,使得图片充满显示边界。 |
| ScaleDown | 保持宽高比显示,图片缩小或者保持不变。 | | ScaleDown | 保持宽高比显示,图片缩小或者保持不变。 |
| None | 保持原有尺寸显示。 | | None | 保持原有尺寸显示。 |
## BorderStyle ## BorderStyle
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------ | ----------------------------------------------- | | ------ | ----------------------------- |
| Dotted | 显示为一系列圆点,圆点半径为borderWidth的一半。 | | Dotted | 显示为一系列圆点,圆点半径为borderWidth的一半。 |
| Dashed | 显示为一系列短的方形虚线。 | | Dashed | 显示为一系列短的方形虚线。 |
| Solid | 显示为一条实线。 | | Solid | 显示为一条实线。 |
## LineJoinStyle ## LineJoinStyle
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ----- | -------------------- | | ----- | ---------- |
| Bevel | 使用斜角连接路径段。 | | Bevel | 使用斜角连接路径段。 |
| Miter | 使用尖角连接路径段。 | | Miter | 使用尖角连接路径段。 |
| Round | 使用圆角连接路径段。 | | Round | 使用圆角连接路径段。 |
## TouchType ## TouchType
| 名称 | 描述 | | 名称 | 描述 |
| ------ | ------------------------------ | | ------ | --------------- |
| Down | 手指按下时触发。 | | Down | 手指按下时触发。 |
| Up | 手指抬起时触发。 | | Up | 手指抬起时触发。 |
| Move | 手指按压态在屏幕上移动时触发。 | | Move | 手指按压态在屏幕上移动时触发。 |
| Cancel | 触摸事件取消时触发。 | | Cancel | 触摸事件取消时触发。 |
## MouseButton ## MouseButton
| 名称 | 描述 | | 名称 | 描述 |
| ------- | ---------------- | | ------- | -------- |
| Left | 鼠标左键。 | | Left | 鼠标左键。 |
| Right | 鼠标右键。 | | Right | 鼠标右键。 |
| Middle | 鼠标中键。 | | Middle | 鼠标中键。 |
| Back | 鼠标左侧后退键。 | | Back | 鼠标左侧后退键。 |
| Forward | 鼠标左侧前进键。 | | Forward | 鼠标左侧前进键。 |
| None | 无按键。 | | None | 无按键。 |
## MouseAction ## MouseAction
| 名称 | 描述 | | 名称 | 描述 |
| ------- | -------------- | | ------- | ------- |
| Press | 鼠标按键按下。 | | Press | 鼠标按键按下。 |
| Release | 鼠标按键松开。 | | Release | 鼠标按键松开。 |
| Move | 鼠标移动。 | | Move | 鼠标移动。 |
| Hover | 鼠标悬浮。 | | Hover | 鼠标悬浮。 |
## Curve ## Curve
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------------------- | ------------------------------------------------------------ | | ------------------- | ---------------------------------------- |
| Linear | 表示动画从头到尾的速度都是相同的。 | | Linear | 表示动画从头到尾的速度都是相同的。 |
| Ease | 表示动画以低速开始,然后加快,在结束前变慢,CubicBezier(0.25, 0.1, 0.25, 1.0)。 | | Ease | 表示动画以低速开始,然后加快,在结束前变慢,CubicBezier(0.25, 0.1, 0.25, 1.0)。 |
| EaseIn | 表示动画以低速开始,CubicBezier(0.42, 0.0, 1.0, 1.0)。 | | EaseIn | 表示动画以低速开始,CubicBezier(0.42, 0.0, 1.0, 1.0)。 |
| EaseOut | 表示动画以低速结束,CubicBezier(0.0, 0.0, 0.58, 1.0)。 | | EaseOut | 表示动画以低速结束,CubicBezier(0.0, 0.0, 0.58, 1.0)。 |
| EaseInOut | 表示动画以低速开始和结束,CubicBezier(0.42, 0.0, 0.58, 1.0)。 | | EaseInOut | 表示动画以低速开始和结束,CubicBezier(0.42, 0.0, 0.58, 1.0)。 |
| FastOutSlowIn | 标准曲线,cubic-bezier(0.4, 0.0, 0.2, 1.0)。 | | FastOutSlowIn | 标准曲线,cubic-bezier(0.4, 0.0, 0.2, 1.0)。 |
| LinearOutSlowIn | 减速曲线,cubic-bezier(0.0, 0.0, 0.2, 1.0)。 | | LinearOutSlowIn | 减速曲线,cubic-bezier(0.0, 0.0, 0.2, 1.0)。 |
| FastOutLinearIn | 加速曲线,cubic-bezier(0.4, 0.0, 1.0, 1.0)。 | | FastOutLinearIn | 加速曲线,cubic-bezier(0.4, 0.0, 1.0, 1.0)。 |
| ExtremeDeceleration | 急缓曲线,cubic-bezier(0.0, 0.0, 0.0, 1.0)。 | | ExtremeDeceleration | 急缓曲线,cubic-bezier(0.0, 0.0, 0.0, 1.0)。 |
| Sharp | 锐利曲线,cubic-bezier(0.33, 0.0, 0.67, 1.0)。 | | Sharp | 锐利曲线,cubic-bezier(0.33, 0.0, 0.67, 1.0)。 |
| Rhythm | 节奏曲线,cubic-bezier(0.7, 0.0, 0.2, 1.0)。 | | Rhythm | 节奏曲线,cubic-bezier(0.7, 0.0, 0.2, 1.0)。 |
| Smooth | 平滑曲线,cubic-bezier(0.4, 0.0, 0.4, 1.0)。 | | Smooth | 平滑曲线,cubic-bezier(0.4, 0.0, 0.4, 1.0)。 |
| Friction | 阻尼曲线,CubicBezier(0.2, 0.0, 0.2, 1.0)。 | | Friction | 阻尼曲线,CubicBezier(0.2, 0.0, 0.2, 1.0)。 |
## AnimationStatus ## AnimationStatus
从API version 10开始,该接口支持在ArkTS卡片中使用。 从API version 10开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------- | ------------------ | | ------- | --------- |
| Initial | 动画初始状态。 | | Initial | 动画初始状态。 |
| Running | 动画处于播放状态。 | | Running | 动画处于播放状态。 |
| Paused | 动画处于暂停状态。 | | Paused | 动画处于暂停状态。 |
| Stopped | 动画处于停止状态。 | | Stopped | 动画处于停止状态。 |
...@@ -116,10 +120,10 @@ ...@@ -116,10 +120,10 @@
从API version 10开始,该接口支持在ArkTS卡片中使用。 从API version 10开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| --------- | ------------------------------------------------------------ | | --------- | ---------------------------------------- |
| None | 动画未执行时不会将任何样式应用于目标,动画播放完成之后恢复初始默认状态。 | | None | 动画未执行时不会将任何样式应用于目标,动画播放完成之后恢复初始默认状态。 |
| Forwards | 目标将保留动画执行期间最后一个关键帧的状态。 | | Forwards | 目标将保留动画执行期间最后一个关键帧的状态。 |
| Backwards | 动画将在应用于目标时立即应用第一个关键帧中定义的值,并在delay期间保留此值。第一个关键帧取决于playMode,playMode为Normal或Alternate时为from的状态,playMode为Reverse或AlternateReverse时为to的状态。 | | Backwards | 动画将在应用于目标时立即应用第一个关键帧中定义的值,并在delay期间保留此值。第一个关键帧取决于playMode,playMode为Normal或Alternate时为from的状态,playMode为Reverse或AlternateReverse时为to的状态。 |
| Both | 动画将遵循Forwards和Backwards的规则,从而在两个方向上扩展动画属性。 | | Both | 动画将遵循Forwards和Backwards的规则,从而在两个方向上扩展动画属性。 |
...@@ -127,140 +131,140 @@ ...@@ -127,140 +131,140 @@
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ---------------- | ------------------------------------------------------------ | | ---------------- | ---------------------------------------- |
| Normal | 动画按正常播放。 | | Normal | 动画按正常播放。 |
| Reverse | 动画反向播放。 | | Reverse | 动画反向播放。 |
| Alternate | 动画在奇数次(1、3、5...)正向播放,在偶数次(2、4、6...)反向播放。 | | Alternate | 动画在奇数次(1、3、5...)正向播放,在偶数次(2、4、6...)反向播放。 |
| AlternateReverse | 动画在奇数次(1、3、5...)反向播放,在偶数次(2、4、6...)正向播放。 | | AlternateReverse | 动画在奇数次(1、3、5...)反向播放,在偶数次(2、4、6...)正向播放。 |
## KeyType ## KeyType
| 名称 | 描述 | | 名称 | 描述 |
| ---- | ---------- | | ---- | ----- |
| Down | 按键按下。 | | Down | 按键按下。 |
| Up | 按键松开。 | | Up | 按键松开。 |
## KeySource ## KeySource
| 名称 | 描述 | | 名称 | 描述 |
| -------- | -------------------- | | -------- | ---------- |
| Unknown | 输入设备类型未知。 | | Unknown | 输入设备类型未知。 |
| Keyboard | 输入设备类型为键盘。 | | Keyboard | 输入设备类型为键盘。 |
## Edge ## Edge
| 名称 | 描述 | | 名称 | 描述 |
| -------- | ---------------------- | | -------------------------------- | ---------------------------------------- |
| Top | 竖直方向上边缘<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 | | Top | 竖直方向上边缘<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| Center<sup>(deprecated) </sup> | 竖直方向居中位置<br/> 从API version 9开始废弃 | | Center<sup>(deprecated) </sup> | 竖直方向居中位置<br/> 从API version 9开始废弃 |
| Bottom | 竖直方向下边缘<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 | | Bottom | 竖直方向下边缘<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| Baseline<sup>(deprecated) </sup> | 交叉轴方向文本基线位置<br/> 从API version 9开始废弃 | | Baseline<sup>(deprecated) </sup> | 交叉轴方向文本基线位置<br/> 从API version 9开始废弃 |
| Start | 水平方向起始位置<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 | | Start | 水平方向起始位置<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| Middle<sup>(deprecated) </sup> | 水平方向居中位置<br/> 从API version 9开始废弃 | | Middle<sup>(deprecated) </sup> | 水平方向居中位置<br/> 从API version 9开始废弃 |
| End | 水平方向末尾位置<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 | | End | 水平方向末尾位置<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## Week ## Week
| 名称 | 描述 | | 名称 | 描述 |
| -------- | ---------------------- | | ---- | ---- |
| Mon | 星期一 | | Mon | 星期一 |
| Tue | 星期二 | | Tue | 星期二 |
| Wed | 星期三 | | Wed | 星期三 |
| Thur | 星期四 | | Thur | 星期四 |
| Fri | 星期五 | | Fri | 星期五 |
| Sat | 星期六 | | Sat | 星期六 |
| Sun | 星期日 | | Sun | 星期日 |
## Direction ## Direction
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ---- | ---------------------- | | ---- | ----------- |
| Ltr | 元素从左到右布局。 | | Ltr | 元素从左到右布局。 |
| Rtl | 元素从右到左布局。 | | Rtl | 元素从右到左布局。 |
| Auto | 使用系统默认布局方向。 | | Auto | 使用系统默认布局方向。 |
## BarState ## BarState
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ---- | -------------------------------- | | ---- | ------------------ |
| Off | 不显示。 | | Off | 不显示。 |
| On | 常驻显示。 | | On | 常驻显示。 |
| Auto | 按需显示(触摸时显示,2s后消失)。 | | Auto | 按需显示(触摸时显示,2s后消失)。 |
## EdgeEffect ## EdgeEffect
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------ | ------------------------------------------------------------ | | ------ | ---------------------------------------- |
| Spring | 弹性物理动效,滑动到边缘后可以根据初始速度或通过触摸事件继续滑动一段距离,松手后回弹。 | | Spring | 弹性物理动效,滑动到边缘后可以根据初始速度或通过触摸事件继续滑动一段距离,松手后回弹。 |
| Fade | 阴影效果,滑动到边缘后会有圆弧状的阴影。 | | Fade | 阴影效果,滑动到边缘后会有圆弧状的阴影。 |
| None | 滑动到边缘后无效果。 | | None | 滑动到边缘后无效果。 |
## Alignment ## Alignment
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ----------- | ---------------- | | ----------- | -------- |
| TopStart | 顶部起始端。 | | TopStart | 顶部起始端。 |
| Top | 顶部横向居中。 | | Top | 顶部横向居中。 |
| TopEnd | 顶部尾端。 | | TopEnd | 顶部尾端。 |
| Start | 起始端纵向居中。 | | Start | 起始端纵向居中。 |
| Center | 横向和纵向居中。 | | Center | 横向和纵向居中。 |
| End | 尾端纵向居中。 | | End | 尾端纵向居中。 |
| BottomStart | 底部起始端。 | | BottomStart | 底部起始端。 |
| Bottom | 底部横向居中。 | | Bottom | 底部横向居中。 |
| BottomEnd | 底部尾端。 | | BottomEnd | 底部尾端。 |
## TransitionType ## TransitionType
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------ | -------------------------------------------------- | | ------ | ------------------------------ |
| All | 指定当前的Transition动效生效在组件的所有变化场景。 | | All | 指定当前的Transition动效生效在组件的所有变化场景。 |
| Insert | 指定当前的Transition动效生效在组件的插入显示场景。 | | Insert | 指定当前的Transition动效生效在组件的插入显示场景。 |
| Delete | 指定当前的Transition动效生效在组件的删除隐藏场景。 | | Delete | 指定当前的Transition动效生效在组件的删除隐藏场景。 |
## RelateType ## RelateType
| 名称 | 描述 | | 名称 | 描述 |
| ------ | ------------------------------- | | ---- | -------------- |
| FILL | 缩放当前子组件以填充满父组件 | | FILL | 缩放当前子组件以填充满父组件 |
| FIT | 缩放当前子组件以自适应父组件 | | FIT | 缩放当前子组件以自适应父组件 |
## Visibility ## Visibility
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------- | -------------------------------- | | ------- | ---------------- |
| Hidden | 隐藏,但参与布局进行占位。 | | Hidden | 隐藏,但参与布局进行占位。 |
| Visible | 显示。 | | Visible | 显示。 |
| None | 隐藏,但不参与布局,不进行占位。 | | None | 隐藏,但不参与布局,不进行占位。 |
## LineCapStyle ## LineCapStyle
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------ | -------------------- | | ------ | ----------------------------- |
| Butt | 线条两端为平行线,不额外扩展。 | | Butt | 线条两端为平行线,不额外扩展。 |
| Round | 在线条两端延伸半个圆,直径等于线宽。 | | Round | 在线条两端延伸半个圆,直径等于线宽。 |
| Square | 在线条两端延伸一个矩形,宽度等于线宽的一半,高度等于线宽。 | | Square | 在线条两端延伸一个矩形,宽度等于线宽的一半,高度等于线宽。 |
## Axis ## Axis
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ---------- | ------------ | | ---------- | ------ |
| Vertical | 方向为纵向。 | | Vertical | 方向为纵向。 |
| Horizontal | 方向为横向。 | | Horizontal | 方向为横向。 |
...@@ -268,21 +272,21 @@ ...@@ -268,21 +272,21 @@
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------ | ------------------------ | | ------ | ------------ |
| Start | 按照语言方向起始端对齐。 | | Start | 按照语言方向起始端对齐。 |
| Center | 居中对齐,默认对齐方式。 | | Center | 居中对齐,默认对齐方式。 |
| End | 按照语言方向末端对齐。 | | End | 按照语言方向末端对齐。 |
## FlexAlign ## FlexAlign
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------------ | ------------------------------------------------------------ | | ------------ | ---------------------------------------- |
| Start | 元素在主轴方向首端对齐,第一个元素与行首对齐,同时后续的元素与前一个对齐。 | | Start | 元素在主轴方向首端对齐,第一个元素与行首对齐,同时后续的元素与前一个对齐。 |
| Center | 元素在主轴方向中心对齐,第一个元素与行首的距离与最后一个元素与行尾距离相同。 | | Center | 元素在主轴方向中心对齐,第一个元素与行首的距离与最后一个元素与行尾距离相同。 |
| End | 元素在主轴方向尾部对齐,最后一个元素与行尾对齐,其他元素与后一个对齐。 | | End | 元素在主轴方向尾部对齐,最后一个元素与行尾对齐,其他元素与后一个对齐。 |
| SpaceBetween | Flex主轴方向均匀分配弹性元素,相邻元素之间距离相同。第一个元素与行首对齐,最后一个元素与行尾对齐。 | | SpaceBetween | Flex主轴方向均匀分配弹性元素,相邻元素之间距离相同。第一个元素与行首对齐,最后一个元素与行尾对齐。 |
| SpaceAround | Flex主轴方向均匀分配弹性元素,相邻元素之间距离相同。第一个元素到行首的距离和最后一个元素到行尾的距离是相邻元素之间距离的一半。 | | SpaceAround | Flex主轴方向均匀分配弹性元素,相邻元素之间距离相同。第一个元素到行首的距离和最后一个元素到行尾的距离是相邻元素之间距离的一半。 |
| SpaceEvenly | Flex主轴方向均匀分配弹性元素,相邻元素之间的距离、第一个元素与行首的间距、最后一个元素到行尾的间距都完全一样。 | | SpaceEvenly | Flex主轴方向均匀分配弹性元素,相邻元素之间的距离、第一个元素与行首的间距、最后一个元素到行尾的间距都完全一样。 |
...@@ -291,96 +295,96 @@ ...@@ -291,96 +295,96 @@
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| -------- | ------------------------------------------------------------ | | -------- | ---------------------------------------- |
| Auto | 使用Flex容器中默认配置。 | | Auto | 使用Flex容器中默认配置。 |
| Start | 元素在Flex容器中,交叉轴方向首部对齐。 | | Start | 元素在Flex容器中,交叉轴方向首部对齐。 |
| Center | 元素在Flex容器中,交叉轴方向居中对齐。 | | Center | 元素在Flex容器中,交叉轴方向居中对齐。 |
| End | 元素在Flex容器中,交叉轴方向底部对齐。 | | End | 元素在Flex容器中,交叉轴方向底部对齐。 |
| Stretch | 元素在Flex容器中,交叉轴方向拉伸填充。容器为Flex且设置Wrap为FlexWrap.Wrap或FlexWrap.WrapReverse时,元素拉伸到与当前行/列交叉轴长度最长的元素尺寸。其余情况在元素未设置尺寸时,拉伸到容器尺寸。 | | Stretch | 元素在Flex容器中,交叉轴方向拉伸填充。容器为Flex且设置Wrap为FlexWrap.Wrap或FlexWrap.WrapReverse时,元素拉伸到与当前行/列交叉轴长度最长的元素尺寸。其余情况在元素未设置尺寸时,拉伸到容器尺寸。 |
| Baseline | 元素在Flex容器中,交叉轴方向文本基线对齐。 | | Baseline | 元素在Flex容器中,交叉轴方向文本基线对齐。 |
## FlexDirection ## FlexDirection
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------------- | ------------------------------ | | ------------- | ---------------- |
| Row | 主轴与行方向一致作为布局模式。 | | Row | 主轴与行方向一致作为布局模式。 |
| RowReverse | 与Row方向相反方向进行布局。 | | RowReverse | 与Row方向相反方向进行布局。 |
| Column | 主轴与列方向一致作为布局模式。 | | Column | 主轴与列方向一致作为布局模式。 |
| ColumnReverse | 与Column相反方向进行布局。 | | ColumnReverse | 与Column相反方向进行布局。 |
## FlexWrap ## FlexWrap
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ----------- | ------------------------------------------------- | | ----------- | --------------------------- |
| NoWrap | Flex容器的元素单行/列布局,子项不允许超出容器。 | | NoWrap | Flex容器的元素单行/列布局,子项不允许超出容器。 |
| Wrap | Flex容器的元素多行/列排布,子项允许超出容器。 | | Wrap | Flex容器的元素多行/列排布,子项允许超出容器。 |
| WrapReverse | Flex容器的元素反向多行/列排布,子项允许超出容器。 | | WrapReverse | Flex容器的元素反向多行/列排布,子项允许超出容器。 |
## VerticalAlign ## VerticalAlign
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------ | ------------------------ | | ------ | ------------ |
| Top | 顶部对齐。 | | Top | 顶部对齐。 |
| Center | 居中对齐,默认对齐方式。 | | Center | 居中对齐,默认对齐方式。 |
| Bottom | 底部对齐。 | | Bottom | 底部对齐。 |
## ImageRepeat ## ImageRepeat
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| -------- | -------------------------- | | -------- | ------------- |
| X | 只在水平轴上重复绘制图片。 | | X | 只在水平轴上重复绘制图片。 |
| Y | 只在竖直轴上重复绘制图片。 | | Y | 只在竖直轴上重复绘制图片。 |
| XY | 在两个轴上重复绘制图片。 | | XY | 在两个轴上重复绘制图片。 |
| NoRepeat | 不重复绘制图片。 | | NoRepeat | 不重复绘制图片。 |
## ImageSize ## ImageSize
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 类型 | 描述 | | 类型 | 描述 |
| ------- | ------------------------------------------------------------ | | ------- | ----------------------------------- |
| Cover | 默认值,保持宽高比进行缩小或者放大,使得图片两边都大于或等于显示边界。 | | Cover | 默认值,保持宽高比进行缩小或者放大,使得图片两边都大于或等于显示边界。 |
| Contain | 保持宽高比进行缩小或者放大,使得图片完全显示在显示边界内。 | | Contain | 保持宽高比进行缩小或者放大,使得图片完全显示在显示边界内。 |
| Auto | 保持原图的比例不变。 | | Auto | 保持原图的比例不变。 |
## GradientDirection ## GradientDirection
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ----------- | ---------- | | ----------- | ----- |
| Left | 从右向左。 | | Left | 从右向左。 |
| Top | 从下向上。 | | Top | 从下向上。 |
| Right | 从左向右。 | | Right | 从左向右。 |
| Bottom | 从上向下。 | | Bottom | 从上向下。 |
| LeftTop | 左上。 | | LeftTop | 左上。 |
| LeftBottom | 左下。 | | LeftBottom | 左下。 |
| RightTop | 右上。 | | RightTop | 右上。 |
| RightBottom | 右下。 | | RightBottom | 右下。 |
| None | 无。 | | None | 无。 |
## SharedTransitionEffectType ## SharedTransitionEffectType
| 名称 | 描述 | | 名称 | 描述 |
| ----------- | ---------- | | -------- | ---------------------------------------- |
| Static | 目标页面元素的位置保持不变,可以配置透明度动画。目前,只有为重定向到目标页面而配置的静态效果才会生效。 | | Static | 目标页面元素的位置保持不变,可以配置透明度动画。目前,只有为重定向到目标页面而配置的静态效果才会生效。 |
| Exchange | 将源页面元素移动到目标页面元素位置并适当缩放。 | | Exchange | 将源页面元素移动到目标页面元素位置并适当缩放。 |
## FontStyle ## FontStyle
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------ | ---------------- | | ------ | -------- |
| Normal | 标准的字体样式。 | | Normal | 标准的字体样式。 |
| Italic | 斜体的字体样式。 | | Italic | 斜体的字体样式。 |
...@@ -388,151 +392,151 @@ ...@@ -388,151 +392,151 @@
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------- | -------------- | | ------- | ------- |
| Lighter | 字体较细。 | | Lighter | 字体较细。 |
| Normal | 字体粗细正常。 | | Normal | 字体粗细正常。 |
| Regular | 字体粗细正常。 | | Regular | 字体粗细正常。 |
| Medium | 字体粗细适中。 | | Medium | 字体粗细适中。 |
| Bold | 字体较粗。 | | Bold | 字体较粗。 |
| Bolder | 字体非常粗。 | | Bolder | 字体非常粗。 |
## TextAlign ## TextAlign
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| --------------------- | -------------- | | --------------------- | ------- |
| Start | 水平对齐首部。 | | Start | 水平对齐首部。 |
| Center | 水平居中对齐。 | | Center | 水平居中对齐。 |
| End | 水平对齐尾部。 | | End | 水平对齐尾部。 |
| Justify<sup>10+</sup> | 双端对齐。 | | Justify<sup>10+</sup> | 双端对齐。 |
## TextOverflow ## TextOverflow
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| --------------------- | -------------------------------------- | | --------------------- | ------------------- |
| None | 文本超长时裁剪显示。 | | None | 文本超长时裁剪显示。 |
| Clip | 文本超长时进行裁剪显示。 | | Clip | 文本超长时进行裁剪显示。 |
| Ellipsis | 文本超长时显示不下的文本用省略号代替。 | | Ellipsis | 文本超长时显示不下的文本用省略号代替。 |
| Marquee<sup>10+</sup> | 文本超长时以跑马灯的方式展示。 | | Marquee<sup>10+</sup> | 文本超长时以跑马灯的方式展示。 |
## TextDecorationType ## TextDecorationType
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ----------- | ------------------ | | ----------- | --------- |
| Underline | 文字下划线修饰。 | | Underline | 文字下划线修饰。 |
| LineThrough | 穿过文本的修饰线。 | | LineThrough | 穿过文本的修饰线。 |
| Overline | 文字上划线修饰。 | | Overline | 文字上划线修饰。 |
| None | 不使用文本装饰线。 | | None | 不使用文本装饰线。 |
## TextCase ## TextCase
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| --------- | -------------------- | | --------- | ---------- |
| Normal | 保持文本原有大小写。 | | Normal | 保持文本原有大小写。 |
| LowerCase | 文本采用全小写。 | | LowerCase | 文本采用全小写。 |
| UpperCase | 文本采用全大写。 | | UpperCase | 文本采用全大写。 |
## ResponseType<sup>8+</sup> ## ResponseType<sup>8+</sup>
| 名称 | 描述 | | 名称 | 描述 |
| ---------- | -------------------------- | | ---------- | ------------- |
| LongPress | 通过长按触发菜单弹出。 | | LongPress | 通过长按触发菜单弹出。 |
| RightClick | 通过鼠标右键触发菜单弹出。 | | RightClick | 通过鼠标右键触发菜单弹出。 |
## HoverEffect<sup>8+</sup> ## HoverEffect<sup>8+</sup>
| 名称 | 描述 | | 名称 | 描述 |
| --------- | ---------------------------- | | --------- | -------------- |
| Auto | 使用组件的系统默认悬浮效果。 | | Auto | 使用组件的系统默认悬浮效果。 |
| Scale | 放大缩小效果。 | | Scale | 放大缩小效果。 |
| Highlight | 背景淡入淡出的强调效果。 | | Highlight | 背景淡入淡出的强调效果。 |
| None | 不设置效果。 | | None | 不设置效果。 |
## Placement<sup>8+</sup> ## Placement<sup>8+</sup>
| 名称 | 描述 | | 名称 | 描述 |
| ------------- | ------------------------------------------------------------ | | ------------- | -------------------------------------- |
| Left | 气泡提示位于组件左侧,与组件左侧中心对齐。 | | Left | 气泡提示位于组件左侧,与组件左侧中心对齐。 |
| Right | 气泡提示位于组件右侧,与组件右侧中心对齐。 | | Right | 气泡提示位于组件右侧,与组件右侧中心对齐。 |
| Top | 气泡提示位于组件上侧,与组件上侧中心对齐。 | | Top | 气泡提示位于组件上侧,与组件上侧中心对齐。 |
| Bottom | 气泡提示位于组件下侧,与组件下侧中心对齐。 | | Bottom | 气泡提示位于组件下侧,与组件下侧中心对齐。 |
| TopLeft | 气泡提示位于组件上侧,从API Version 9开始,与组件左侧边缘对齐。 | | TopLeft | 气泡提示位于组件上侧,从API Version 9开始,与组件左侧边缘对齐。 |
| TopRight | 气泡提示位于组件上侧,从API Version 9开始,与组件右侧边缘对齐。 | | TopRight | 气泡提示位于组件上侧,从API Version 9开始,与组件右侧边缘对齐。 |
| BottomLeft | 气泡提示位于组件下侧,从API Version 9开始,与组件左侧边缘对齐。 | | BottomLeft | 气泡提示位于组件下侧,从API Version 9开始,与组件左侧边缘对齐。 |
| BottomRight | 气泡提示位于组件下侧,从API Version 9开始,与组件右侧边缘对齐。 | | BottomRight | 气泡提示位于组件下侧,从API Version 9开始,与组件右侧边缘对齐。 |
| LeftTop9+ | 气泡提示位于组件左侧,与组件上侧边缘对齐。 | | LeftTop9+ | 气泡提示位于组件左侧,与组件上侧边缘对齐。 |
| LeftBottom9+ | 气泡提示位于组件左侧,与组件下侧边缘对齐。 | | LeftBottom9+ | 气泡提示位于组件左侧,与组件下侧边缘对齐。 |
| RightTop9+ | 气泡提示位于组件右侧,与组件上侧边缘对齐。 | | RightTop9+ | 气泡提示位于组件右侧,与组件上侧边缘对齐。 |
| RightBottom9+ | 气泡提示位于组件右侧,与组件下侧边缘对齐。 | | RightBottom9+ | 气泡提示位于组件右侧,与组件下侧边缘对齐。 |
## CopyOptions<sup>9+</sup> ## CopyOptions<sup>9+</sup>
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ----------- | -------------------- | | ----------- | -------- |
| None | 不支持复制。 | | None | 不支持复制。 |
| InApp | 支持应用内复制。 | | InApp | 支持应用内复制。 |
| LocalDevice | 支持设备内复制。 | | LocalDevice | 支持设备内复制。 |
## HitTestMode<sup>9+</sup> ## HitTestMode<sup>9+</sup>
| 名称 | 描述 | | 名称 | 描述 |
| ----------- | -------------------- | | ----------- | ---------------------------------------- |
| Default | 自身节点和子节点都响应触摸事件的命中测试,但会阻止被该节点屏蔽的其他节点的命中测试。 | | Default | 自身节点和子节点都响应触摸事件的命中测试,但会阻止被该节点屏蔽的其他节点的命中测试。 |
| Block | 自身节点响应触摸事件的命中测试,但阻止被该节点屏蔽的子节点和其他节点的命中测试。 | | Block | 自身节点响应触摸事件的命中测试,但阻止被该节点屏蔽的子节点和其他节点的命中测试。 |
| Transparent | 自身节点和子节点响应触摸事件的命中测试,并允许对被该节点屏蔽的其他节点进行命中测试。 | | Transparent | 自身节点和子节点响应触摸事件的命中测试,并允许对被该节点屏蔽的其他节点进行命中测试。 |
| None | 自身节点不会响应触摸事件的命中测试,但子节点会对触摸事件进行命中测试。 | | None | 自身节点不会响应触摸事件的命中测试,但子节点会对触摸事件进行命中测试。 |
## BlurStyle<sup>9+</sup> ## BlurStyle<sup>9+</sup>
该接口支持在ArkTS卡片中使用。 该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| ------- | ---------- | | -------------------- | --------- |
| Thin | 轻薄材质模糊。 | | Thin | 轻薄材质模糊。 |
| Regular | 普通厚度材质模糊。 | | Regular | 普通厚度材质模糊。 |
| Thick | 厚材质模糊。 | | Thick | 厚材质模糊。 |
| BackgroundThin | 近距景深模糊。 | | BackgroundThin | 近距景深模糊。 |
| BackgroundRegular | 中距景深模糊。 | | BackgroundRegular | 中距景深模糊。 |
| BackgroundThick | 远距景深模糊。 | | BackgroundThick | 远距景深模糊。 |
| BackgroundUltraThick | 超远距景深模糊。 | | BackgroundUltraThick | 超远距景深模糊。 |
## ThemeColorMode<sup>10+</sup> ## ThemeColorMode<sup>10+</sup>
| 名称 | 描述 | | 名称 | 描述 |
| ------- | ---------- | | ------ | ---------- |
| System | 跟随系统深浅色模式。 | | System | 跟随系统深浅色模式。 |
| Light | 固定使用浅色模式。 | | Light | 固定使用浅色模式。 |
| Dark | 固定使用深色模式。 | | Dark | 固定使用深色模式。 |
## AdaptiveColor<sup>10+</sup> ## AdaptiveColor<sup>10+</sup>
| 名称 | 描述 | | 名称 | 描述 |
| ------- | ----------- | | ------- | ------------------------- |
| Default | 不使用取色模糊。使用默认的颜色作为蒙版颜色。 | | Default | 不使用取色模糊。使用默认的颜色作为蒙版颜色。 |
| Average | 使用取色模糊。将取色区域的颜色平均值作为蒙版颜色。 | | Average | 使用取色模糊。将取色区域的颜色平均值作为蒙版颜色。 |
## TextHeightAdaptivePolicy<sup>10+</sup> ## TextHeightAdaptivePolicy<sup>10+</sup>
| 名称 | 描述 | | 名称 | 描述 |
| ----------------------- | ------------------------------------------------ | | ----------------------- | ------------------------ |
| MAX_LINES_FIRST | 设置文本高度自适应方式为以MaxLines优先。 | | MAX_LINES_FIRST | 设置文本高度自适应方式为以MaxLines优先。 |
| MIN_FONT_SIZE_FIRST | 设置文本高度自适应方式为以缩小字体优先。 | | MIN_FONT_SIZE_FIRST | 设置文本高度自适应方式为以缩小字体优先。 |
| LAYOUT_CONSTRAINT_FIRST | 设置文本高度自适应方式为以布局约束(高度)优先。 | | LAYOUT_CONSTRAINT_FIRST | 设置文本高度自适应方式为以布局约束(高度)优先。 |
## TransitionEdge<sup>10+<sup> ## TransitionEdge<sup>10+<sup>
| 名称 | 描述 | | 名称 | 描述 |
| -------- | -------- | | ------ | ------ |
| TOP | 窗口的上边缘 | | TOP | 窗口的上边缘 |
| BOTTOM | 窗口的下边缘 | | BOTTOM | 窗口的下边缘 |
| START | 窗口的左边缘 | | START | 窗口的左边缘 |
| END | 窗口的右边缘 | | END | 窗口的右边缘 |
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
> **说明:** > **说明:**
> >
> 该组件从API version7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 > 该组件从API version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 子组件 ## 子组件
...@@ -22,46 +22,46 @@ Progress(options: {value: number, total?: number, type?: ProgressType}) ...@@ -22,46 +22,46 @@ Progress(options: {value: number, total?: number, type?: ProgressType})
**参数:** **参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 | | 参数名 | 参数类型 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- | | -------------------------- | ----------------------------------- | ---- | ---------------------------------------- |
| value | number | 是 | 指定当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为total。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 | | value | number | 是 | 指定当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为total。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| total | number | 否 | 指定进度总长。<br/>默认值:100<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卡片中使用。 | | 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 | | style<sup>deprecated</sup> | [ProgressStyle](#progressstyle枚举说明) | 否 | 指定进度条样式。<br/>该参数从API version8开始废弃,建议使用type替代。<br/>默认值:ProgressStyle.Linear |
## ProgressType枚举说明 ## ProgressType枚举说明
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| -------- | -------- | | ---------------------- | ---------------------------------------- |
| Linear | 线性样式。从API version9开始,高度大于宽度的时候自适应垂直显示。 | | Linear | 线性样式。从API version9开始,高度大于宽度的时候自适应垂直显示。 |
| Ring<sup>8+</sup> | 环形无刻度样式,环形圆环逐渐显示至完全填充效果。 | | Ring<sup>8+</sup> | 环形无刻度样式,环形圆环逐渐显示至完全填充效果。 |
| Eclipse<sup>8+</sup> | 圆形样式,显示类似月圆月缺的进度展示效果,从月牙逐渐变化至满月。| | Eclipse<sup>8+</sup> | 圆形样式,显示类似月圆月缺的进度展示效果,从月牙逐渐变化至满月。 |
| ScaleRing<sup>8+</sup> | 环形有刻度样式,显示类似时钟刻度形式的进度展示效果。从API version9开始,刻度外圈出现重叠的时候自动转换为环形无刻度进度条。| | ScaleRing<sup>8+</sup> | 环形有刻度样式,显示类似时钟刻度形式的进度展示效果。从API version9开始,刻度外圈出现重叠的时候自动转换为环形无刻度进度条。 |
| Capsule<sup>8+</sup> | 胶囊样式,头尾两端圆弧处的进度展示效果与Eclipse相同;中段处的进度展示效果与Linear相同。高度大于宽度的时候自适应垂直显示。 | | Capsule<sup>8+</sup> | 胶囊样式,头尾两端圆弧处的进度展示效果与Eclipse相同;中段处的进度展示效果与Linear相同。高度大于宽度的时候自适应垂直显示。 |
## ProgressStyle枚举说明 ## ProgressStyle枚举说明
从API version 9开始,该接口支持在ArkTS卡片中使用。 从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 | | 名称 | 描述 |
| --------- | ------------------------------------------------------------ | | --------- | ---------------------------------------- |
| Linear | 线性样式。 | | Linear | 线性样式。 |
| Ring | 环形无刻度样式,环形圆环逐渐显示至完全填充效果。 | | Ring | 环形无刻度样式,环形圆环逐渐显示至完全填充效果。 |
| Eclipse | 圆形样式,显示类似月圆月缺的进度展示效果,从月牙逐渐变化至满月。| | Eclipse | 圆形样式,显示类似月圆月缺的进度展示效果,从月牙逐渐变化至满月。 |
| ScaleRing | 环形有刻度样式,显示类似时钟刻度形式的进度展示效果。| | ScaleRing | 环形有刻度样式,显示类似时钟刻度形式的进度展示效果。 |
| Capsule | 胶囊样式,头尾两端圆弧处的进度展示效果与Eclipse相同;中段处的进度展示效果与Linear相同。高度大于宽度的时候自适应垂直显示。 | | Capsule | 胶囊样式,头尾两端圆弧处的进度展示效果与Eclipse相同;中段处的进度展示效果与Linear相同。高度大于宽度的时候自适应垂直显示。 |
## 属性 ## 属性
除支持[通用属性](ts-universal-attributes-size.md)外,还支持以下属性: 除支持[通用属性](ts-universal-attributes-size.md)外,还支持以下属性:
| 名称 | 参数类型 | 描述 | | 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- | | ------------------ | ---------------------------------------- | ---------------------------------------- |
| value | number | 设置当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为total。非法数值不生效。<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卡片中使用。 | | 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卡片中使用。 | | 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卡片中使用。 | | 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 { ...@@ -128,4 +128,4 @@ struct ProgressExample {
} }
``` ```
![progress](figures/progress.png) ![progress](figures/arkts-progress.png)
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
> **说明:** > **说明:**
> >
> 该组件从API&nbsp;Version&nbsp;9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 > 该组件从API Version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
> >
> 本组件为系统接口。 > 本组件为系统接口。
...@@ -29,9 +29,9 @@ AbilityComponent(want: Want) ...@@ -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 ## aboutToAppear
...@@ -123,8 +122,8 @@ onRecycle?(params: { [key: string]: unknown }): void ...@@ -123,8 +122,8 @@ onRecycle?(params: { [key: string]: unknown }): void
**参数:** **参数:**
| 参数名 | 类型 | 说明 | | 参数名 | 类型 | 说明 |
| ------ | -------------------------- | -------------------- | | ------ | -------------------------- | ---------- |
| params | { [key: string]: unknown } | 自定义组件的构造参数 | | params | { [key: string]: unknown } | 自定义组件的构造参数 |
......
# 像素单位 # 像素单位
为开发者提供4种像素单位,框架采用vp为基准数据单位。 ArkUI为开发者提供4种像素单位,框架采用vp为基准数据单位。
> **说明:**
>
> 本模块首批接口从API version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
| 名称 | 描述 |
| ---- | ------------------------------------------------------------ | | 名称 | 描述 |
| px | 屏幕物理像素单位。 | | ---- | ---------------------------------------- |
| px | 屏幕物理像素单位。 |
| vp | 屏幕密度相关像素,根据屏幕像素密度转换为屏幕物理像素,当数值不带单位时,默认单位vp。在实际宽度为1440物理像素的屏幕上,1vp约等于3px。 | | vp | 屏幕密度相关像素,根据屏幕像素密度转换为屏幕物理像素,当数值不带单位时,默认单位vp。在实际宽度为1440物理像素的屏幕上,1vp约等于3px。 |
| fp | 字体像素,与vp类似适用屏幕密度变化,随系统字体大小设置变化。 | | fp | 字体像素,与vp类似适用屏幕密度变化,随系统字体大小设置变化。 |
| lpx | 视窗逻辑像素单位,lpx单位为实际屏幕宽度与逻辑宽度(通过designWidth配置)的比值,designWidth默认值为720。当designWidth为720时,在实际宽度为1440物理像素的屏幕上,1lpx为2px大小。 | | lpx | 视窗逻辑像素单位,lpx单位为实际屏幕宽度与逻辑宽度(通过designWidth配置)的比值,designWidth默认值为720。当designWidth为720时,在实际宽度为1440物理像素的屏幕上,1lpx为2px大小。 |
...@@ -15,12 +19,12 @@ ...@@ -15,12 +19,12 @@
提供其他单位与px单位互相转换的方法。 提供其他单位与px单位互相转换的方法。
| 接口 | 描述 | | 接口 | 描述 |
| --------------------------------------------------- | ------------------------------------------------------------ | | ---------------------------------------- | ---------------------------------------- |
| vp2px(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将vp单位的数值转换为以px为单位的数值。<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卡片中使用。 | | 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卡片中使用。 | | 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卡片中使用。 | | 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卡片中使用。 | | 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卡片中使用。 | | px2lpx(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将px单位的数值转换为以lpx为单位的数值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
......
# 类型定义 # 类型定义
> **说明:**
>
> 本模块首批接口从API version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## Resource ## Resource
资源引用类型,用于设置组件属性的值。 资源引用类型,用于设置组件属性的值。
...@@ -24,49 +28,49 @@ ...@@ -24,49 +28,49 @@
长度类型,用于描述尺寸单位。 长度类型,用于描述尺寸单位。
| 类型 | 说明 | | 类型 | 说明 |
| -------- | -------------------------------------- | | --------------------- | -------------------------------------- |
| string | 需要显式指定像素单位,如'10px',也可设置百分比字符串,如'100%'。 | | string | 需要显式指定像素单位,如'10px',也可设置百分比字符串,如'100%'。 |
| number | 默认单位vp。 | | number | 默认单位vp。 |
| [Resource](#resource) | 资源引用类型,引入系统资源或者应用资源中的尺寸。 | | [Resource](#resource) | 资源引用类型,引入系统资源或者应用资源中的尺寸。 |
## ResourceStr ## ResourceStr
字符串类型,用于描述字符串入参可以使用的类型。 字符串类型,用于描述字符串入参可以使用的类型。
| 类型 | 说明 | | 类型 | 说明 |
| -------- | ---------------------------- | | --------------------- | ------------------------- |
| string | 字符串类型。 | | string | 字符串类型。 |
| [Resource](#resource) | 资源引用类型,引入系统资源或者应用资源中的字符串。 | | [Resource](#resource) | 资源引用类型,引入系统资源或者应用资源中的字符串。 |
## Padding ## Padding
内边距类型,用于描述组件不同方向的内边距。 内边距类型,用于描述组件不同方向的内边距。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ------ | ------ | ---- | --------------- | | ------ | ----------------- | ---- | -------------------- |
| top | [Length](#length) | 否 | 上内边距,组件内元素距组件顶部的尺寸。 | | top | [Length](#length) | 否 | 上内边距,组件内元素距组件顶部的尺寸。 |
| right | [Length](#length) | 否 | 右内边距,组件内元素距组件右边界的尺寸。 | | right | [Length](#length) | 否 | 右内边距,组件内元素距组件右边界的尺寸。 |
| bottom | [Length](#length) | 否 | 下内边距,组件内元素距组件底部的尺寸。 | | bottom | [Length](#length) | 否 | 下内边距,组件内元素距组件底部的尺寸。 |
| left | [Length](#length) | 否 | 左内边距,组件内元素距组件左边界的尺寸。 | | left | [Length](#length) | 否 | 左内边距,组件内元素距组件左边界的尺寸。 |
## Margin ## Margin
外边距类型,用于描述组件不同方向的外边距。 外边距类型,用于描述组件不同方向的外边距。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ------ | ------ | ---- | --------------- | | ------ | ----------------- | ---- | -------------------- |
| top | [Length](#length) | 否 | 上外边距,组件顶部距组件外元素的尺寸。 | | top | [Length](#length) | 否 | 上外边距,组件顶部距组件外元素的尺寸。 |
| right | [Length](#length) | 否 | 右外边距,组件右边界距组件外元素的尺寸。 | | right | [Length](#length) | 否 | 右外边距,组件右边界距组件外元素的尺寸。 |
| bottom | [Length](#length) | 否 | 下外边距,组件底部距组件外元素的尺寸。 | | bottom | [Length](#length) | 否 | 下外边距,组件底部距组件外元素的尺寸。 |
| left | [Length](#length) | 否 | 坐外边距,组件左边界距组件外元素的尺寸。 | | left | [Length](#length) | 否 | 坐外边距,组件左边界距组件外元素的尺寸。 |
## EdgeWidths<sup>9+</sup> ## EdgeWidths<sup>9+</sup>
边框宽度类型,用于描述组件边框不同方向的宽度。 边框宽度类型,用于描述组件边框不同方向的宽度。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ------ | ------ | ---- | -------- | | ------ | ----------------- | ---- | -------- |
| top | [Length](#length) | 否 | 组件上边框宽度。 | | top | [Length](#length) | 否 | 组件上边框宽度。 |
| right | [Length](#length) | 否 | 组件右边框宽度。 | | right | [Length](#length) | 否 | 组件右边框宽度。 |
| bottom | [Length](#length) | 否 | 组件下边框宽度。 | | bottom | [Length](#length) | 否 | 组件下边框宽度。 |
...@@ -76,8 +80,8 @@ ...@@ -76,8 +80,8 @@
圆角类型,用于描述组件边框圆角半径。 圆角类型,用于描述组件边框圆角半径。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ----------- | ------ | ---- | ---------- | | ----------- | ----------------- | ---- | ---------- |
| topLeft | [Length](#length) | 否 | 组件左上角圆角半径。 | | topLeft | [Length](#length) | 否 | 组件左上角圆角半径。 |
| topRight | [Length](#length) | 否 | 组件右上角圆角半径。 | | topRight | [Length](#length) | 否 | 组件右上角圆角半径。 |
| bottomLeft | [Length](#length) | 否 | 组件左下角圆角半径。 | | bottomLeft | [Length](#length) | 否 | 组件左下角圆角半径。 |
...@@ -87,8 +91,8 @@ ...@@ -87,8 +91,8 @@
边框颜色,用于描述组件边框四条边的颜色。 边框颜色,用于描述组件边框四条边的颜色。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ------ | ------------- | ---- | -------- | | ------ | ------------------------------- | ---- | -------- |
| top | [ResourceColor](#resourcecolor) | 否 | 组件上边框颜色。 | | top | [ResourceColor](#resourcecolor) | 否 | 组件上边框颜色。 |
| right | [ResourceColor](#resourcecolor) | 否 | 组件右边框颜色。 | | right | [ResourceColor](#resourcecolor) | 否 | 组件右边框颜色。 |
| bottom | [ResourceColor](#resourcecolor) | 否 | 组件下边框颜色。 | | bottom | [ResourceColor](#resourcecolor) | 否 | 组件下边框颜色。 |
...@@ -98,8 +102,8 @@ ...@@ -98,8 +102,8 @@
边框样式,用于描述组件边框四条边的样式。 边框样式,用于描述组件边框四条边的样式。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ------ | ----------- | ---- | -------- | | ------ | ---------------------------------------- | ---- | -------- |
| top | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 组件上边框样式。 | | top | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 组件上边框样式。 |
| right | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 组件右边框样式。 | | right | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 组件右边框样式。 |
| bottom | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 组件下边框样式。 | | bottom | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 组件下边框样式。 |
...@@ -110,8 +114,8 @@ ...@@ -110,8 +114,8 @@
相对布局完成位置坐标偏移量。 相对布局完成位置坐标偏移量。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ---- | ------ | ---- | -------- | | ---- | ----------------- | ---- | -------- |
| dx | [Length](#length) | 是 | 水平方向偏移量。 | | dx | [Length](#length) | 是 | 水平方向偏移量。 |
| dy | [Length](#length) | 是 | 竖直方向偏移量。 | | dy | [Length](#length) | 是 | 竖直方向偏移量。 |
...@@ -119,27 +123,27 @@ ...@@ -119,27 +123,27 @@
颜色类型,用于描述资源颜色类型。 颜色类型,用于描述资源颜色类型。
| 类型 | 说明 | | 类型 | 说明 |
| ---------------------------------------- | ------------------------------------------------- | | ----------------------------------- | ---------------------------------------- |
| [Color](ts-appendix-enums.md#color) | 颜色枚举值。 | | [Color](ts-appendix-enums.md#color) | 颜色枚举值。 |
| number | HEX格式颜色,支持rgb。示例:0xffffff。 | | number | HEX格式颜色,支持rgb。示例:0xffffff。 |
| string | rgb或者argb格式颜色。示例:'#ffffff', '#ff000000', 'rgb(255, 100, 255)', 'rgba(255, 100, 255, 0.5)'。 | | string | rgb或者argb格式颜色。示例:'#ffffff', '#ff000000', 'rgb(255, 100, 255)', 'rgba(255, 100, 255, 0.5)'。 |
| [Resource](#resource) | 使用引入资源的方式,引入系统资源或者应用资源中的颜色。 | | [Resource](#resource) | 使用引入资源的方式,引入系统资源或者应用资源中的颜色。 |
## ColoringStrategy ## ColoringStrategy
智能取色枚举类型,用于设置前景色。 智能取色枚举类型,用于设置前景色。
| 名称 | 描述 | | 名称 | 描述 |
| --------- | ------- | | ------ | --------------- |
| INVERT | 设置前景色为控件背景色的反色。| | INVERT | 设置前景色为控件背景色的反色。 |
## LengthConstrain ## LengthConstrain
长度约束,用于对组件最大、最小长度做限制。 长度约束,用于对组件最大、最小长度做限制。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| --------- | ------ | ---- | ------- | | --------- | ----------------- | ---- | ------- |
| minLength | [Length](#length) | 是 | 组件最小长度。 | | minLength | [Length](#length) | 是 | 组件最小长度。 |
| maxLength | [Length](#length) | 是 | 组件最大长度。 | | maxLength | [Length](#length) | 是 | 组件最大长度。 |
...@@ -148,12 +152,12 @@ ...@@ -148,12 +152,12 @@
设置文本样式。 设置文本样式。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | | ------ | ---------------------------------------- | ---- | ---------------------------------------- |
| size | [Length](#length) | 否 | 设置文本尺寸,Length为number类型时,使用fp单位。不支持设置百分比字符串。 | | size | [Length](#length) | 否 | 设置文本尺寸,Length为number类型时,使用fp单位。不支持设置百分比字符串。 |
| weight | [FontWeight](ts-appendix-enums.md#fontweight) \| number \| string | 否 | 设置文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。 | | weight | [FontWeight](ts-appendix-enums.md#fontweight) \| number \| string | 否 | 设置文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。 |
| family | string \| [Resource](#resource) | 否 | 设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial, sans-serif'。当前只支持'sans-serif'字体。 | | family | string \| [Resource](#resource) | 否 | 设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial, sans-serif'。当前只支持'sans-serif'字体。 |
| style | [FontStyle](ts-appendix-enums.md#fontstyle) | 否 | 设置文本的字体样式。 | | style | [FontStyle](ts-appendix-enums.md#fontstyle) | 否 | 设置文本的字体样式。 |
## Area<sup>8+</sup> ## Area<sup>8+</sup>
...@@ -170,8 +174,8 @@ ...@@ -170,8 +174,8 @@
位置类型,用于表示一个坐标点。 位置类型,用于表示一个坐标点。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ---- | ------ | ---- | --------------------------- | | ---- | ----------------- | ---- | --------------------------- |
| x | [Length](#length) | 否 | x轴坐标,作为返回值时,类型为number,单位vp。 | | x | [Length](#length) | 否 | x轴坐标,作为返回值时,类型为number,单位vp。 |
| y | [Length](#length) | 否 | y轴坐标,作为返回值时,类型为number,单位vp。 | | y | [Length](#length) | 否 | y轴坐标,作为返回值时,类型为number,单位vp。 |
...@@ -179,8 +183,8 @@ ...@@ -179,8 +183,8 @@
设置约束尺寸,组件布局时,进行尺寸范围限制。 设置约束尺寸,组件布局时,进行尺寸范围限制。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| --------- | ------ | ---- | ------- | | --------- | ----------------- | ---- | ------- |
| minWidth | [Length](#length) | 否 | 元素最小宽度。 | | minWidth | [Length](#length) | 否 | 元素最小宽度。 |
| maxWidth | [Length](#length) | 否 | 元素最大宽度。 | | maxWidth | [Length](#length) | 否 | 元素最大宽度。 |
| minHeight | [Length](#length) | 否 | 元素最小高度。 | | minHeight | [Length](#length) | 否 | 元素最小高度。 |
...@@ -190,8 +194,8 @@ ...@@ -190,8 +194,8 @@
设置宽高尺寸。 设置宽高尺寸。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ------ | ------ | ---- | ----- | | ------ | ----------------- | ---- | ----- |
| width | [Length](#length) | 否 | 元素宽度。 | | width | [Length](#length) | 否 | 元素宽度。 |
| height | [Length](#length) | 否 | 元素高度。 | | height | [Length](#length) | 否 | 元素高度。 |
...@@ -202,9 +206,9 @@ ...@@ -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> | 否 | 边框颜色。 | | 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> | 否 | 边框样式。 | | style | [BorderStyle](ts-appendix-enums.md#borderstyle) \| EdgeStyles<sup>9+</sup> | 否 | 边框样式。 |
## ColorFilter<sup>9+</sup> ## ColorFilter<sup>9+</sup>
...@@ -228,19 +232,19 @@ ...@@ -228,19 +232,19 @@
像素扩展属性集合,用于描述像素扩展的信息。 像素扩展属性集合,用于描述像素扩展的信息。
| 名称 | 类型 | 必填 | 说明 | | 名称 | 类型 | 必填 | 说明 |
| ----------- | ------ | ---- | ---------- | | ------ | ----------------- | ---- | -------------- |
| left | [Length](#length) | 否 | 组件图像左边沿扩展距离。 | | left | [Length](#length) | 否 | 组件图像左边沿扩展距离。 |
| right | [Length](#length) | 否 | 组件图像右边沿像素扩展距离。 | | right | [Length](#length) | 否 | 组件图像右边沿像素扩展距离。 |
| top | [Length](#length) | 否 | 组件图像上边沿像素扩展距离。 | | top | [Length](#length) | 否 | 组件图像上边沿像素扩展距离。 |
| bottom | [Length](#length) | 否 | 组件图像下边沿像素扩展距离。 | | bottom | [Length](#length) | 否 | 组件图像下边沿像素扩展距离。 |
## ModalTransition<sup>10+</sup> ## ModalTransition<sup>10+</sup>
全屏模态转场方式枚举类型,用于设置全屏模态转场类型。 全屏模态转场方式枚举类型,用于设置全屏模态转场类型。
| 名称 | 描述 | | 名称 | 描述 |
| --------- | ------- | | ------- | ------------ |
| None | 全屏模态无转场动画。 | | None | 全屏模态无转场动画。 |
| Default | 全屏模态上下切换动画。 | | Default | 全屏模态上下切换动画。 |
| Alpha | 全屏模态透明度渐变动画。 | | Alpha | 全屏模态透明度渐变动画。 |
\ No newline at end of file \ No newline at end of file
...@@ -156,6 +156,7 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true }) ...@@ -156,6 +156,7 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true })
## 场景示例 ## 场景示例
- 用于启动操作。 - 用于启动操作。
可以用按钮启动任何用户界面元素,按钮会根据用户的操作触发相应的事件。例如,在List容器里通过点击按钮进行页面跳转。 可以用按钮启动任何用户界面元素,按钮会根据用户的操作触发相应的事件。例如,在List容器里通过点击按钮进行页面跳转。
```ts ```ts
...@@ -195,6 +196,7 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true }) ...@@ -195,6 +196,7 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true })
- 用于表单的提交。 - 用于表单的提交。
在用户登录/注册页面,使用按钮进行登录或注册操作。 在用户登录/注册页面,使用按钮进行登录或注册操作。
```ts ```ts
...@@ -218,6 +220,7 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true }) ...@@ -218,6 +220,7 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true })
![zh-cn_image_0000001562940473](figures/zh-cn_image_0000001562940473.png) ![zh-cn_image_0000001562940473](figures/zh-cn_image_0000001562940473.png)
- 悬浮按钮 - 悬浮按钮
在可以滑动的界面,滑动时按钮始终保持悬浮状态。 在可以滑动的界面,滑动时按钮始终保持悬浮状态。
```ts ```ts
...@@ -258,4 +261,4 @@ Button('Ok', { type: ButtonType.Normal, stateEffect: true }) ...@@ -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.
先完成此消息的编辑!
想要评论请 注册