未验证 提交 2cfd196d 编写于 作者: O openharmony_ci 提交者: Gitee

!15597 【monthly】文档中标注ArkTS卡片所支持的API

Merge pull request !15597 from sunbees/monthly
......@@ -250,8 +250,8 @@ Stage模型下,在Ability的`onWindowStageCreate`生命周期中,可以通
在ArkTS页面中通过以下全局方法获取当前页面关联的Context。
| 接口名 | 描述 |
| :------------------------------------ | :--------------------------- |
| getContext(component: Object): Object | 获取页面中component所关联的Context对象。 |
| :------------------------------------ | :----------------------------------------------------------- |
| getContext(component: Object): Object | 获取页面中component所关联的Context对象。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
**示例**
......
......@@ -209,9 +209,10 @@ Curves.responsiveSpringMotion() // 创建一个默认弹性跟手动画曲线
interpolate(fraction:&nbsp;number): number
插值曲线的插值计算函数,可以通过传入的归一化时间参数返回当前的插值
从API version 9开始,该接口支持在ArkTS卡片中使用。
**系统能力:** SystemCapability.ArkUI.ArkUI.Full
**参数:**
......
......@@ -6,20 +6,21 @@
>
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
animation(value: {duration?: number, tempo?: number, curve?: string | Curve | ICurve, delay?:number, iterations: number, playMode?: PlayMode, onFinish?: () => void})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 名称 | 参数类型 | 必填 | 描述 |
| ---------- | ------------------------------------------| ---- | ------------------------------------------------------------ |
| duration | number | 否 | 设置动画时长。单位为毫秒,默认动画时长为1000毫秒。<br/>默认值:1000 |
| duration | number | 否 | 设置动画时长。单位为毫秒,默认动画时长为1000毫秒。<br/>默认值:1000<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>- 在ArkTS卡片上最大动画持续时间为1000毫秒,若超出则固定为1000毫秒。 |
| tempo | number | 否 | 动画播放速度。数值越大,动画播放速度越快,数值越小,播放速度越慢<br/>值为0时,表示不存在动画。<br/>默认值:1 |
| curve | string&nbsp;\|&nbsp;[Curve](ts-appendix-enums.md#curve)&nbsp;\|&nbsp;ICurve<sup>9+</sup> | 否 | 设置动画曲线。默认曲线为线性。<br/>默认值:Curve.Linear |
| curve | string&nbsp;\|&nbsp;[Curve](ts-appendix-enums.md#curve)&nbsp;\|&nbsp;ICurve<sup>9+</sup> | 否 | 设置动画曲线。默认曲线为线性。<br/>默认值:Curve.Linear<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| delay | number | 否 | 设置动画延迟执行的时长。单位为毫秒,默认不延时播放。<br/>默认值:0 |
| iterations | number | 否 | 设置播放次数。默认播放一次,设置为-1时表示无限次播放。<br/>默认值:1 |
| playMode | [PlayMode](ts-appendix-enums.md#playmode) | 否 | 设置动画播放模式,默认播放完成后重头开始播放。<br/>默认值:PlayMode.Normal |
| onFinish | () => void | 否 | 状态回调,动画播放完成时触发。 |
| playMode | [PlayMode](ts-appendix-enums.md#playmode) | 否 | 设置动画播放模式,默认播放完成后重头开始播放。<br/>默认值:PlayMode.Normal<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onFinish | () => void | 否 | 状态回调,动画播放完成时触发。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -2,6 +2,8 @@
## Color
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 颜色名称 | 颜色值 | 颜色示意 |
| ------------------------ | -------- | ------------------------------------------------------------ |
| Black | 0x000000 | ![zh-cn_image_0000001219864153](figures/zh-cn_image_0000001219864153.png) |
......@@ -19,6 +21,8 @@
## ImageFit
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| --------- | ------------------------------------------------------------ |
| Contain | 保持宽高比进行缩小或者放大,使得图片完全显示在显示边界内。 |
......@@ -30,6 +34,8 @@
## BorderStyle
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | ----------------------------------------------- |
| Dotted | 显示为一系列圆点,圆点半径为borderWidth的一半。 |
......@@ -38,6 +44,8 @@
## LineJoinStyle
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ----- | -------------------- |
| Bevel | 使用斜角连接路径段。 |
......@@ -46,6 +54,8 @@
## TouchType
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | ------------------------------ |
| Down | 手指按下时触发。 |
......@@ -55,6 +65,8 @@
## MouseButton
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------- | ---------------- |
| Left | 鼠标左键。 |
......@@ -66,6 +78,8 @@
## MouseAction
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------- | -------------- |
| Press | 鼠标按键按下。 |
......@@ -75,6 +89,8 @@
## Curve
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------------------- | ------------------------------------------------------------ |
| Linear | 表示动画从头到尾的速度都是相同的。 |
......@@ -93,6 +109,8 @@
## AnimationStatus
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------- | ------------------ |
| Initial | 动画初始状态。 |
......@@ -102,6 +120,8 @@
## FillMode
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| --------- | ------------------------------------------------------------ |
| None | 动画未执行时不会将任何样式应用于目标,动画播放完成之后恢复初始默认状态。 |
......@@ -111,6 +131,8 @@
## PlayMode
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ---------------- | ------------------------------------------------------------ |
| Normal | 动画按正常播放。 |
......@@ -120,6 +142,8 @@
## KeyType
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ---- | ---------- |
| Down | 按键按下。 |
......@@ -127,6 +151,8 @@
## KeySource
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| -------- | -------------------- |
| Unknown | 输入设备类型未知。 |
......@@ -136,16 +162,18 @@
| 名称 | 描述 |
| -------- | ---------------------- |
| Top | 竖直方向上边缘 |
| Top | 竖直方向上边缘<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| Center<sup>(deprecated) </sup> | 竖直方向居中位置<br/> 从API version 9开始废弃 |
| Bottom | 竖直方向下边缘 |
| Bottom | 竖直方向下边缘<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| Baseline<sup>(deprecated) </sup> | 交叉轴方向文本基线位置<br/> 从API version 9开始废弃 |
| Start | 水平方向起始位置 |
| Start | 水平方向起始位置<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| Middle<sup>(deprecated) </sup> | 水平方向居中位置<br/> 从API version 9开始废弃 |
| End | 水平方向末尾位置 |
| End | 水平方向末尾位置<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## Week
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| -------- | ---------------------- |
| Mon | 星期一 |
......@@ -158,6 +186,8 @@
## Direction
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ---- | ---------------------- |
| Ltr | 元素从左到右布局。 |
......@@ -166,6 +196,8 @@
## BarState
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ---- | -------------------------------- |
| Off | 不显示。 |
......@@ -174,6 +206,8 @@
## EdgeEffect
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | ------------------------------------------------------------ |
| Spring | 弹性物理动效,滑动到边缘后可以根据初始速度或通过触摸事件继续滑动一段距离,松手后回弹。 |
......@@ -182,6 +216,8 @@
## Alignment
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ----------- | ---------------- |
| TopStart | 顶部起始端。 |
......@@ -196,6 +232,8 @@
## TransitionType
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | -------------------------------------------------- |
| All | 指定当前的Transition动效生效在组件的所有变化场景。 |
......@@ -204,6 +242,8 @@
## RelateType
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | ------------------------------- |
| FILL | 缩放当前子组件以填充满父组件 |
......@@ -211,6 +251,8 @@
## Visibility
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------- | -------------------------------- |
| Hidden | 隐藏,但参与布局进行占位。 |
......@@ -219,6 +261,8 @@
## LineCapStyle
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | -------------------- |
| Butt | 线条两端为平行线,不额外扩展。 |
......@@ -227,6 +271,8 @@
## Axis
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ---------- | ------------ |
| Vertical | 方向为纵向。 |
......@@ -234,6 +280,8 @@
## HorizontalAlign
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | ------------------------ |
| Start | 按照语言方向起始端对齐。 |
......@@ -242,6 +290,8 @@
## FlexAlign
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------------ | ------------------------------------------------------------ |
| Start | 元素在主轴方向首端对齐,第一个元素与行首对齐,同时后续的元素与前一个对齐。 |
......@@ -253,6 +303,8 @@
## ItemAlign
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| -------- | ------------------------------------------------------------ |
| Auto | 使用Flex容器中默认配置。 |
......@@ -264,6 +316,8 @@
## FlexDirection
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------------- | ------------------------------ |
| Row | 主轴与行方向一致作为布局模式。 |
......@@ -273,6 +327,8 @@
## FlexWrap
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ----------- | ------------------------------------------------- |
| NoWrap | Flex容器的元素单行/列布局,子项不允许超出容器。 |
......@@ -281,6 +337,8 @@
## VerticalAlign
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | ------------------------ |
| Top | 顶部对齐。 |
......@@ -289,6 +347,8 @@
## ImageRepeat
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| -------- | -------------------------- |
| X | 只在水平轴上重复绘制图片。 |
......@@ -298,6 +358,8 @@
## ImageSize
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 类型 | 描述 |
| ------- | ------------------------------------------------------------ |
| Cover | 默认值,保持宽高比进行缩小或者放大,使得图片两边都大于或等于显示边界。 |
......@@ -306,6 +368,8 @@
## GradientDirection
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ----------- | ---------- |
| Left | 从右向左。 |
......@@ -320,6 +384,8 @@
## SharedTransitionEffectType
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ----------- | ---------- |
| Static | 目标页面元素的位置保持不变,可以配置透明度动画。目前,只有为重定向到目标页面而配置的静态效果才会生效。 |
......@@ -327,6 +393,8 @@
## FontStyle
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | ---------------- |
| Normal | 标准的字体样式。 |
......@@ -334,6 +402,8 @@
## FontWeight
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------- | -------------- |
| Lighter | 字体较细。 |
......@@ -345,6 +415,8 @@
## TextAlign
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | -------------- |
| Start | 水平对齐首部。 |
......@@ -353,6 +425,8 @@
## TextOverflow
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| -------- | -------------------------------------- |
| Clip | 文本超长时进行裁剪显示。 |
......@@ -361,6 +435,8 @@
## TextDecorationType
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ----------- | ------------------ |
| Underline | 文字下划线修饰。 |
......@@ -370,6 +446,8 @@
## TextCase
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| --------- | -------------------- |
| Normal | 保持文本原有大小写。 |
......@@ -378,6 +456,8 @@
## ResponseType<sup>8+</sup>
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ---------- | -------------------------- |
| LongPress | 通过长按触发菜单弹出。 |
......@@ -385,6 +465,8 @@
## HoverEffect<sup>8+</sup>
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| --------- | ---------------------------- |
| Auto | 使用组件的系统默认悬浮效果。 |
......@@ -394,6 +476,8 @@
## Placement<sup>8+</sup>
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------------- | ------------------------------------------------------------ |
| Left | 气泡提示位于组件左侧,与组件左侧中心对齐。 |
......@@ -411,6 +495,8 @@
## CopyOptions<sup>9+</sup>
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ----------- | -------------------- |
| None | 不支持复制。 |
......@@ -419,6 +505,8 @@
## HitTestMode<sup>9+</sup>
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ----------- | -------------------- |
| Default | 自身节点和子节点都响应触摸事件的命中测试,但会阻止被该节点屏蔽的其他节点的命中测试。 |
......
......@@ -16,6 +16,8 @@
Blank(min?: number&nbsp;|&nbsp;string)
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
......@@ -28,7 +30,7 @@ Blank(min?: number&nbsp;|&nbsp;string)
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置空白填充的填充颜色。 |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置空白填充的填充颜色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -16,6 +16,8 @@
**方法1:** Button(options?: {type?: ButtonType, stateEffect?: boolean})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
......@@ -28,6 +30,8 @@
使用文本内容创建相应的按钮组件,此时Button无法包含子组件。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
......@@ -40,10 +44,13 @@
| 名称 | 参数类型 | 描述 |
| ----------- | ----------- | --------------------------------- |
| type | ButtonType | 设置Button样式。<br/>默认值:ButtonType.Capsule |
| stateEffect | boolean | 按钮按下时是否开启按压态显示效果,当设置为false时,按压效果关闭。<br/>默认值:true |
| type | ButtonType | 设置Button样式。<br/>默认值:ButtonType.Capsule<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| stateEffect | boolean | 按钮按下时是否开启按压态显示效果,当设置为false时,按压效果关闭。<br/>默认值:true<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## ButtonType枚举说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------- | ------------------ |
| Capsule | 胶囊型按钮(圆角默认为高度的一半)。 |
......
......@@ -14,6 +14,8 @@
Checkbox(options?:&nbsp;{name?: string, group?: string })
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
......@@ -28,16 +30,16 @@ Checkbox(options?:&nbsp;{name?: string, group?: string })
| 名称 | 参数类型 | 描述 |
| ------------- | ------- | -------- |
| select | boolean | 设置多选框是否选中。<br/>默认值:false |
| selectedColor | [ResourceColor](ts-types.md#resourcecolor) | 设置多选框选中状态颜色。 |
| select | boolean | 设置多选框是否选中。<br/>默认值:false<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| selectedColor | [ResourceColor](ts-types.md#resourcecolor) | 设置多选框选中状态颜色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 事件
支持[通用事件](ts-universal-events-click.md)外,还支持以下事件:
| 名称 | 功能描述 |
| ----------| -------- |
|onChange(callback: (value: boolean) => void) | 当选中状态发生变化时,触发该回调。(只有手动触发且Checkbox状态改变时才会触发onChange回调)<br>- value为true时,表示已选中。<br>- value为false时,表示未选中。 |
| -------------------------------------------- | ------------------------------------------------------------ |
| onChange(callback: (value: boolean) => void) | 当选中状态发生变化时,触发该回调。(只有手动触发且Checkbox状态改变时才会触发onChange回调)<br>- value为true时,表示已选中。<br>- value为false时,表示未选中。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -16,9 +16,9 @@ CheckboxGroup(options?: { group?: string })
创建多选框群组,可以控制群组内的Checkbox全选或者不全选,group值相同的Checkbox和CheckboxGroup为同一群组。
**参数:**
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- |
......@@ -30,8 +30,8 @@ CheckboxGroup(options?: { group?: string })
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| selectAll | boolean | 设置是否全选。<br/>默认值:false,若同组的Checkbox显式设置select,则Checkbox的优先级高。 |
| selectedColor | [ResourceColor](ts-types.md#resourcecolor) | 设置被选中或部分选中状态的颜色。 |
| selectAll | boolean | 设置是否全选。<br/>默认值:false,若同组的Checkbox显式设置select,则Checkbox的优先级高。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| selectedColor | [ResourceColor](ts-types.md#resourcecolor) | 设置被选中或部分选中状态的颜色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 事件
......@@ -39,9 +39,12 @@ CheckboxGroup(options?: { group?: string })
| 名称 | 功能描述 |
| -------- | -------- |
| onChange (callback: (event: [CheckboxGroupResult](#checkboxgroupresult对象说明)) => void ) |CheckboxGroup的选中状态或群组内的Checkbox的选中状态发生变化时,触发回调。(只有手动触发且Checkbox或CheckboxGroup状态改变时才会触发onChange回调)|
| onChange (callback: (event: [CheckboxGroupResult](#checkboxgroupresult对象说明)) => void ) |CheckboxGroup的选中状态或群组内的Checkbox的选中状态发生变化时,触发回调。(只有手动触发且Checkbox或CheckboxGroup状态改变时才会触发onChange回调)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。|
## CheckboxGroupResult对象说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 类型 | 描述 |
| ------ | ------ | ------- |
| name | Array&lt;string&gt; | 群组内所有被选中的多选框名称。 |
......@@ -49,6 +52,8 @@ CheckboxGroup(options?: { group?: string })
## SelectStatus枚举说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ----- | -------------------- |
| All | 群组多选择框全部选择。 |
......
......@@ -18,6 +18,8 @@
DataPanel(options:{values: number[], max?: number, type?: DataPanelType})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
......@@ -26,8 +28,10 @@ DataPanel(options:{values: number[], max?: number, type?: DataPanelType})
| max | number | 否 | -&nbsp;max大于0,表示数据的最大值。<br/>-&nbsp;max小于等于0,max等于value数组各项的和,按比例显示。<br/>默认值:100 |
| type<sup>8+</sup> | [DataPanelType](#datapaneltype枚举说明) | 否 | 数据面板的类型(不支持动态修改)。<br/>默认值:DataPanelType.Circle |
## DataPanelType枚举说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| -------| ------------ |
| Line | 线型数据面板。 |
......
......@@ -16,16 +16,18 @@
Divider()
从API version 9开始,该接口支持在ArkTS卡片中使用。
## 属性
除支持[通用属性](ts-universal-attributes-size.md)外,还支持以下属性:
| 名称 | 参数类型 | 描述 |
| ----------- | ---------- | ------------------ |
| vertical | boolean | 使用水平分割线还是垂直分割线。false:水平分割线;true:垂直分割线。<br/>默认值:false |
| color | [ResourceColor](ts-types.md#resourcecolor) | 分割线颜色。 |
| strokeWidth | number&nbsp;\|&nbsp;string | 分割线宽度。<br/>默认值:1 |
| lineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | 分割线的端点样式。<br/>默认值:LineCapStyle.Butt |
| vertical | boolean | 使用水平分割线还是垂直分割线。false:水平分割线;true:垂直分割线。<br/>默认值:false<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| color | [ResourceColor](ts-types.md#resourcecolor) | 分割线颜色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeWidth | number&nbsp;\|&nbsp;string | 分割线宽度。<br/>默认值:1<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| lineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | 分割线的端点样式。<br/>默认值:LineCapStyle.Butt<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 事件
......
......@@ -17,6 +17,8 @@
Gauge(options:{value: number, min?: number, max?: number})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
......@@ -31,16 +33,18 @@ Gauge(options:{value: number, min?: number, max?: number})
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| value | number | 设置量规图的数据值,可用于动态修改量规图的数据值。<br/>默认值:0 |
| startAngle | number | 设置起始角度位置,时钟0点为0度,顺时针方向为正角度。<br/>默认值:0 |
| endAngle | number | 设置终止角度位置,时钟0点为0度,顺时针方向为正角度。<br/>默认值:360 |
| colors | Array&lt;[ColorStop](#colorstop)&gt; | 设置量规图的颜色,支持分段颜色设置。 |
| strokeWidth | Length | 设置环形量规图的环形厚度。 |
| value | number | 设置量规图的数据值,可用于动态修改量规图的数据值。<br/>默认值:0<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| startAngle | number | 设置起始角度位置,时钟0点为0度,顺时针方向为正角度。<br/>默认值:0<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| endAngle | number | 设置终止角度位置,时钟0点为0度,顺时针方向为正角度。<br/>默认值:360<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| colors | Array&lt;[ColorStop](#colorstop)&gt; | 设置量规图的颜色,支持分段颜色设置。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeWidth | Length | 设置环形量规图的环形厚度。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## ColorStop
颜色断点类型,用于描述渐进色颜色断点。
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 类型定义 | 描述 |
| --------- | -------------------- | ------------------------------------------------------------ |
| ColorStop | [[ResourceColor](ts-types.md#resourcecolor),&nbsp;number] | 描述渐进色颜色断点类型,第一个参数为颜色值,若设置为非颜色类型,则置为黑色。第二个参数为颜色所占比重,若设置为负数或是非数值类型,则将比重置为0,该颜色不显示。 |
......
......@@ -23,11 +23,13 @@ Image(src: string | PixelMap | Resource)
通过图片数据源获取图片,用于后续渲染展示。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ |
| src | string\|&nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 是 | 图片的数据源,支持本地图片和网络图片。<br/>当使用相对路径引用图片资源时,例如`Image("common/test.jpg")`,不支持跨包/跨模块调用该Image组件,建议使用`$r`方式来管理需全局使用的图片资源。<br/>\- 支持的图片格式包括png、jpg、bmp、svg和gif。<br/>\- 支持`Base64`字符串。格式`data:image/[png\|jpeg\|bmp\|webp];base64,[base64 data]`, 其中`[base64 data]``Base64`字符串数据。<br/>\- 支持`datashare://`路径前缀的字符串,用于访问通过data&nbsp;ability提供的图片路径。图片加载前需要申请[媒体库功能相关权限](../../file-management/medialibrary-overview.md#申请媒体库功能相关权限)<br/>\- 支持file:///data/storage路径前缀的字符串,用于读取本应用安装目录下files文件夹下的图片资源。需要保证目录包路径下的文件有可读权限。 |
| src | string\|&nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 是 | 图片的数据源,支持本地图片和网络图片。<br/>当使用相对路径引用图片资源时,例如`Image("common/test.jpg")`,不支持跨包/跨模块调用该Image组件,建议使用`$r`方式来管理需全局使用的图片资源。<br/>\- 支持的图片格式包括png、jpg、bmp、svg和gif。<br/>\- 支持`Base64`字符串。格式`data:image/[png\|jpeg\|bmp\|webp];base64,[base64 data]`, 其中`[base64 data]``Base64`字符串数据。<br/>\- 支持`datashare://`路径前缀的字符串,用于访问通过data&nbsp;ability提供的图片路径。图片加载前需要申请[媒体库功能相关权限](../../file-management/medialibrary-overview.md#申请媒体库功能相关权限)<br/>\- 支持file:///data/storage路径前缀的字符串,用于读取本应用安装目录下files文件夹下的图片资源。需要保证目录包路径下的文件有可读权限。<br/>**说明:**<br/>- ArkTS卡片上支持gif图片格式动效,但仅在显示时播放一次。<br/>- ArkTS卡片上不支持`http://`等网络相关路径前缀、`datashare://`路径前缀以及`file://data/storage`路径前缀的字符串<br/>- ArkTS卡片上不支持&nbsp;[PixelMap](../apis/js-apis-image.md#pixelmap7)类型 |
## 属性
......@@ -35,19 +37,19 @@ Image(src: string | PixelMap | Resource)
| 名称 | 参数类型 | 描述 |
| --------------------- | ------------------------------------------------------- | ------------------------------------------------------------ |
| alt | string \| [Resource](ts-types.md#resource类型) | 加载时显示的占位图,支持本地图片。 |
| objectFit | [ImageFit](ts-appendix-enums.md#imagefit) | 设置图片的缩放类型。<br/>默认值:ImageFit.Cover |
| objectRepeat | [ImageRepeat](ts-appendix-enums.md#imagerepeat) | 设置图片的重复样式。<br/>默认值:ImageRepeat.NoRepeat<br/>**说明:**<br/>svg类型图源不支持该属性。 |
| interpolation | [ImageInterpolation](#imageinterpolation) | 设置图片的插值效果,即减轻低清晰度图片在放大显示的时候出现的锯齿问题,仅针对图片放大插值。<br/>默认值:ImageInterpolation.None<br/>**说明:**<br/>svg类型图源不支持该属性。<br/>PixelMap资源不支持该属性。 |
| renderMode | [ImageRenderMode](#imagerendermode) | 设置图片渲染的模式。<br/>默认值:ImageRenderMode.Original<br/>**说明:**<br/>svg类型图源不支持该属性。 |
| sourceSize | {<br/>width:&nbsp;number,<br/>height:&nbsp;number<br/>} | 设置图片裁剪尺寸,将原始图片解码成pixelMap,指定尺寸的图片,单位为px。<br/>**说明:**<br/>PixelMap资源和SVG图片不支持该属性。 |
| matchTextDirection | boolean | 设置图片是否跟随系统语言方向,在RTL语言环境下显示镜像翻转显示效果。<br/>默认值:false |
| fitOriginalSize | boolean | 图片组件尺寸未设置时,其显示尺寸是否跟随图源尺寸。<br/>默认值:false |
| fillColor | [ResourceColor](ts-types.md#resourcecolor) | 填充颜色。设置的填充颜色会覆盖在图片上。仅对svg图源生效,设置后会替换svg图片的fill颜色。 |
| autoResize | boolean | 是否需要在图片解码过程中对图源做resize操作,该操作会根据显示区域的尺寸决定用于绘制的图源尺寸,有利于减少内存占用。<br/>默认值:true |
| syncLoad<sup>8+</sup> | boolean | 设置是否同步加载图片,默认是异步加载。同步加载时阻塞UI线程,不会显示占位图。<br/>默认值:false |
| copyOption<sup>9+</sup> | [CopyOptions](ts-appendix-enums.md#copyoptions9) | 设置图片是否可复制(SVG图片不支持复制)。<br/>当copyOption设置为非CopyOptions.None时,支持使用长按、鼠标右击、快捷组合键'CTRL+C'等方式进行复制。<br/>默认值:CopyOptions.None |
| colorFilter<sup>9+</sup> | [ColorFilter](ts-types.md#colorfilter9) | 给图像设置颜色滤镜效果。 |
| alt | string \| [Resource](ts-types.md#resource类型) | 加载时显示的占位图,支持本地图片。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| objectFit | [ImageFit](ts-appendix-enums.md#imagefit) | 设置图片的缩放类型。<br/>默认值:ImageFit.Cover<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| objectRepeat | [ImageRepeat](ts-appendix-enums.md#imagerepeat) | 设置图片的重复样式。<br/>默认值:ImageRepeat.NoRepeat<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>svg类型图源不支持该属性。 |
| interpolation | [ImageInterpolation](#imageinterpolation) | 设置图片的插值效果,即减轻低清晰度图片在放大显示的时候出现的锯齿问题,仅针对图片放大插值。<br/>默认值:ImageInterpolation.None<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>svg类型图源不支持该属性。<br/>PixelMap资源不支持该属性。 |
| renderMode | [ImageRenderMode](#imagerendermode) | 设置图片渲染的模式。<br/>默认值:ImageRenderMode.Original<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>svg类型图源不支持该属性。 |
| sourceSize | {<br/>width:&nbsp;number,<br/>height:&nbsp;number<br/>} | 设置图片裁剪尺寸,将原始图片解码成pixelMap,指定尺寸的图片,单位为px。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>PixelMap资源和SVG图片不支持该属性。 |
| matchTextDirection | boolean | 设置图片是否跟随系统语言方向,在RTL语言环境下显示镜像翻转显示效果。<br/>默认值:false<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| fitOriginalSize | boolean | 图片组件尺寸未设置时,其显示尺寸是否跟随图源尺寸。<br/>默认值:false<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| fillColor | [ResourceColor](ts-types.md#resourcecolor) | 填充颜色。设置的填充颜色会覆盖在图片上。仅对svg图源生效,设置后会替换svg图片的fill颜色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| autoResize | boolean | 是否需要在图片解码过程中对图源做resize操作,该操作会根据显示区域的尺寸决定用于绘制的图源尺寸,有利于减少内存占用。<br/>默认值:true<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| syncLoad<sup>8+</sup> | boolean | 设置是否同步加载图片,默认是异步加载。同步加载时阻塞UI线程,不会显示占位图。<br/>默认值:false<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| copyOption<sup>9+</sup> | [CopyOptions](ts-appendix-enums.md#copyoptions9) | 设置图片是否可复制(SVG图片不支持复制)。<br/>当copyOption设置为非CopyOptions.None时,支持使用长按、鼠标右击、快捷组合键'CTRL+C'等方式进行复制。<br/>默认值:CopyOptions.None<br/>该接口支持在ArkTS卡片中使用。 |
| colorFilter<sup>9+</sup> | [ColorFilter](ts-types.md#colorfilter9) | 给图像设置颜色滤镜效果。<br/>该接口支持在ArkTS卡片中使用。 |
> **说明:**
>
......@@ -56,6 +58,8 @@ Image(src: string | PixelMap | Resource)
### ImageInterpolation
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | ------------------------- |
| None | 不使用插值图片数据。 |
......@@ -65,6 +69,8 @@ Image(src: string | PixelMap | Resource)
### ImageRenderMode
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| -------- | --------------------- |
| Original | 按照原图进行渲染,包括颜色。 |
......@@ -76,9 +82,9 @@ Image(src: string | PixelMap | Resource)
| 名称 | 功能描述 |
| ------------------------------------------------------------ | ------------------------------------------------------------ |
| onComplete(callback:&nbsp;(event?:&nbsp;{&nbsp;width:&nbsp;number,&nbsp;height:&nbsp;number,&nbsp;componentWidth:&nbsp;number,<br>&nbsp;componentHeight:&nbsp;number,&nbsp;loadingStatus:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 图片成功加载时触发该回调,返回成功加载的图片尺寸。<br>- width:图片的宽,单位为像素。<br/>- height:图片的高,单位为像素。<br/>- componentWidth:组件的宽,单位为像素。<br/>- componentHeight:组件的高,单位为像素。<br/>- loadingStatus:图片加载成功的状态。<br/> |
| onError(callback:&nbsp;(event?:&nbsp;{&nbsp;componentWidth:&nbsp;number,&nbsp;componentHeight:&nbsp;number&nbsp;, message<sup>9+</sup>: string })&nbsp;=&gt;&nbsp;void) | 图片加载出现异常时触发该回调。<br>- componentWidth:组件的宽,单位为像素。<br/>- componentHeight:组件的高,单位为像素。 |
| onFinish(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 当加载的源文件为带动效的svg图片时,当svg动效播放完成时会触发这个回调,如果动效为无限循环动效,则不会触发这个回调。 |
| onComplete(callback:&nbsp;(event?:&nbsp;{&nbsp;width:&nbsp;number,&nbsp;height:&nbsp;number,&nbsp;componentWidth:&nbsp;number,<br>&nbsp;componentHeight:&nbsp;number,&nbsp;loadingStatus:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 图片成功加载时触发该回调,返回成功加载的图片尺寸。<br>- width:图片的宽,单位为像素。<br/>- height:图片的高,单位为像素。<br/>- componentWidth:组件的宽,单位为像素。<br/>- componentHeight:组件的高,单位为像素。<br/>- loadingStatus:图片加载成功的状态。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onError(callback:&nbsp;(event?:&nbsp;{&nbsp;componentWidth:&nbsp;number,&nbsp;componentHeight:&nbsp;number&nbsp;, message<sup>9+</sup>: string })&nbsp;=&gt;&nbsp;void) | 图片加载出现异常时触发该回调。<br>- componentWidth:组件的宽,单位为像素。<br/>- componentHeight:组件的高,单位为像素。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onFinish(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 当加载的源文件为带动效的svg图片时,当svg动效播放完成时会触发这个回调,如果动效为无限循环动效,则不会触发这个回调。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -18,11 +18,13 @@ LoadingProgress()
创建加载进展组件。
从API version 9开始,该接口支持在ArkTS卡片中使用。
## 属性
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置加载进度条前景色。 |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置加载进度条前景色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -17,29 +17,31 @@
Marquee(value: { start: boolean, step?: number, loop?: number, fromStart?: boolean, src: string })
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- |
| start | boolean | 是 | 控制跑马灯是否进入播放状态。 |
| step | number | 否 | 滚动动画文本滚动步长。<br/>默认值:6,单位vp |
| loop | number | 否 | 设置重复滚动的次数,小于等于零时无限循环。<br/>默认值:-1 |
| loop | number | 否 | 设置重复滚动的次数,小于等于零时无限循环。<br/>默认值:-1<br/>**说明:**<br/>ArkTS卡片上该参数设置任意值都仅在可见时滚动一次。 |
| fromStart | boolean | 否 | 设置文本从头开始滚动或反向滚动。<br/>默认值:true |
| src | string | 是 | 需要滚动的文本。 |
## 属性
| 名称 | 参数类型 | 描述 |
| ---------- | -------- | ------------------------------------ |
| allowScale | boolean | 是否允许文本缩放。<br/>默认值:false |
| ---------- | -------- | ------------------------------------------------------------ |
| allowScale | boolean | 是否允许文本缩放。<br/>默认值:false<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 事件
| 名称 | 功能描述 |
| -------- | -------- |
| onStart(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 开始滚动时触发回调。 |
| onBounce(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 完成一次滚动时触发,若循环次数不为1,则该事件会多次触发。 |
| onFinish(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 滚动全部循环次数完成时触发回调。 |
| onStart(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 开始滚动时触发回调。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onBounce(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 完成一次滚动时触发,若循环次数不为1,则该事件会多次触发。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onFinish(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 滚动全部循环次数完成时触发回调。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -18,17 +18,21 @@ Progress(options: {value: number, total?: number, type?: ProgressType})
创建进度组件,用于显示内容加载或操作处理进度。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
| -------- | -------- | -------- | -------- |
| value | number | 是 | 指定当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为total。 |
| total | number | 否 | 指定进度总长。<br/>默认值:100 |
| type<sup>8+</sup> | [ProgressType](#progresstype枚举说明) | 否 | 指定进度条类型。<br/>默认值:ProgressType.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开始,高度大于宽度的时候自适应垂直显示。 |
......@@ -39,6 +43,8 @@ Progress(options: {value: number, total?: number, type?: ProgressType})
## ProgressStyle枚举说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| --------- | ------------------------------------------------------------ |
| Linear | 线性样式。 |
......@@ -51,10 +57,10 @@ Progress(options: {value: number, total?: number, type?: ProgressType})
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| value | number | 设置当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为total。非法数值不生效。 |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置进度条前景色。 |
| backgroundColor | [ResourceColor](ts-types.md#resourcecolor) | 设置进度条底色。 |
| 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 |
| value | number | 设置当前进度值。设置小于0的数值时置为0,设置大于total的数值时置为total。非法数值不生效。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| color | [ResourceColor](ts-types.md#resourcecolor) | 设置进度条前景色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundColor | [ResourceColor](ts-types.md#resourcecolor) | 设置进度条底色。<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卡片中使用。 |
## 示例
......
......@@ -14,6 +14,8 @@
Canvas(context?: CanvasRenderingContext2D)
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
......@@ -30,7 +32,7 @@ Canvas(context?: CanvasRenderingContext2D)
| 名称 | 参数 | 描述 |
| ----------------------------- | ---- | -------------------- |
| onReady(event: () => void) | 无 | Canvas组件初始化完成时的事件回调,该事件之后Canvas组件宽高确定且可获取,可使用Canvas相关API进行绘制。 |
| onReady(event: () => void) | 无 | Canvas组件初始化完成时的事件回调,该事件之后Canvas组件宽高确定且可获取,可使用Canvas相关API进行绘制。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
**示例:**
......
......@@ -14,6 +14,8 @@ addColorStop(offset: number, color: string): void
设置渐变断点值,包括偏移和颜色。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
......
......@@ -6,14 +6,26 @@ ImageBitmap对象可以存储canvas渲染的像素数据。
>
> 从 API Version 8 开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 接口
ImageBitmap(src: string)
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ------ | -------- | ---- | ------ | ------------------------------------------------------------ |
| src | string | 是 | - | 图片的数据源<br/>**说明:**<br/>- ArkTS卡片上不支持`http://`等网络相关路径前缀、`datashare://`路径前缀以及`file://data/storage`路径前缀的字符串 |
## 属性
| 属性 | 类型 | 描述 |
| -------- | -------- | -------- |
| width | number | ImageBitmap的像素宽度。 |
| height | number | ImageBitmap的像素高度。 |
| width | number | ImageBitmap的像素宽度。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| height | number | ImageBitmap的像素高度。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
**示例:**
......@@ -54,3 +66,5 @@ ImageBitmap对象可以存储canvas渲染的像素数据。
close()
释放ImageBitmap对象相关联的所有图形资源。该接口为空接口。
从API version 9开始,该接口支持在ArkTS卡片中使用。
\ No newline at end of file
......@@ -12,9 +12,9 @@ ImageData对象可以存储canvas渲染的像素数据。
| 属性 | 类型 | 描述 |
| -------- | -------- | -------- |
| width | number | 矩形区域实际像素宽度,单位为px。 |
| height | number | 矩形区域实际像素高度,单位为px。 |
| data | Uint8ClampedArray | 一维数组,保存了相应的颜色数据,数据值范围为0到255。 |
| width | number | 矩形区域实际像素宽度,单位为px。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| height | number | 矩形区域实际像素高度,单位为px。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| data | Uint8ClampedArray | 一维数组,保存了相应的颜色数据,数据值范围为0到255。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
> **说明:**
>
......
......@@ -14,6 +14,8 @@ addPath(path: path2D, transform?:Matrix2D): void
将另一个路径添加到当前的路径对象中。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数 | 类型 | 必填 | 默认值 | 描述 |
......@@ -61,6 +63,8 @@ closePath(): void
将路径的当前点移回到路径的起点,当前点到起点间画一条直线。如果形状已经闭合或只有一个点,则此功能不执行任何操作。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**示例:**
```ts
......@@ -101,6 +105,8 @@ moveTo(x: number, y: number): void
将路径的当前坐标点移动到目标点,移动过程中不绘制线条。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数 | 类型 | 必填 | 默认值 | 描述 |
......@@ -148,6 +154,8 @@ lineTo(x: number, y: number): void
从当前点绘制一条直线到目标点。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数 | 类型 | 必填 | 默认值 | 描述 |
......@@ -196,6 +204,8 @@ bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number,
创建三次贝赛尔曲线的路径。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数 | 类型 | 必填 | 默认值 | 描述 |
......@@ -245,6 +255,8 @@ quadraticCurveTo(cpx: number, cpy: number, x: number ,y: number): void
创建二次贝赛尔曲线的路径。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数 | 类型 | 必填 | 默认值 | 描述 |
......@@ -292,6 +304,8 @@ arc(x: number, y: number, radius: number, startAngle: number, endAngle: number,
绘制弧线路径。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数 | 类型 | 必填 | 默认值 | 描述 |
......@@ -340,6 +354,8 @@ arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void
依据圆弧经过的点和圆弧半径创建圆弧路径。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数 | 类型 | 必填 | 默认值 | 描述 |
......@@ -387,6 +403,8 @@ ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number
在规定的矩形区域绘制一个椭圆。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数 | 类型 | 必填 | 默认值 | 描述 |
......@@ -437,6 +455,8 @@ rect(x: number, y: number, w: number, h: number): void
创建矩形路径。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数 | 类型 | 必填 | 默认值 | 描述 |
......
......@@ -18,6 +18,8 @@
创建数字标记组件。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------- | -------- | -------- | -------- | -------- |
......@@ -30,6 +32,8 @@
根据字符串创建标记组件。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
......@@ -40,6 +44,8 @@
## BadgePosition枚举说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| -------- | -------- |
| RightTop | 圆点显示在右上角。 |
......@@ -48,6 +54,8 @@
## BadgeStyle对象说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 类型 | 必填 | 默认值 | 描述 |
| ---------- | ------------------------------------------ | ---- | ----------- | ------------------------------------------- |
| color | [ResourceColor](ts-types.md#resourcecolor) | 否 | Color.White | 文本颜色。 |
......
......@@ -16,6 +16,8 @@
Column(value?:&nbsp;{space?: string&nbsp;|&nbsp;number})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
......@@ -28,8 +30,8 @@ Column(value?:&nbsp;{space?: string&nbsp;|&nbsp;number})
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| alignItems | [HorizontalAlign](ts-appendix-enums.md#horizontalalign) | 设置子组件在水平方向上的对齐格式。<br/>默认值:HorizontalAlign.Center |
| justifyContent<sup>8+</sup> | [FlexAlign](ts-appendix-enums.md#flexalign) | 设置子组件在垂直方向上的对齐格式。<br/>默认值:FlexAlign.Start |
| alignItems | [HorizontalAlign](ts-appendix-enums.md#horizontalalign) | 设置子组件在水平方向上的对齐格式。<br/>默认值:HorizontalAlign.Center<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| justifyContent<sup>8+</sup> | [FlexAlign](ts-appendix-enums.md#flexalign) | 设置子组件在垂直方向上的对齐格式。<br/>默认值:FlexAlign.Start<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -16,6 +16,8 @@
Counter()
从API version 9开始,该接口支持在ArkTS卡片中使用。
## 事件
......@@ -23,8 +25,8 @@ Counter()
| 名称 | 功能描述 |
| -------- | -------- |
| onInc(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值增加事件。 |
| onDec(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值减少事件。 |
| onInc(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值增加事件。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onDec(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 监听数值减少事件。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -23,6 +23,7 @@ Flex(value?: { direction?: FlexDirection, wrap?: FlexWrap, justifyContent?: Fle
标准Flex布局容器。
从API version 9开始,该接口支持在ArkTS卡片中使用。
- 参数
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| -------------- | ---------------------------------------- | ---- | ----------------- | ---------------------------------------- |
......
......@@ -13,6 +13,8 @@
GridCol(option?:{span?: number | GridColColumnOption, offset?: number | GridColColumnOption, order?: number | GridColColumnOption})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 类型 | 必填 | 说明 |
......@@ -25,12 +27,14 @@ GridCol(option?:{span?: number | GridColColumnOption, offset?: number | GridColC
| 参数名 | 类型 | 必填 | 说明 |
| ------ | ----------------------------- | ---- | ------------------------------------------------------------ |
| span | number \| GridColColumnOption | 否 | 占用列数。span为0,意味着该元素不参与布局计算,即不会被渲染。<br/>默认值:1。 |
| offset | number \| GridColColumnOption | 否 | 相对于前一个栅格子组件偏移的列数。<br/>默认值:0。 |
| order | number \| GridColColumnOption | 否 | 元素的序号,根据栅格子组件的序号,从小到大对栅格子组件做排序。<br/>默认值:0。 |
| span | number \| GridColColumnOption | 否 | 占用列数。span为0,意味着该元素不参与布局计算,即不会被渲染。<br/>默认值:1。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| offset | number \| GridColColumnOption | 否 | 相对于前一个栅格子组件偏移的列数。<br/>默认值:0。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| order | number \| GridColColumnOption | 否 | 元素的序号,根据栅格子组件的序号,从小到大对栅格子组件做排序。<br/>默认值:0。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## GridColColumnOption
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ----- | ------ | ---- | ---------------------------------------- |
| xs | number | 否 | 最小宽度类型设备。 |
......
......@@ -15,6 +15,8 @@
## 接口
GridRow(option?: {columns?: number | GridRowColumnOption, gutter?: Length | GutterOption, breakpoints?: BreakPoints, direction?: GridRowDirection})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 |类型|必填|说明|
|-----|-----|----|----|
......@@ -25,6 +27,8 @@ GridRow(option?: {columns?: number | GridRowColumnOption, gutter?: Length | Gutt
## GutterOption
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ----- | ------ | ---- | ---------------------------------------- |
| x | Length \| GridRowSizeOption | 否 | 水平gutter option。 |
......@@ -34,6 +38,8 @@ GridRow(option?: {columns?: number | GridRowColumnOption, gutter?: Length | Gutt
栅格在不同宽度设备类型下,栅格列数。
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ----- | ------ | ---- | ---------------------------------------- |
| xs | number | 否 | 最小宽度类型设备。 |
......@@ -47,6 +53,8 @@ GridRow(option?: {columns?: number | GridRowColumnOption, gutter?: Length | Gutt
栅格在不同宽度设备类型下,gutter的大小。
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ----- | ------ | ---- | ---------------------------------------- |
| xs | Length | 否 | 最小宽度类型设备。 |
......@@ -58,6 +66,8 @@ GridRow(option?: {columns?: number | GridRowColumnOption, gutter?: Length | Gutt
## BreakPoints
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ----- | ------ | ---- | ---------------------------------------- |
| value | Array&lt;string&gt; | 否 | 设置断点位置的单调递增数组。<br>默认值:["320vp", "520vp", "840vp"] |
......@@ -72,12 +82,18 @@ GridRow(option?: {columns?: number | GridRowColumnOption, gutter?: Length | Gutt
```
## BreakpointsReference枚举类型
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 枚举名 | 描述 |
| -------- | -------- |
| WindowSize | 以窗口为参照。 |
| ComponentSize | 以容器为参照。 |
## GridRowDirection枚举类型
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 枚举名 | 描述 |
| -------- | -------- |
| Row | 栅格元素按照行方向排列。 |
......@@ -118,6 +134,8 @@ GridRow(option?: {columns?: number | GridRowColumnOption, gutter?: Length | Gutt
onBreakpointChange(callback: (breakpoints: string) => void)
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 说明 |
......
......@@ -17,6 +17,8 @@
List(value?:{space?: number&nbsp;|&nbsp;string, initialIndex?: number, scroller?: Scroller})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
......@@ -31,20 +33,22 @@ List(value?:{space?: number&nbsp;|&nbsp;string, initialIndex?: number, scroller?
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| listDirection | [Axis](ts-appendix-enums.md#axis) | 设置List组件排列方向。<br/>默认值:Axis.Vertical |
| divider | {<br/>strokeWidth:&nbsp;[Length](ts-types.md#length),<br/>color?:[ResourceColor](ts-types.md),<br/>startMargin?:&nbsp;Length,<br/>endMargin?:&nbsp;Length<br/>}&nbsp;\|&nbsp;null | 设置ListItem分割线样式,默认无分割线。<br/>- strokeWidth:&nbsp;分割线的线宽。<br/>- color:&nbsp;分割线的颜色。<br/>- startMargin:&nbsp;分割线与列表侧边起始端的距离。<br/>- endMargin:&nbsp;分割线与列表侧边结束端的距离。 |
| scrollBar | [BarState](ts-appendix-enums.md#barstate) | 设置滚动条状态。<br/>默认值:BarState.Off |
| cachedCount | number | 设置列表中ListItem/ListItemGroup的预加载数量,其中ListItemGroup将作为一个整体进行计算,ListItemGroup中的所有ListItem会一次性全部加载出来。具体使用可参考[减少应用白块说明](../../ui/ui-ts-performance-improvement-recommendation.md#减少应用滑动白块)<br/>默认值:1 |
| listDirection | [Axis](ts-appendix-enums.md#axis) | 设置List组件排列方向。<br/>默认值:Axis.Vertical<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| divider | {<br/>strokeWidth:&nbsp;[Length](ts-types.md#length),<br/>color?:[ResourceColor](ts-types.md),<br/>startMargin?:&nbsp;Length,<br/>endMargin?:&nbsp;Length<br/>}&nbsp;\|&nbsp;null | 设置ListItem分割线样式,默认无分割线。<br/>- strokeWidth:&nbsp;分割线的线宽。<br/>- color:&nbsp;分割线的颜色。<br/>- startMargin:&nbsp;分割线与列表侧边起始端的距离。<br/>- endMargin:&nbsp;分割线与列表侧边结束端的距离。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| scrollBar | [BarState](ts-appendix-enums.md#barstate) | 设置滚动条状态。<br/>默认值:BarState.Off<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| cachedCount | number | 设置列表中ListItem/ListItemGroup的预加载数量,其中ListItemGroup将作为一个整体进行计算,ListItemGroup中的所有ListItem会一次性全部加载出来。具体使用可参考[减少应用白块说明](../../ui/ui-ts-performance-improvement-recommendation.md#减少应用滑动白块)<br/>默认值:1<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| editMode | boolean | 声明当前List组件是否处于可编辑模式。<br/>默认值:false |
| edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | 设置组件的滑动效果。<br/>默认值:EdgeEffect.Spring |
| chainAnimation | boolean | 设置当前List是否启用链式联动动效,开启后列表滑动以及顶部和底部拖拽时会有链式联动的效果。链式联动效果:List内的list-item间隔一定距离,在基本的滑动交互行为下,主动对象驱动从动对象进行联动,驱动效果遵循弹簧物理动效。<br/>默认值:false<br/>-&nbsp;false:不启用链式联动。<br/>-&nbsp;true:启用链式联动。 |
| multiSelectable<sup>8+</sup> | boolean | 是否开启鼠标框选。<br/>默认值:false<br/>-&nbsp;false:关闭框选。<br/>-&nbsp;true:开启框选。 |
| lanes<sup>9+</sup> | number \| [LengthConstrain](ts-types.md#lengthconstrain) | 以列模式为例(listDirection为Axis.Vertical):<br/>lanes用于决定List组件在交叉轴方向按几列布局。<br/>默认值:1<br/>规则如下:<br/>- lanes为指定的数量时,根据指定的数量与List组件的交叉轴宽度来决定每列的宽度;<br/>- lane设置了{minLength,maxLength}时,根据List组件的宽度自适应决定lanes数量(即列数),保证缩放过程中lane的宽度符合{minLength,maxLength}的限制。其中,minLength条件会被优先满足,即优先保证符合ListItem的宽度符合最小宽度限制。例如在列模式下,设置了{minLength: 40vp,maxLength: 60vp},则当List组件宽度为70vp时,ListItem为一列,并且根据alignListItem属性做靠左、居中或者靠右布局;当List组件宽度变化至80vp时,符合两倍的minLength,则ListItem自适应为两列。 |
| alignListItem<sup>9+</sup> | ListItemAlign | List交叉轴方向宽度大于ListItem交叉轴宽度 * lanes时,ListItem在List交叉轴方向的布局方式,默认为首部对齐。<br/>默认值:ListItemAlign.Start |
| sticky<sup>9+</sup> | StickyStyle | 配合[ListItemGroup](ts-container-listitemgroup.md)组件使用,设置ListItemGroup中header和footer是否要吸顶或吸底。<br/>默认值:StickyStyle.None<br/>**说明:**<br/>sticky属性可以设置为 StickyStyle.Header \| StickyStyle.Footer 以同时支持header吸顶和footer吸底。 |
| edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | 设置组件的滑动效果。<br/>默认值:EdgeEffect.Spring<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| chainAnimation | boolean | 设置当前List是否启用链式联动动效,开启后列表滑动以及顶部和底部拖拽时会有链式联动的效果。链式联动效果:List内的list-item间隔一定距离,在基本的滑动交互行为下,主动对象驱动从动对象进行联动,驱动效果遵循弹簧物理动效。<br/>默认值:false<br/>-&nbsp;false:不启用链式联动。<br/>-&nbsp;true:启用链式联动。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| multiSelectable<sup>8+</sup> | boolean | 是否开启鼠标框选。<br/>默认值:false<br/>-&nbsp;false:关闭框选。<br/>-&nbsp;true:开启框选。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| lanes<sup>9+</sup> | number \| [LengthConstrain](ts-types.md#lengthconstrain) | 以列模式为例(listDirection为Axis.Vertical):<br/>lanes用于决定List组件在交叉轴方向按几列布局。<br/>默认值:1<br/>规则如下:<br/>- lanes为指定的数量时,根据指定的数量与List组件的交叉轴宽度来决定每列的宽度;<br/>- lane设置了{minLength,maxLength}时,根据List组件的宽度自适应决定lanes数量(即列数),保证缩放过程中lane的宽度符合{minLength,maxLength}的限制。其中,minLength条件会被优先满足,即优先保证符合ListItem的宽度符合最小宽度限制。例如在列模式下,设置了{minLength: 40vp,maxLength: 60vp},则当List组件宽度为70vp时,ListItem为一列,并且根据alignListItem属性做靠左、居中或者靠右布局;当List组件宽度变化至80vp时,符合两倍的minLength,则ListItem自适应为两列。<br/>该接口支持在ArkTS卡片中使用。 |
| alignListItem<sup>9+</sup> | ListItemAlign | List交叉轴方向宽度大于ListItem交叉轴宽度 * lanes时,ListItem在List交叉轴方向的布局方式,默认为首部对齐。<br/>默认值:ListItemAlign.Start<br/>该接口支持在ArkTS卡片中使用。 |
| sticky<sup>9+</sup> | StickyStyle | 配合[ListItemGroup](ts-container-listitemgroup.md)组件使用,设置ListItemGroup中header和footer是否要吸顶或吸底。<br/>默认值:StickyStyle.None<br/>该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>sticky属性可以设置为 StickyStyle.Header \| StickyStyle.Footer 以同时支持header吸顶和footer吸底。 |
## ListItemAlign<sup>9+</sup>枚举说明
该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | -------------------------------------- |
| Start | ListItem在List中,交叉轴方向首部对齐。 |
......@@ -53,6 +57,8 @@ List(value?:{space?: number&nbsp;|&nbsp;string, initialIndex?: number, scroller?
## StickyStyle<sup>9+</sup>枚举说明
该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | -------------------------------------- |
| None | ListItemGroup的header不吸顶,footer不吸底。 |
......@@ -66,13 +72,13 @@ List(value?:{space?: number&nbsp;|&nbsp;string, initialIndex?: number, scroller?
| 名称 | 功能描述 |
| -------- | -------- |
| onItemDelete(event: (index: number) => boolean) | 当List组件在编辑模式时,点击ListItem右边出现的删除按钮时触发。<br/>- index: 被删除的列表项的索引值。 |
| onScroll(event: (scrollOffset: number, scrollState: ScrollState) => void) | 列表滑动时触发。<br/>- scrollOffset: 滑动偏移量。<br/>- [scrollState](#scrollstate枚举说明): 当前滑动状态。 |
| onScrollIndex(event: (start: number, end: number) => void) | 列表滑动时触发。<br/>计算索引值时,ListItemGroup作为一个整体占一个索引值,不计算ListItemGroup内部ListItem的索引值。<br/>- start: 滑动起始位置索引值。<br/>- end: 滑动结束位置索引值。 |
| onReachStart(event: () => void) | 列表到达起始位置时触发。 |
| onReachEnd(event: () => void) | 列表到底末尾位置时触发。 |
| onScrollFrameBegin<sup>9+</sup>(event: (offset: number, state: ScrollState) => { offsetRemain }) | 列表开始滑动时触发,事件参数传入即将发生的滑动量,事件处理函数中可根据应用场景计算实际需要的滑动量并作为事件处理函数的返回值返回,列表将按照返回值的实际滑动量进行滑动。<br/>\- offset:即将发生的滑动量。<br/>\- state:当前滑动状态。<br/>- offsetRemain:水平方向实际滑动量。 |
| onScroll(event: (scrollOffset: number, scrollState: ScrollState) => void) | 列表滑动时触发。<br/>- scrollOffset: 滑动偏移量。<br/>- [scrollState](#scrollstate枚举说明): 当前滑动状态。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onScrollIndex(event: (start: number, end: number) => void) | 列表滑动时触发。<br/>计算索引值时,ListItemGroup作为一个整体占一个索引值,不计算ListItemGroup内部ListItem的索引值。<br/>- start: 滑动起始位置索引值。<br/>- end: 滑动结束位置索引值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onReachStart(event: () => void) | 列表到达起始位置时触发。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onReachEnd(event: () => void) | 列表到底末尾位置时触发。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onScrollFrameBegin<sup>9+</sup>(event: (offset: number, state: ScrollState) => { offsetRemain }) | 列表开始滑动时触发,事件参数传入即将发生的滑动量,事件处理函数中可根据应用场景计算实际需要的滑动量并作为事件处理函数的返回值返回,列表将按照返回值的实际滑动量进行滑动。<br/>\- offset:即将发生的滑动量。<br/>\- state:当前滑动状态。<br/>- offsetRemain:水平方向实际滑动量。<br/>该接口支持在ArkTS卡片中使用。 |
| onScrollStart<sup>9+</sup>(event: () => void) | 列表滑动开始时触发。手指拖动列表或列表的滚动条触发的滑动开始时,会触发该事件。使用[Scroller](ts-container-scroll.md#scroller)滑动控制器触发的滑动,不会触发该事件。 |
| onScrollStop(event: () => void) | 列表滑动停止时触发。手拖动列表或列表的滚动条触发的滑动,手离开屏幕并且滑动停止时会触发该事件;使用[Scroller](ts-container-scroll.md#scroller)滑动控制器触发的滑动,不会触发该事件。 |
| onScrollStop(event: () => void) | 列表滑动停止时触发。手拖动列表或列表的滚动条触发的滑动,手离开屏幕并且滑动停止时会触发该事件;使用[Scroller](ts-container-scroll.md#scroller)滑动控制器触发的滑动,不会触发该事件。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onItemMove(event: (from: number, to: number) => boolean) | 列表元素发生移动时触发。<br/>- from: 移动前索引值。<br/>- to: 移动后索引值。 |
| onItemDragStart(event: (event: ItemDragInfo, itemIndex: number) => ((() => any) \| void) | 开始拖拽列表元素时触发。<br/>- event: 见[ItemDragInfo对象说明](ts-container-grid.md#itemdraginfo对象说明)<br/>- itemIndex: 被拖拽列表元素索引值。 |
| onItemDragEnter(event: (event: ItemDragInfo) => void) | 拖拽进入列表元素范围内时触发。<br/>- event: 见[ItemDragInfo对象说明](ts-container-grid.md#itemdraginfo对象说明)。 |
......@@ -82,6 +88,8 @@ List(value?:{space?: number&nbsp;|&nbsp;string, initialIndex?: number, scroller?
## ScrollState枚举说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------ | ------------------------- |
| Idle | 未滑动状态。 |
......
......@@ -16,6 +16,8 @@
ListItem(value?: string)
从API version 9开始,该接口支持在ArkTS卡片中使用。
## 属性
除支持[通用属性](ts-universal-attributes-size.md)外,还支持以下属性:
......@@ -24,7 +26,7 @@ ListItem(value?: string)
| -------- | -------- | -------- |
| sticky<sup>(deprecated)</sup> | [Sticky](#stickydeprecated枚举说明) | 设置ListItem吸顶效果。<br/>默认值:Sticky.None<br/>从API version9开始废弃,推荐使用[List组件sticky属性](ts-container-list.md#属性)。 |
| editable | boolean&nbsp;\|&nbsp;[EditMode](#editmode枚举说明) | 当前ListItem元素是否可编辑,进入编辑模式后可删除或移动列表项。<br/>默认值:false |
| selectable<sup>8+</sup> | boolean | 当前ListItem元素是否可以被鼠标框选。<br/>**说明:**<br/>外层List容器的鼠标框选开启时,ListItem的框选才生效。<br/>默认值:true |
| selectable<sup>8+</sup> | boolean | 当前ListItem元素是否可以被鼠标框选。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>外层List容器的鼠标框选开启时,ListItem的框选才生效。<br/>默认值:true |
| swipeAction<sup>9+</sup> | {<br/>start?:&nbsp;CustomBuilder,<br/>end?:CustomBuilder,<br/>edgeEffect?:&nbsp;[SwipeEdgeEffect](#swipeedgeeffect9枚举说明),<br/>} | 用于设置ListItem的划出组件。<br/>- start:&nbsp;ListItem向右划动时item左边的组件(List垂直布局时)或ListItem向下划动时item上方的组件(List水平布局时)。<br/>- end:&nbsp;ListItem向左划动时item右边的组件(List垂直布局时)或ListItem向上划动时item下方的组件(List水平布局时)。<br/>- edgeEffect:&nbsp;滑动效果。<br/> |
## Sticky<sup>(deprecated)</sup>枚举说明
......@@ -53,7 +55,7 @@ ListItem(value?: string)
| 名称 | 功能描述 |
| -------- | -------- |
| onSelect(event:&nbsp;(isSelected:&nbsp;boolean)&nbsp;=&gt;&nbsp;void)<sup>8+</sup> | ListItem元素被鼠标框选的状态改变时触发回调。<br/>isSelected:进入鼠标框选范围即被选中返回true,&nbsp;移出鼠标框选范围即未被选中返回false。 |
| onSelect(event:&nbsp;(isSelected:&nbsp;boolean)&nbsp;=&gt;&nbsp;void)<sup>8+</sup> | ListItem元素被鼠标框选的状态改变时触发回调。<br/>isSelected:进入鼠标框选范围即被选中返回true,&nbsp;移出鼠标框选范围即未被选中返回false。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -16,6 +16,8 @@
Circle(options?: {width?: string | number, height?: string | number})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
......@@ -29,17 +31,17 @@ Circle(options?: {width?: string | number, height?: string | number})
| 名称 | 类型 | 描述 |
| -------- | -------- | -------- |
| fill | [ResourceColor](ts-types.md) | 设置填充区域颜色。<br>默认值:Color.Black |
| fillOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 设置填充区域透明度。<br>默认值:1 |
| stroke | [ResourceColor](ts-types.md) | 设置边框颜色,不设置时,默认没有边框。 |
| strokeDashArray | Array&lt;Length&gt; | 设置边框间隙。<br>默认值:[] |
| strokeDashOffset | number&nbsp;\|&nbsp;string | 边框绘制起点的偏移量。<br>默认值:0 |
| strokeLineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | 设置边框端点绘制样式。<br>默认值:LineCapStyle.Butt |
| strokeLineJoin | [LineJoinStyle](ts-appendix-enums.md#linejoinstyle) | 设置边框拐角绘制样式。<br>默认值:LineJoinStyle.Miter |
| strokeMiterLimit | number&nbsp;\|&nbsp;string | 设置斜接长度与边框宽度比值的极限值。<br>默认值:4<br/>**说明:**<br/>Circle组件无法设置尖角图形,该属性设置无效。 |
| strokeOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 设置边框透明度。<br>默认值:1<br/>**说明:**<br/>该属性的取值范围是[0.0, 1.0],若给定值小于0.0,则取值为0.0;若给定值大于1.0,则取值为1.0。 |
| strokeWidth | Length | 设置边框宽度。<br>默认值:1 |
| antiAlias | boolean | 是否开启抗锯齿效果。<br>默认值:true |
| fill | [ResourceColor](ts-types.md) | 设置填充区域颜色。<br>默认值:Color.Black<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| fillOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 设置填充区域透明度。<br>默认值:1<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| stroke | [ResourceColor](ts-types.md) | 设置边框颜色,不设置时,默认没有边框。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeDashArray | Array&lt;Length&gt; | 设置边框间隙。<br>默认值:[]<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeDashOffset | number&nbsp;\|&nbsp;string | 边框绘制起点的偏移量。<br>默认值:0<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeLineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | 设置边框端点绘制样式。<br>默认值:LineCapStyle.Butt<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeLineJoin | [LineJoinStyle](ts-appendix-enums.md#linejoinstyle) | 设置边框拐角绘制样式。<br>默认值:LineJoinStyle.Miter<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeMiterLimit | number&nbsp;\|&nbsp;string | 设置斜接长度与边框宽度比值的极限值。<br>默认值:4<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>Circle组件无法设置尖角图形,该属性设置无效。 |
| strokeOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 设置边框透明度。<br>默认值:1<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>该属性的取值范围是[0.0, 1.0],若给定值小于0.0,则取值为0.0;若给定值大于1.0,则取值为1.0。 |
| strokeWidth | Length | 设置边框宽度。<br>默认值:1<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| antiAlias | boolean | 是否开启抗锯齿效果。<br>默认值:true<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -16,6 +16,8 @@
Ellipse(options?: {width?: string | number, height?: string | number})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 参数描述 |
......@@ -29,17 +31,17 @@ Ellipse(options?: {width?: string | number, height?: string | number})
| 名称 | 类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| fill | [ResourceColor](ts-types.md) | Color.Black | 设置填充区域颜色。 |
| fillOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 1 | 设置填充区域透明度。 |
| stroke | [ResourceColor](ts-types.md) | - |设置边框颜色,不设置时,默认没有边框。 |
| strokeDashArray | Array&lt;Length&gt; | [] | 设置边框间隙。 |
| strokeDashOffset | number&nbsp;\|&nbsp;string | 0 | 边框绘制起点的偏移量。 |
| strokeLineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | LineCapStyle.Butt | 设置边框端点绘制样式。 |
| strokeLineJoin | [LineJoinStyle](ts-appendix-enums.md#linejoinstyle) | LineJoinStyle.Miter | 设置边框拐角绘制样式。 |
| strokeMiterLimit | number&nbsp;\|&nbsp;string | 4 | 设置斜接长度与边框宽度比值的极限值。<br/>**说明:**<br/>Ellipse组件无法设置尖角图形,该属性设置无效。 |
| strokeOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 1 | 设置边框透明度。<br/>**说明:**<br/>该属性的取值范围是[0.0, 1.0],若给定值小于0.0,则取值为0.0;若给定值大于1.0,则取值为1.0。 |
| strokeWidth | Length | 1 | 设置边框宽度。 |
| antiAlias | boolean | true | 是否开启抗锯齿效果。 |
| fill | [ResourceColor](ts-types.md) | Color.Black | 设置填充区域颜色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| fillOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 1 | 设置填充区域透明度。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| stroke | [ResourceColor](ts-types.md) | - |设置边框颜色,不设置时,默认没有边框。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeDashArray | Array&lt;Length&gt; | [] | 设置边框间隙。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeDashOffset | number&nbsp;\|&nbsp;string | 0 | 边框绘制起点的偏移量。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeLineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | LineCapStyle.Butt | 设置边框端点绘制样式。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeLineJoin | [LineJoinStyle](ts-appendix-enums.md#linejoinstyle) | LineJoinStyle.Miter | 设置边框拐角绘制样式。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeMiterLimit | number&nbsp;\|&nbsp;string | 4 | 设置斜接长度与边框宽度比值的极限值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>Ellipse组件无法设置尖角图形,该属性设置无效。 |
| strokeOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 1 | 设置边框透明度。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>该属性的取值范围是[0.0, 1.0],若给定值小于0.0,则取值为0.0;若给定值大于1.0,则取值为1.0。 |
| strokeWidth | Length | 1 | 设置边框宽度。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| antiAlias | boolean | true | 是否开启抗锯齿效果。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -15,6 +15,8 @@
Line(value?: {width?: string | number, height?: string | number})
从API version 9开始,该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
......@@ -29,19 +31,19 @@ Line(value?: {width?: string | number, height?: string | number})
| 名称 | 类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| startPoint | Array&lt;Length&gt; | [0,&nbsp;0] | 直线起点坐标点(相对坐标),单位vp。 |
| endPoint | Array&lt;Length&gt; | [0,&nbsp;0] | 直线终点坐标点(相对坐标),单位vp。 |
| fill | [ResourceColor](ts-types.md#resourcecolor) | Color.Black | 设置填充区域颜色。<br/>**说明:**<br/>Line组件无法形成闭合区域,该属性设置无效。 |
| fillOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 1 | 设置填充区域透明度。<br/>**说明:**<br/>Line组件无法形成闭合区域,该属性设置无效。 |
| stroke | [ResourceColor](ts-types.md) | - | 设置边框颜色,不设置时,默认没有边框线条。 |
| strokeDashArray | Array&lt;Length&gt; | [] | 设置线条间隙。 |
| strokeDashOffset | number&nbsp;\|&nbsp;string | 0 | 线条绘制起点的偏移量。 |
| strokeLineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | LineCapStyle.Butt | 设置线条端点绘制样式。 |
| strokeLineJoin | [LineJoinStyle](ts-appendix-enums.md#linejoinstyle) | LineJoinStyle.Miter | 设置线条拐角绘制样式。 |
| strokeMiterLimit | number&nbsp;\|&nbsp;string | 4 | 设置锐角绘制成斜角的极限值。<br/>**说明:**<br/>Line组件无法设置锐角图形,该属性设置无效。 |
| strokeOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 1 | 设置线条透明度。<br/>**说明:**<br/>该属性的取值范围是[0.0, 1.0],若给定值小于0.0,则取值为0.0;若给定值大于1.0,则取值为1.0。 |
| strokeWidth | Length | 1 | 设置线条宽度。 |
| antiAlias | boolean | true | 是否开启抗锯齿效果。 |
| startPoint | Array&lt;Length&gt; | [0,&nbsp;0] | 直线起点坐标点(相对坐标),单位vp。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| endPoint | Array&lt;Length&gt; | [0,&nbsp;0] | 直线终点坐标点(相对坐标),单位vp。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| fill | [ResourceColor](ts-types.md#resourcecolor) | Color.Black | 设置填充区域颜色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>Line组件无法形成闭合区域,该属性设置无效。 |
| fillOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 1 | 设置填充区域透明度。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>Line组件无法形成闭合区域,该属性设置无效。 |
| stroke | [ResourceColor](ts-types.md) | - | 设置边框颜色,不设置时,默认没有边框线条。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeDashArray | Array&lt;Length&gt; | [] | 设置线条间隙。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeDashOffset | number&nbsp;\|&nbsp;string | 0 | 线条绘制起点的偏移量。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeLineCap | [LineCapStyle](ts-appendix-enums.md#linecapstyle) | LineCapStyle.Butt | 设置线条端点绘制样式。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeLineJoin | [LineJoinStyle](ts-appendix-enums.md#linejoinstyle) | LineJoinStyle.Miter | 设置线条拐角绘制样式。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| strokeMiterLimit | number&nbsp;\|&nbsp;string | 4 | 设置锐角绘制成斜角的极限值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>Line组件无法设置锐角图形,该属性设置无效。 |
| strokeOpacity | number&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 1 | 设置线条透明度。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>该属性的取值范围是[0.0, 1.0],若给定值小于0.0,则取值为0.0;若给定值大于1.0,则取值为1.0。 |
| strokeWidth | Length | 1 | 设置线条宽度。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| antiAlias | boolean | true | 是否开启抗锯齿效果。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -6,9 +6,10 @@
>
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
animateTo(value: AnimateParam, event: () => void): void
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 参数 | 类型 | 是否必填 | 描述 |
| ---------------- | ------------ | -------------------- | -------------------- |
| value | [AnimateParam](#animateparam对象说明) | 是 | 设置动画效果相关参数。 |
......@@ -18,13 +19,13 @@ animateTo(value: AnimateParam, event: () => void): void
| 名称 | 类型 | 描述 |
| -------- | -------- | -------- |
| duration | number | 动画持续时间,单位为毫秒。<br/>默认值:1000 |
| duration | number | 动画持续时间,单位为毫秒。<br/>默认值:1000<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>- 在ArkTS卡片上最大动画持续时间为1000毫秒,若超出则固定为1000毫秒。 |
| tempo | number | 动画的播放速度,值越大动画播放越快,值越小播放越慢,为0时无动画效果。<br/>默认值:1.0 |
| curve | [Curve](ts-appendix-enums.md#curve)&nbsp;\|&nbsp;[ICurve](../apis/js-apis-curve.md#icurve)&nbsp;\|&nbsp;string | 动画曲线。<br/>默认值:Curve.Linear |
| curve | [Curve](ts-appendix-enums.md#curve)&nbsp;\|&nbsp;[ICurve](../apis/js-apis-curve.md#icurve)&nbsp;\|&nbsp;string | 动画曲线。<br/>默认值:Curve.Linear<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| delay | number | 单位为ms(毫秒),默认不延时播放。<br/>默认值:0 |
| iterations | number | 默认播放一次,设置为-1时表示无限次播放。<br/>默认值:1 |
| playMode | [PlayMode](ts-appendix-enums.md#playmode) | 设置动画播放模式,默认播放完成后重头开始播放。<br/>默认值:PlayMode.Normal |
| onFinish | ()&nbsp;=&gt;&nbsp;void | 动效播放完成回调。 |
| playMode | [PlayMode](ts-appendix-enums.md#playmode) | 设置动画播放模式,默认播放完成后重头开始播放。<br/>默认值:PlayMode.Normal<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onFinish | ()&nbsp;=&gt;&nbsp;void | 动效播放完成回调。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -16,13 +16,13 @@
提供其他单位与px单位互相转换的方法。
| 接口 | 描述 |
| ---------------------------------------- | ---------------------- |
| vp2px(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将vp单位的数值转换为以px为单位的数值。 |
| px2vp(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将px单位的数值转换为以vp为单位的数值。 |
| fp2px(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将fp单位的数值转换为以px为单位的数值。 |
| px2fp(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将px单位的数值转换为以fp为单位的数值。 |
| lpx2px(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将lpx单位的数值转换为以px为单位的数值。 |
| px2lpx(value&nbsp;:&nbsp;number)&nbsp;:&nbsp;number | 将px单位的数值转换为以lpx为单位的数值。 |
| --------------------------------------------------- | ------------------------------------------------------------ |
| 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卡片中使用。 |
## 示例
......
......@@ -10,10 +10,10 @@
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| backgroundColor | [ResourceColor](ts-types.md#resourcecolor) | 设置组件的背景色。 |
| backgroundImage | src:&nbsp;[ResourceStr](ts-types.md#resourcestr),<br/>repeat?:&nbsp;[ImageRepeat](ts-appendix-enums.md#imagerepeat) | src:图片地址,支持网络图片资源和本地图片资源地址(不支持svg类型的图片)。<br/>repeat:设置背景图片的重复样式,默认不重复。 |
| backgroundImageSize | {<br/>width?:&nbsp;[Length](ts-types.md#length),<br/>height?:&nbsp;[Length](ts-types.md#length)<br/>}&nbsp;\|&nbsp;[ImageSize](ts-appendix-enums.md#imagesize) | 设置背景图像的高度和宽度。当输入为{width:&nbsp;Length,&nbsp;height:&nbsp;Length}对象时,如果只设置一个属性,则第二个属性保持图片原始宽高比进行调整。默认保持原图的比例不变。<br/>默认值:ImageSize.Auto |
| backgroundImagePosition | [Position](ts-types.md#position8)&nbsp;\|&nbsp;[Alignment](ts-appendix-enums.md#alignment) | 设置背景图在组件中显示位置,即相对于组件左上角的坐标。<br/>默认值:<br/>{<br/>x:&nbsp;0,<br/>y:&nbsp;0<br/>} <br/> x和y值设置百分比时,偏移量是相对组件自身宽高计算的。 |
| backgroundColor | [ResourceColor](ts-types.md#resourcecolor) | 设置组件的背景色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundImage | src:&nbsp;[ResourceStr](ts-types.md#resourcestr),<br/>repeat?:&nbsp;[ImageRepeat](ts-appendix-enums.md#imagerepeat) | src:图片地址,支持网络图片资源和本地图片资源地址(不支持svg类型的图片)。<br/>repeat:设置背景图片的重复样式,默认不重复。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundImageSize | {<br/>width?:&nbsp;[Length](ts-types.md#length),<br/>height?:&nbsp;[Length](ts-types.md#length)<br/>}&nbsp;\|&nbsp;[ImageSize](ts-appendix-enums.md#imagesize) | 设置背景图像的高度和宽度。当输入为{width:&nbsp;Length,&nbsp;height:&nbsp;Length}对象时,如果只设置一个属性,则第二个属性保持图片原始宽高比进行调整。默认保持原图的比例不变。<br/>默认值:ImageSize.Auto<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backgroundImagePosition | [Position](ts-types.md#position8)&nbsp;\|&nbsp;[Alignment](ts-appendix-enums.md#alignment) | 设置背景图在组件中显示位置,即相对于组件左上角的坐标。<br/>默认值:<br/>{<br/>x:&nbsp;0,<br/>y:&nbsp;0<br/>} <br/> x和y值设置百分比时,偏移量是相对组件自身宽高计算的。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -12,10 +12,12 @@
| 名称 | 参数类型 | 描述 |
| -------------------- | ----------------------- | ------------------------ |
| backgroundBlurStyle | [BlurStyle](#blurstyle) | 为当前组件提供一种在背景和内容之间的模糊能力,入参为模糊材质。|
| backgroundBlurStyle | [BlurStyle](#blurstyle) | 为当前组件提供一种在背景和内容之间的模糊能力,入参为模糊材质。<br/>该接口支持在ArkTS卡片中使用。 |
## BlurStyle
该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------- | ---------- |
| Thin | 轻薄材质。 |
......
......@@ -10,10 +10,12 @@
| 名称 | 参数类型 | 描述 |
| ---------- | ---------------------------------------- | --------------------------------------- |
| borderImage | [BorderImageOption](#borderimageoption对象说明) | 图片边框或者渐变色边框设置接口。 |
| borderImage | [BorderImageOption](#borderimageoption对象说明) | 图片边框或者渐变色边框设置接口。<br/>该接口支持在ArkTS卡片中使用。 |
## BorderImageOption对象说明
该接口支持在ArkTS卡片中使用。
| 名称 | 类型 | 描述 |
| ---------- | ---------------------------------------- | --------------------------------------- |
| source | string \| [Resource](ts-types.md#resource) \| [linearGradient](ts-universal-attributes-gradient-color.md) | 边框图源或者渐变色设置。<br/>**说明:** 边框图源仅适用于容器组件,如Row、Column、Flex,在非容器组件上使用会失效。 |
......@@ -23,9 +25,10 @@
| repeat | [RepeatMode](#repeatmode枚举说明) | 设置边框图片的重复方式。<br/>默认值:RepeatMode.Stretch |
| fill | boolean | 设置边框图片中心填充。<br/>默认值:false |
## RepeatMode枚举说明
该接口支持在ArkTS卡片中使用。
| 名称 | 描述 |
| ------- | ----------------------------------- |
| Repeat | 被切割图片重复铺平在图片边框上,超出的部分会被剪裁。 |
......
......@@ -13,11 +13,11 @@
| 名称 | 参数类型 | 描述 |
| ------------ | ------------------------------------------------------------ | ------------------------------------------------------------ |
| border | {<br/>width?:&nbsp;[Length](ts-types.md#length)&nbsp;\|&nbsp;[EdgeWidths](#edgewidths9对象说明)<sup>9+</sup>,<br/>color?: &nbsp;[ResourceColor](ts-types.md#resourcecolor)&nbsp;\|&nbsp;[EdgeColors](#edgecolors9对象说明)<sup>9+</sup>,<br/>radius?: &nbsp;[Length](ts-types.md#length)&nbsp;\|&nbsp;[BorderRadiuses](#borderradiuses9对象说明)<sup>9+</sup>,<br/>style?:&nbsp;[BorderStyle](ts-appendix-enums.md#borderstyle)&nbsp;\|&nbsp;[EdgeStyles](#edgestyles9对象说明)<sup>9+</sup><br/>} | 统一边框样式设置接口。<br/>-&nbsp;width:设置边框宽度。<br/>-&nbsp;color:设置边框颜色。<br/>-&nbsp;radius:设置边框圆角半径。<br/>-&nbsp;style:设置边框样式。 |
| borderStyle | [BorderStyle](ts-appendix-enums.md#borderstyle) \| [EdgeStyles](#edgestyles9对象说明)<sup>9+</sup> | 设置元素的边框样式。<br/>默认值:BorderStyle.Solid |
| borderWidth | [Length](ts-types.md#length) \| [EdgeWidths](#edgewidths9对象说明)<sup>9+</sup> | 设置元素的边框宽度,不支持百分比。 |
| borderColor | [ResourceColor](ts-types.md#resourcecolor) \| [EdgeColors](#edgecolors9对象说明)<sup>9+</sup> | 设置元素的边框颜色。<br/>默认值:Color.Black |
| borderRadius | [Length](ts-types.md#length) \| [BorderRadiuses](#borderradiuses9对象说明)<sup>9+</sup> | 设置元素的边框圆角半径,不支持百分比。 |
| border | {<br/>width?:&nbsp;[Length](ts-types.md#length)&nbsp;\|&nbsp;[EdgeWidths](#edgewidths9对象说明)<sup>9+</sup>,<br/>color?: &nbsp;[ResourceColor](ts-types.md#resourcecolor)&nbsp;\|&nbsp;[EdgeColors](#edgecolors9对象说明)<sup>9+</sup>,<br/>radius?: &nbsp;[Length](ts-types.md#length)&nbsp;\|&nbsp;[BorderRadiuses](#borderradiuses9对象说明)<sup>9+</sup>,<br/>style?:&nbsp;[BorderStyle](ts-appendix-enums.md#borderstyle)&nbsp;\|&nbsp;[EdgeStyles](#edgestyles9对象说明)<sup>9+</sup><br/>} | 统一边框样式设置接口。<br/>-&nbsp;width:设置边框宽度。<br/>-&nbsp;color:设置边框颜色。<br/>-&nbsp;radius:设置边框圆角半径。<br/>-&nbsp;style:设置边框样式。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| borderStyle | [BorderStyle](ts-appendix-enums.md#borderstyle) \| [EdgeStyles](#edgestyles9对象说明)<sup>9+</sup> | 设置元素的边框样式。<br/>默认值:BorderStyle.Solid<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| borderWidth | [Length](ts-types.md#length) \| [EdgeWidths](#edgewidths9对象说明)<sup>9+</sup> | 设置元素的边框宽度,不支持百分比。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| borderColor | [ResourceColor](ts-types.md#resourcecolor) \| [EdgeColors](#edgecolors9对象说明)<sup>9+</sup> | 设置元素的边框颜色。<br/>默认值:Color.Black<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| borderRadius | [Length](ts-types.md#length) \| [BorderRadiuses](#borderradiuses9对象说明)<sup>9+</sup> | 设置元素的边框圆角半径,不支持百分比。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## EdgeWidths<sup>9+</sup>对象说明
......
......@@ -11,7 +11,7 @@ id为组件的唯一标识,在整个应用内唯一。本模块提供组件标
| 名称 | 参数说明 | 描述 |
| -----| -------- | ----------------------------- |
| id | string | 组件的唯一标识,唯一性由使用者保证。<br>默认值:'' |
| id | string | 组件的唯一标识,唯一性由使用者保证。<br>默认值:''<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 接口
......
......@@ -11,8 +11,8 @@
| 名称 | 参数类型 | 描述 |
| ------- | ------- | ---------------------------------------- |
| enabled | boolean | 值为true表示组件可交互,响应点击等操作。<br>值为false表示组件不可交互,不响应点击等操作。<br>默认值:true |
| ------- | -------- | ------------------------------------------------------------ |
| enabled | boolean | 值为true表示组件可交互,响应点击等操作。<br>值为false表示组件不可交互,不响应点击等操作。<br>默认值:true<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -9,11 +9,11 @@
## 属性
| 名称 | 参数说明 | 描述 |
| ---------- | ---------------------------------------- | ---------------------------------------- |
| flexBasis | number \| string | 设置组件在父容器主轴方向上的基准尺寸。<br/>默认值:'auto'(表示组件在主轴方向上的基准尺寸为组件原本的大小)。<br/>不支持百分比设置。 |
| flexGrow | number | 设置父容器的剩余空间分配给此属性所在组件的比例。<br/>默认值:0 |
| flexShrink | number | 设置父容器压缩尺寸分配给此属性所在组件的比例。<br/>父容器为Row、Column时,默认值:0<br/> 父容器为flex时,默认值:1 |
| alignSelf | [ItemAlign](ts-appendix-enums.md#itemalign) | 子组件在父容器交叉轴的对齐格式,会覆盖Flex布局容器中的alignItems设置。<br/>默认值:ItemAlign.Auto |
| ---------- | ------------------------------------------- | ------------------------------------------------------------ |
| flexBasis | number \| string | 设置组件在父容器主轴方向上的基准尺寸。<br/>默认值:'auto'(表示组件在主轴方向上的基准尺寸为组件原本的大小)。<br/>不支持百分比设置。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| flexGrow | number | 设置父容器的剩余空间分配给此属性所在组件的比例。<br/>默认值:0<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| flexShrink | number | 设置父容器压缩尺寸分配给此属性所在组件的比例。<br/>父容器为Row、Column时,默认值:0<br/> 父容器为flex时,默认值:1<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| alignSelf | [ItemAlign](ts-appendix-enums.md#itemalign) | 子组件在父容器交叉轴的对齐格式,会覆盖Flex布局容器中的alignItems设置。<br/>默认值:ItemAlign.Auto<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -12,9 +12,9 @@
| 名称 | 参数类型 | 描述 |
| -------------- | -------------------------------------------- | ----------------------------------- |
| linearGradient | {<br/>angle?:&nbsp;number \| string,<br/>direction?:&nbsp;[GradientDirection](ts-appendix-enums.md#gradientdirection),<br/>colors:&nbsp;Array&lt;[ColorStop](ts-basic-components-gauge.md#colorstop)&gt;,<br/>repeating?:&nbsp;boolean<br/>} | 线性渐变。<br/>- angle:&nbsp;线性渐变的起始角度。0点方向顺时针旋转为正向角度。<br/> 默认值:180<br/>- direction:&nbsp;线性渐变的方向,设置angle后不生效。<br/> 默认值:GradientDirection.Bottom <br/>- colors:&nbsp;为渐变的颜色描述。<br/>- repeating:&nbsp;为渐变的颜色重复着色。 <br/> 默认值:false |
| sweepGradient | {<br/>center:&nbsp;Point,<br/>start?:&nbsp;number \| string,<br/>end?:&nbsp;number \| string,<br/>rotation?:&nbsp;number\|string,<br/>colors:&nbsp;Array&lt;[ColorStop](ts-basic-components-gauge.md#colorstop)&gt;,<br/>repeating?:&nbsp;boolean<br/>} | 角度渐变。<br/>- center:为角度渐变的中心点,即相对于当前组件左上角的坐标。<br/>- start:角度渐变的起点。<br/> 默认值:0<br/>- end:角度渐变的终点。<br/> 默认值:0<br/>- rotation:&nbsp;角度渐变的旋转角度。<br/> 默认值:0<br/>- colors:&nbsp;为渐变的颜色描述。<br/>- repeating:&nbsp;为渐变的颜色重复着色。<br/> 默认值:false |
| radialGradient | {<br/>center:&nbsp;Point,<br/> radius:&nbsp;number \| string,<br/>colors:&nbsp;Array&lt;[ColorStop](ts-basic-components-gauge.md#colorstop)&gt;,<br/>repeating?:&nbsp;boolean<br/>} | 径向渐变。<br/>- center:径向渐变的中心点,即相对于当前组件左上角的坐标。<br/>- radius:径向渐变的半径。<br/>- colors:&nbsp;为渐变的颜色描述。<br/>- repeating:&nbsp;为渐变的颜色重复着色。<br/> 默认值:false |
| linearGradient | {<br/>angle?:&nbsp;number \| string,<br/>direction?:&nbsp;[GradientDirection](ts-appendix-enums.md#gradientdirection),<br/>colors:&nbsp;Array&lt;[ColorStop](ts-basic-components-gauge.md#colorstop)&gt;,<br/>repeating?:&nbsp;boolean<br/>} | 线性渐变。<br/>- angle:&nbsp;线性渐变的起始角度。0点方向顺时针旋转为正向角度。<br/> 默认值:180<br/>- direction:&nbsp;线性渐变的方向,设置angle后不生效。<br/> 默认值:GradientDirection.Bottom <br/>- colors:&nbsp;为渐变的颜色描述。<br/>- repeating:&nbsp;为渐变的颜色重复着色。 <br/> 默认值:false<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| sweepGradient | {<br/>center:&nbsp;Point,<br/>start?:&nbsp;number \| string,<br/>end?:&nbsp;number \| string,<br/>rotation?:&nbsp;number\|string,<br/>colors:&nbsp;Array&lt;[ColorStop](ts-basic-components-gauge.md#colorstop)&gt;,<br/>repeating?:&nbsp;boolean<br/>} | 角度渐变。<br/>- center:为角度渐变的中心点,即相对于当前组件左上角的坐标。<br/>- start:角度渐变的起点。<br/> 默认值:0<br/>- end:角度渐变的终点。<br/> 默认值:0<br/>- rotation:&nbsp;角度渐变的旋转角度。<br/> 默认值:0<br/>- colors:&nbsp;为渐变的颜色描述。<br/>- repeating:&nbsp;为渐变的颜色重复着色。<br/> 默认值:false<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| radialGradient | {<br/>center:&nbsp;Point,<br/> radius:&nbsp;number \| string,<br/>colors:&nbsp;Array&lt;[ColorStop](ts-basic-components-gauge.md#colorstop)&gt;,<br/>repeating?:&nbsp;boolean<br/>} | 径向渐变。<br/>- center:径向渐变的中心点,即相对于当前组件左上角的坐标。<br/>- radius:径向渐变的半径。<br/>- colors:&nbsp;为渐变的颜色描述。<br/>- repeating:&nbsp;为渐变的颜色重复着色。<br/> 默认值:false<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -12,17 +12,17 @@
| 名称 | 参数类型 | 默认值 | 描述 |
| ----------------------------- | ------------------------------------------------------------ | ------ | ------------------------------------------------------------ |
| blur | number | - | 为当前组件添加内容模糊效果,入参为模糊半径,模糊半径越大越模糊,为0时不模糊。 |
| backdropBlur | number | - | 为当前组件添加背景模糊效果,入参为模糊半径,模糊半径越大越模糊,为0时不模糊。 |
| shadow | {<br/>radius:&nbsp;number \| [Resource](ts-types.md#resource),<br/>color?:&nbsp;[Color](ts-appendix-enums.md#color) \| string \| [Resource](ts-types.md#resource),<br/>offsetX?:&nbsp;number \| [Resource](ts-types.md#resource),<br/>offsetY?:&nbsp;number \| [Resource](ts-types.md#resource)<br/>} | - | 为当前组件添加阴影效果,入参为模糊半径(必填)、阴影的颜色(可选,默认为灰色)、X轴的偏移量(可选,默认为0),Y轴的偏移量(可选,默认为0),偏移量单位为px。 |
| grayscale | number | 0.0 | 为当前组件添加灰度效果。值定义为灰度转换的比例,入参1.0则完全转为灰度图像,入参则0.0图像无变化,入参在0.0和1.0之间时,效果呈线性变化。(百分比) |
| brightness | number | 1.0 | 为当前组件添加高光效果,入参为高光比例,值为1时没有效果,小于1时亮度变暗,0为全黑;大于1时亮度增加,数值越大亮度越大。 |
| saturate | number | 1.0 | 为当前组件添加饱和度效果,饱和度为颜色中的含色成分和消色成分(灰)的比例,入参为1时,显示原图像,大于1时含色成分越大,饱和度越大;小于1时消色成分越大,饱和度越小。(百分比) |
| contrast | number | 1.0 | 为当前组件添加对比度效果,入参为对比度的值,值为1时,显示原图;大于1时,值越大对比度越高,图像越清晰醒目;小于1时,值越小对比度越低;当对比度为0时,图像变为全灰。(百分比) |
| invert | number | 0 | 反转输入的图像。入参为图像反转的比例。值为1时完全反转。值为0则图像无变化。(百分比) |
| sepia | number | 0 | 将图像转换为深褐色。入参为图像反转的比例。值为1则完全是深褐色的,值为0图像无变化。&nbsp;(百分比) |
| hueRotate | number&nbsp;\|&nbsp;string | '0deg' | 色相旋转效果,输入参数为旋转角度。 |
| colorBlend&nbsp;<sup>8+</sup> | [Color](ts-appendix-enums.md#color)&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | - | 为当前组件添加颜色叠加效果,入参为叠加的颜色。 |
| blur | number | - | 为当前组件添加内容模糊效果,入参为模糊半径,模糊半径越大越模糊,为0时不模糊。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| backdropBlur | number | - | 为当前组件添加背景模糊效果,入参为模糊半径,模糊半径越大越模糊,为0时不模糊。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| shadow | {<br/>radius:&nbsp;number \| [Resource](ts-types.md#resource),<br/>color?:&nbsp;[Color](ts-appendix-enums.md#color) \| string \| [Resource](ts-types.md#resource),<br/>offsetX?:&nbsp;number \| [Resource](ts-types.md#resource),<br/>offsetY?:&nbsp;number \| [Resource](ts-types.md#resource)<br/>} | - | 为当前组件添加阴影效果,入参为模糊半径(必填)、阴影的颜色(可选,默认为灰色)、X轴的偏移量(可选,默认为0),Y轴的偏移量(可选,默认为0),偏移量单位为px。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| grayscale | number | 0.0 | 为当前组件添加灰度效果。值定义为灰度转换的比例,入参1.0则完全转为灰度图像,入参则0.0图像无变化,入参在0.0和1.0之间时,效果呈线性变化。(百分比)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| brightness | number | 1.0 | 为当前组件添加高光效果,入参为高光比例,值为1时没有效果,小于1时亮度变暗,0为全黑;大于1时亮度增加,数值越大亮度越大。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| saturate | number | 1.0 | 为当前组件添加饱和度效果,饱和度为颜色中的含色成分和消色成分(灰)的比例,入参为1时,显示原图像,大于1时含色成分越大,饱和度越大;小于1时消色成分越大,饱和度越小。(百分比)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| contrast | number | 1.0 | 为当前组件添加对比度效果,入参为对比度的值,值为1时,显示原图;大于1时,值越大对比度越高,图像越清晰醒目;小于1时,值越小对比度越低;当对比度为0时,图像变为全灰。(百分比)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| invert | number | 0 | 反转输入的图像。入参为图像反转的比例。值为1时完全反转。值为0则图像无变化。(百分比)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| sepia | number | 0 | 将图像转换为深褐色。入参为图像反转的比例。值为1则完全是深褐色的,值为0图像无变化。&nbsp;(百分比)<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| hueRotate | number&nbsp;\|&nbsp;string | '0deg' | 色相旋转效果,输入参数为旋转角度。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| colorBlend&nbsp;<sup>8+</sup> | [Color](ts-appendix-enums.md#color)&nbsp;\|&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | - | 为当前组件添加颜色叠加效果,入参为叠加的颜色。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -10,9 +10,9 @@
## 属性
| 名称 | 参数说明 | 描述 |
| --------------- | ------ | ---------------------------------------- |
| aspectRatio | number | 指定当前组件的宽高比,aspectRatio = width/height。 |
| displayPriority | number | 设置当前组件在布局容器中显示的优先级,当父容器空间不足时,低优先级的组件会被隐藏。<br/>小数点后的数字不作优先级区分,即区间为[x, x + 1)内的数字视为相同优先级。例如:1.0与1.9为同一优先级<br/>**说明:**<br/>仅在Row/Column/Flex(单行)容器组件中生效。 |
| --------------- | -------- | ------------------------------------------------------------ |
| aspectRatio | number | 指定当前组件的宽高比,aspectRatio = width/height。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| displayPriority | number | 设置当前组件在布局容器中显示的优先级,当父容器空间不足时,低优先级的组件会被隐藏。<br/>小数点后的数字不作优先级区分,即区间为[x, x + 1)内的数字视为相同优先级。例如:1.0与1.9为同一优先级。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用<br/>**说明:**<br/>仅在Row/Column/Flex(单行)容器组件中生效。 |
## 示例
......
......@@ -12,12 +12,12 @@
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| align | [Alignment](ts-appendix-enums.md#alignment) | 设置元素内容在元素绘制区域内的对齐方式。<br/>默认值:Alignment.Center |
| direction | [Direction](ts-appendix-enums.md#direction) | 设置元素水平方向的布局。<br/>默认值:Direction.Auto |
| position | [Position](ts-types.md#position8) | 绝对定位,设置元素左上角相对于父容器左上角偏移位置。在布局容器中,设置该属性不影响父容器布局,仅在绘制时进行位置调整。 |
| markAnchor | [Position](ts-types.md#position8) | 设置元素在位置定位时的锚点,以元素左上角作为基准点进行偏移。通常配合position和offset属性使用,单独使用时,效果类似offset<br/>默认值:<br/>{<br/>x: 0,<br/>y: 0<br/>} |
| offset | [Position](ts-types.md#position8) | 相对定位,设置元素相对于自身的偏移量。设置该属性,不影响父容器布局,仅在绘制时进行位置调整。<br/>默认值:<br/>{<br/>x: 0,<br/>y: 0<br/>} |
| alignRules<sup>9+</sup> | {<br/>left?: { anchor: string, align: [HorizontalAlign](ts-appendix-enums.md#horizontalalign) };<br/>right?: { anchor: string, align: [HorizontalAlign](ts-appendix-enums.md#horizontalalign) };<br/>middle?: { anchor: string, align: [HorizontalAlign](ts-appendix-enums.md#horizontalalign) };<br/>top?: { anchor: string, align: [VerticalAlign](ts-appendix-enums.md#verticalalign) };<br/>bottom?: { anchor: string, align: [VerticalAlign](ts-appendix-enums.md#verticalalign) };<br/>center?: { anchor: string, align: [VerticalAlign](ts-appendix-enums.md#verticalalign) }<br/>} | 指定相对容器的对齐规则。<br/>-&nbsp;left:设置左对齐参数。<br/>-&nbsp;right:设置右对齐参数。<br/>-&nbsp;middle:设置中间对齐的参数。<br/>-&nbsp;top:设置顶部对齐的参数。<br/>-&nbsp;bottom:设置底部对齐的参数。<br/>-&nbsp;center:设置中心对齐的参数。<br/>**说明:**<br/>-&nbsp;anchor:设置作为锚点的组件的id值。<br>-&nbsp;align:设置相对于锚点组件的对齐方式。 |
| align | [Alignment](ts-appendix-enums.md#alignment) | 设置元素内容在元素绘制区域内的对齐方式。<br/>默认值:Alignment.Center<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| direction | [Direction](ts-appendix-enums.md#direction) | 设置元素水平方向的布局。<br/>默认值:Direction.Auto<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| position | [Position](ts-types.md#position8) | 绝对定位,设置元素左上角相对于父容器左上角偏移位置。在布局容器中,设置该属性不影响父容器布局,仅在绘制时进行位置调整。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| markAnchor | [Position](ts-types.md#position8) | 设置元素在位置定位时的锚点,以元素左上角作为基准点进行偏移。通常配合position和offset属性使用,单独使用时,效果类似offset<br/>默认值:<br/>{<br/>x: 0,<br/>y: 0<br/>}<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| offset | [Position](ts-types.md#position8) | 相对定位,设置元素相对于自身的偏移量。设置该属性,不影响父容器布局,仅在绘制时进行位置调整。<br/>默认值:<br/>{<br/>x: 0,<br/>y: 0<br/>}<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| alignRules<sup>9+</sup> | {<br/>left?: { anchor: string, align: [HorizontalAlign](ts-appendix-enums.md#horizontalalign) };<br/>right?: { anchor: string, align: [HorizontalAlign](ts-appendix-enums.md#horizontalalign) };<br/>middle?: { anchor: string, align: [HorizontalAlign](ts-appendix-enums.md#horizontalalign) };<br/>top?: { anchor: string, align: [VerticalAlign](ts-appendix-enums.md#verticalalign) };<br/>bottom?: { anchor: string, align: [VerticalAlign](ts-appendix-enums.md#verticalalign) };<br/>center?: { anchor: string, align: [VerticalAlign](ts-appendix-enums.md#verticalalign) }<br/>} | 指定相对容器的对齐规则。<br/>-&nbsp;left:设置左对齐参数。<br/>-&nbsp;right:设置右对齐参数。<br/>-&nbsp;middle:设置中间对齐的参数。<br/>-&nbsp;top:设置顶部对齐的参数。<br/>-&nbsp;bottom:设置底部对齐的参数。<br/>-&nbsp;center:设置中心对齐的参数。<br/>该接口支持在ArkTS卡片中使用。<br/>**说明:**<br/>-&nbsp;anchor:设置作为锚点的组件的id值。<br>-&nbsp;align:设置相对于锚点组件的对齐方式。 |
## 示例
......
......@@ -12,7 +12,7 @@
| 名称 | 参数类型 | 描述 |
| ------- | ---------------------------------------- | ---------------------------------------- |
| opacity | number&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 元素的不透明度,取值范围为0到1,1表示不透明,0表示完全透明, 达到隐藏组件效果,但是在布局中占位。<br>**说明:**<br/>子组件可以继承父组件的此属性。默认值:1 |
| opacity | number&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 元素的不透明度,取值范围为0到1,1表示不透明,0表示完全透明, 达到隐藏组件效果,但是在布局中占位。<br>**说明:**<br/>子组件可以继承父组件的此属性。默认值:1<br>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -10,7 +10,7 @@
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| overlay | value:&nbsp;string,<br/>options?:&nbsp;{<br/>align?:&nbsp;[Alignment](ts-appendix-enums.md#alignment),&nbsp;<br/>offset?:&nbsp;{x?:&nbsp;number, y?:&nbsp;number}<br/>} | {<br/>align:&nbsp;Alignment.Center,<br/>offset:&nbsp;{0,&nbsp;0}<br/>} | 在当前组件上,增加遮罩文本。<br/> value: 遮罩文本内容。<br/>options: 文本定位,align设置文本相对于组件的方位,[offset](ts-universal-attributes-location.md)为文本基于自身左上角的偏移量。文本默认处于组件左上角。<br>两者都设置时效果重叠,文本相对于组件方位定位后再基于当前位置文本的左上角进行偏移。 |
| overlay | value:&nbsp;string,<br/>options?:&nbsp;{<br/>align?:&nbsp;[Alignment](ts-appendix-enums.md#alignment),&nbsp;<br/>offset?:&nbsp;{x?:&nbsp;number, y?:&nbsp;number}<br/>} | {<br/>align:&nbsp;Alignment.Center,<br/>offset:&nbsp;{0,&nbsp;0}<br/>} | 在当前组件上,增加遮罩文本。<br/> value: 遮罩文本内容。<br/>options: 文本定位,align设置文本相对于组件的方位,[offset](ts-universal-attributes-location.md)为文本基于自身左上角的偏移量。文本默认处于组件左上角。<br>两者都设置时效果重叠,文本相对于组件方位定位后再基于当前位置文本的左上角进行偏移。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -11,10 +11,12 @@
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| stateStyles | StateStyles | 设置组件不同状态的样式。 |
| stateStyles | StateStyles | 设置组件不同状态的样式。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## StateStyles接口说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 类型 | 必填 | 描述 |
| -------- | -------- | -------- | -------- |
| normal | ()=&gt;void | 否 | 组件无状态时的样式。 |
......
......@@ -12,8 +12,8 @@
| 名称 | 参数类型 | 描述 |
| -----| ------------------------------------------ | ------------------------------------ |
| clip | [Circle](ts-drawing-components-circle.md)&nbsp;\|&nbsp;[Ellipse](ts-drawing-components-ellipse.md)&nbsp;\|&nbsp;[Path](ts-drawing-components-path.md)&nbsp;\|&nbsp;[Rect](ts-drawing-components-rect.md)&nbsp;\|&nbsp;boolean | 参数为相应类型的组件,按指定的形状对当前组件进行裁剪;参数为boolean类型时,设置是否按照父容器边缘轮廓进行裁剪。<br>默认值:false |
| mask | [Circle](ts-drawing-components-circle.md)&nbsp;\|&nbsp;[Ellipse](ts-drawing-components-ellipse.md)&nbsp;\|&nbsp;[Path](ts-drawing-components-path.md)&nbsp;\|&nbsp;[Rect](ts-drawing-components-rect.md)&nbsp;| 在当前组件上加上指定形状的遮罩。 |
| clip | [Circle](ts-drawing-components-circle.md)&nbsp;\|&nbsp;[Ellipse](ts-drawing-components-ellipse.md)&nbsp;\|&nbsp;[Path](ts-drawing-components-path.md)&nbsp;\|&nbsp;[Rect](ts-drawing-components-rect.md)&nbsp;\|&nbsp;boolean | 参数为相应类型的组件,按指定的形状对当前组件进行裁剪;参数为boolean类型时,设置是否按照父容器边缘轮廓进行裁剪。<br>默认值:false<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| mask | [Circle](ts-drawing-components-circle.md)&nbsp;\|&nbsp;[Ellipse](ts-drawing-components-ellipse.md)&nbsp;\|&nbsp;[Path](ts-drawing-components-path.md)&nbsp;\|&nbsp;[Rect](ts-drawing-components-rect.md)&nbsp;| 在当前组件上加上指定形状的遮罩。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -11,14 +11,14 @@
| 名称 | 参数说明 | 描述 |
| -------------- | ---------------------------------------- | ---------------------------------------- |
| width | [Length](ts-types.md#length) | 设置组件自身的宽度,缺省时使用元素自身内容需要的宽度。若子组件的宽大于父组件的宽,则会画出父组件的范围。 |
| height | [Length](ts-types.md#length) | 设置组件自身的高度,缺省时使用元素自身内容需要的高度。若子组件的高大于父组件的高,则会画出父组件的范围。 |
| size | {<br/>width?:&nbsp;[Length](ts-types.md#length),<br/>height?:&nbsp;[Length](ts-types.md#length)<br/>} | 设置高宽尺寸。 |
| padding | [Padding](ts-types.md#padding)&nbsp;\|&nbsp;[Length](ts-types.md#length) | 设置内边距属性。<br/>参数为Length类型时,四个方向内边距同时生效。<br>默认值:0 <br>padding设置百分比时,上下左右内边距均以父容器的width作为基础值。 |
| margin | [Margin](ts-types.md#margin)&nbsp;\|&nbsp;[Length](ts-types.md#length) | 设置外边距属性。<br/>参数为Length类型时,四个方向外边距同时生效。<br>默认值:0 <br>margin设置百分比时,上下左右外边距均以父容器的width作为基础值。|
| constraintSize | {<br/>minWidth?:&nbsp;[Length](ts-types.md#length),<br/>maxWidth?:&nbsp;[Length](ts-types.md#length),<br/>minHeight?:&nbsp;[Length](ts-types.md#length),<br/>maxHeight?:&nbsp;[Length](ts-types.md#length)<br/>} | 设置约束尺寸,组件布局时,进行尺寸范围限制。constraintSize的优先级高于Width和Height。若设置的minWidth大于maxWidth,则minWidth生效,minHeight与maxHeight同理。<br>默认值:<br>{<br/>minWidth:&nbsp;0,<br/>maxWidth:&nbsp;Infinity,<br/>minHeight:&nbsp;0,<br/>maxHeight:&nbsp;Infinity<br/>} |
| layoutWeight | number&nbsp;\|&nbsp;string | 父容器尺寸确定时,设置了layoutWeight属性的子元素与兄弟元素占主轴尺寸按照权重进行分配,忽略元素本身尺寸设置,表示自适应占满剩余空间。<br>**说明:**<br/>仅在Row/Column/Flex布局中生效。|
| -------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| width | [Length](ts-types.md#length) | 设置组件自身的宽度,缺省时使用元素自身内容需要的宽度。若子组件的宽大于父组件的宽,则会画出父组件的范围。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| height | [Length](ts-types.md#length) | 设置组件自身的高度,缺省时使用元素自身内容需要的高度。若子组件的高大于父组件的高,则会画出父组件的范围。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| size | {<br/>width?:&nbsp;[Length](ts-types.md#length),<br/>height?:&nbsp;[Length](ts-types.md#length)<br/>} | 设置高宽尺寸。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| padding | [Padding](ts-types.md#padding)&nbsp;\|&nbsp;[Length](ts-types.md#length) | 设置内边距属性。<br/>参数为Length类型时,四个方向内边距同时生效。<br>默认值:0 <br>padding设置百分比时,上下左右内边距均以父容器的width作为基础值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| margin | [Margin](ts-types.md#margin)&nbsp;\|&nbsp;[Length](ts-types.md#length) | 设置外边距属性。<br/>参数为Length类型时,四个方向外边距同时生效。<br>默认值:0 <br>margin设置百分比时,上下左右外边距均以父容器的width作为基础值。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| constraintSize | {<br/>minWidth?:&nbsp;[Length](ts-types.md#length),<br/>maxWidth?:&nbsp;[Length](ts-types.md#length),<br/>minHeight?:&nbsp;[Length](ts-types.md#length),<br/>maxHeight?:&nbsp;[Length](ts-types.md#length)<br/>} | 设置约束尺寸,组件布局时,进行尺寸范围限制。constraintSize的优先级高于Width和Height。若设置的minWidth大于maxWidth,则minWidth生效,minHeight与maxHeight同理。<br>默认值:<br>{<br/>minWidth:&nbsp;0,<br/>maxWidth:&nbsp;Infinity,<br/>minHeight:&nbsp;0,<br/>maxHeight:&nbsp;Infinity<br/>}<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| layoutWeight | number&nbsp;\|&nbsp;string | 父容器尺寸确定时,设置了layoutWeight属性的子元素与兄弟元素占主轴尺寸按照权重进行分配,忽略元素本身尺寸设置,表示自适应占满剩余空间。<br>**说明:**<br/>仅在Row/Column/Flex布局中生效。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -12,11 +12,14 @@
| 名称 | 参数类型 | 描述 |
| -------------- | --------------------------------------------- | ----------------------------------------- |
| responseRegion | Array&lt;[Rectangle](#rectangle对象说明)&gt;&nbsp;\|&nbsp;[Rectangle](#rectangle对象说明) | 设置一个或多个触摸热区,包括位置和大小。<br/>默认触摸热区为整个组件,默认值:<br/>{<br/>x:0,<br/>y:0,<br/>width:'100%',<br/>height:'100%'<br/>} |
| -------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| responseRegion | Array&lt;[Rectangle](#rectangle对象说明)&gt;&nbsp;\|&nbsp;[Rectangle](#rectangle对象说明) | 设置一个或多个触摸热区,包括位置和大小。<br/>默认触摸热区为整个组件,默认值:<br/>{<br/>x:0,<br/>y:0,<br/>width:'100%',<br/>height:'100%'<br/>}<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## Rectangle对象说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 类型 | 必填 | 描述 |
| ------ | ----------------------------- | -----| -------------------------------- |
| x | [Length](ts-types.md#length) | 否 | 触摸点相对于组件左上角的x轴坐标。<br/>默认值:0vp |
......
......@@ -11,9 +11,9 @@
| 名称 | 参数类型 | 描述 |
| --------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| rotate | {<br/>x?:&nbsp;number,<br/>y?:&nbsp;number,<br/>z?:&nbsp;number,<br/>angle?:&nbsp;number&nbsp;\|&nbsp;string,<br/>centerX?:&nbsp;number \| string,<br/>centerY?:&nbsp;number \| string<br/>} | (x,&nbsp;y,&nbsp;z)指定一个矢量,表示旋转轴,正角度为顺时针转动,负角度为逆时针转动,默认值为0,同时可以通过centerX和centerY设置旋转的中心点。<br>默认值:<br>{<br/>x:&nbsp;0,<br/>y:&nbsp;0,<br/>z:&nbsp;0,<br/>angle:&nbsp;0,<br/>centerX:&nbsp;'50%',<br/>centerY:&nbsp;'50%'<br/>} |
| translate | {<br/>x?:&nbsp;number \| string,<br/>y?:&nbsp;number \| string,<br/>z?&nbsp;:&nbsp;number \| string<br/>} | 可以分别设置X轴、Y轴、Z轴的平移距离,距离的正负控制平移的方向。不支持百分比形式的输入。<br>默认值:<br>{<br/>x:&nbsp;0,<br/>y:&nbsp;0,<br/>z:&nbsp;0<br/>} |
| scale | {<br/>x?:&nbsp;number,<br/>y?:&nbsp;number,<br/>z?:&nbsp;number,<br/>centerX?:&nbsp;number \| string,<br/>centerY?:&nbsp;number \| string<br/>} | 可以分别设置X轴、Y轴、Z轴的缩放比例,默认值为1,同时可以通过centerX和centerY设置缩放的中心点。<br>默认值:<br>{<br/>x:&nbsp;1,<br/>y:&nbsp;1,<br/>z:&nbsp;1,<br/>centerX:'50%',<br/>centerY:'50%'<br/>} |
| rotate | {<br/>x?:&nbsp;number,<br/>y?:&nbsp;number,<br/>z?:&nbsp;number,<br/>angle?:&nbsp;number&nbsp;\|&nbsp;string,<br/>centerX?:&nbsp;number \| string,<br/>centerY?:&nbsp;number \| string<br/>} | (x,&nbsp;y,&nbsp;z)指定一个矢量,表示旋转轴,正角度为顺时针转动,负角度为逆时针转动,默认值为0,同时可以通过centerX和centerY设置旋转的中心点。<br>默认值:<br>{<br/>x:&nbsp;0,<br/>y:&nbsp;0,<br/>z:&nbsp;0,<br/>angle:&nbsp;0,<br/>centerX:&nbsp;'50%',<br/>centerY:&nbsp;'50%'<br/>}<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| translate | {<br/>x?:&nbsp;number \| string,<br/>y?:&nbsp;number \| string,<br/>z?&nbsp;:&nbsp;number \| string<br/>} | 可以分别设置X轴、Y轴、Z轴的平移距离,距离的正负控制平移的方向。不支持百分比形式的输入。<br>默认值:<br>{<br/>x:&nbsp;0,<br/>y:&nbsp;0,<br/>z:&nbsp;0<br/>}<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| scale | {<br/>x?:&nbsp;number,<br/>y?:&nbsp;number,<br/>z?:&nbsp;number,<br/>centerX?:&nbsp;number \| string,<br/>centerY?:&nbsp;number \| string<br/>} | 可以分别设置X轴、Y轴、Z轴的缩放比例,默认值为1,同时可以通过centerX和centerY设置缩放的中心点。<br>默认值:<br>{<br/>x:&nbsp;1,<br/>y:&nbsp;1,<br/>z:&nbsp;1,<br/>centerX:'50%',<br/>centerY:'50%'<br/>}<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| transform | [Matrix4Transit](../apis/js-apis-matrix4.md) | 设置当前组件的变换矩阵。 |
......
......@@ -10,7 +10,7 @@
| 名称 | 参数类型 | 描述 |
| ---------- | ---------------------------- | ------------------------------------------ |
| visibility | [Visibility](ts-appendix-enums.md#visibility) | 控制当前组件显示或隐藏。注意,即使组件处于隐藏状态,在页面刷新时仍存在重新创建过程,因此当对性能有严格要求时建议使用[条件渲染](../../quick-start/arkts-rendering-control.md#条件渲染)代替。<br>默认值:Visibility.Visible|
| visibility | [Visibility](ts-appendix-enums.md#visibility) | 控制当前组件显示或隐藏。注意,即使组件处于隐藏状态,在页面刷新时仍存在重新创建过程,因此当对性能有严格要求时建议使用[条件渲染](../../quick-start/arkts-rendering-control.md#条件渲染)代替。<br>默认值:Visibility.Visible<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -12,7 +12,7 @@
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| zIndex | number | 同一容器中兄弟组件显示层级关系。zIndex值越大,显示层级越高,即zIndex值大的组件会覆盖在zIndex值小的组件上方。 |
| zIndex | number | 同一容器中兄弟组件显示层级关系。zIndex值越大,显示层级越高,即zIndex值大的组件会覆盖在zIndex值小的组件上方。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -11,9 +11,12 @@
| 名称 | 支持冒泡 | 功能描述 |
| ---------------------------------------- | ---- | --------------------------------- |
| onClick(event:&nbsp;(event?:&nbsp;ClickEvent)&nbsp;=&gt;&nbsp;void) | 否 | 点击动作触发该回调,event返回值见ClickEvent对象说明。 |
| onClick(event:&nbsp;(event?:&nbsp;ClickEvent)&nbsp;=&gt;&nbsp;void) | 否 | 点击动作触发该回调,event返回值见ClickEvent对象说明。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## ClickEvent对象说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 类型 | 描述 |
| ------------------- | ------------------------------------ | -------------------------------------------------------- |
| screenX | number | 点击位置相对于应用窗口左上角的X坐标。 |
......@@ -26,6 +29,8 @@
## EventTarget<sup>8+</sup>对象说明
从API version 9开始,该接口支持在ArkTS卡片中使用。
| 名称 | 参数类型 | 描述 |
| ---- | ------------------------- | ---------- |
| area | [Area](ts-types.md#area8) | 目标元素的区域信息。 |
......
......@@ -10,9 +10,9 @@
## 事件
| 名称 | 支持冒泡 | 功能描述 |
| ------------------------------------------------ | -------- | -------------------------- |
| onAppear(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 否 | 组件挂载显示时触发此回调。 |
| onDisAppear(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 否 | 组件卸载消失时触发此回调。 |
| ------------------------------------------------ | -------- | ------------------------------------------------------------ |
| onAppear(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 否 | 组件挂载显示时触发此回调。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
| onDisAppear(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 否 | 组件卸载消失时触发此回调。<br/>从API version 9开始,该接口支持在ArkTS卡片中使用。 |
## 示例
......
......@@ -15,12 +15,16 @@ aboutToAppear?(): void
aboutToAppear函数在创建自定义组件的新实例后,在执行其build函数之前执行。允许在aboutToAppear函数中改变状态变量,更改将在后续执行build函数中生效。
从API version 9开始,该接口支持在ArkTS卡片中使用。
## aboutToDisappear
aboutToDisappear?(): void
aboutToDisappear函数在自定义组件析构销毁之前执行。不允许在aboutToDisappear函数中改变状态变量,特别是@Link变量的修改可能会导致应用程序行为不稳定。
从API version 9开始,该接口支持在ArkTS卡片中使用。
**示例1:**
```ts
......@@ -122,6 +126,8 @@ onLayout?(children: Array\<LayoutChild\>, constraint: ConstraintSizeOptions): vo
框架会在自定义组件布局时,将该自定义组件的子节点信息和自身的尺寸范围通过onLayout传递给该自定义组件。不允许在onLayout函数中改变状态变量。
该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 类型 | 说明 |
......@@ -135,6 +141,8 @@ onMeasure?(children: Array\<LayoutChild\>, constraint: ConstraintSizeOptions): v
框架会在自定义组件确定尺寸时,将该自定义组件的子节点信息和自身的尺寸范围通过onMeasure传递给该自定义组件。不允许在onMeasure函数中改变状态变量。
该接口支持在ArkTS卡片中使用。
**参数:**
| 参数名 | 类型 | 说明 |
......@@ -146,6 +154,8 @@ onMeasure?(children: Array\<LayoutChild\>, constraint: ConstraintSizeOptions): v
子组件布局信息。
该接口支持在ArkTS卡片中使用。
| 参数 | 参数类型 | 描述 |
| ---------- | ----------------------------------------------------------------------------------------------------------- | -------------------------------------- |
| name | string | 子组件名称。 |
......@@ -160,6 +170,8 @@ onMeasure?(children: Array\<LayoutChild\>, constraint: ConstraintSizeOptions): v
子组件border信息。
该接口支持在ArkTS卡片中使用。
| 参数 | 参数类型 | 描述 |
| ----------- | ---------------------------------------------------------- | ---------------------------------------------- |
| borderWidth | [EdgeWidths](../reference/arkui-ts/ts-types.md#edgewidths) | 边框宽度类型,用于描述组件边框不同方向的宽度。 |
......@@ -170,6 +182,8 @@ onMeasure?(children: Array\<LayoutChild\>, constraint: ConstraintSizeOptions): v
子组件layout信息。
该接口支持在ArkTS卡片中使用。
| 参数 | 参数类型 | 描述 |
| ---------- | -------------------------------------------------------------------------------- | ---------------- |
| position | [Position](../reference/arkui-ts/ts-types.md#position) | 子组件位置坐标。 |
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册