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

!9705 arkui ts文档格式整改1

Merge pull request !9705 from LiAn/master
......@@ -6,15 +6,13 @@
>
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 属性
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| backgroundColor | [ResourceColor](ts-types.md) | 设置组件的背景色。 |
| backgroundImage | -&nbsp;src:&nbsp;[ResourceStr](ts-types.md),<br/>-&nbsp;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 |
| 名称 | 参数类型 | 描述 |
| ----------------------- | ---------------------------------------- | ---------------------------------------- |
| backgroundColor | [ResourceColor](ts-types.md#resourcecolor8) | 设置组件的背景色。 |
| backgroundImage | -&nbsp;src:&nbsp;[ResourceStr](ts-types.md#resourcestr8),<br/>-&nbsp;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 | {<br/>x?:&nbsp;[Length](ts-types.md#length),<br/>y?:&nbsp;[Length](ts-types.md#length)<br/>}&nbsp;\|&nbsp;[Alignment](ts-appendix-enums.md#alignment) | 设置背景图在组件中显示位置。<br/>默认值:<br/>{<br/>x:&nbsp;0,<br/>y:&nbsp;0<br/>} |
......
......@@ -4,41 +4,38 @@
> **说明:**
>
> 从API Version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
> 从API Version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 属性
| 名称 | 参数类型 | 描述 |
| ---------- | ---------------------------------------- | --------------------------------------- |
| source | string \| [Resource](ts-types.md#resource) \| [linearGradient](ts-universal-attributes-gradient-color.md) | 边框图源或者渐变色设置。 |
| slice | [Length](ts-types.md#length)\| EdgeWidth | 设置图片边框切割宽度。<br/>默认值:0 |
| width | [Length](ts-types.md#length)\| EdgeWidth | 设置图片边框宽度。<br/>默认值:0 |
| outset | [Length](ts-types.md#length)\| EdgeWidth | 设置边框图片向外延伸距离。<br/>默认值:0 |
| RepeatMode | RepeatMode | 设置边框图片的重复方式。<br/>默认值:RepeatMode.Stretch |
| fill | boolean | 设置边框图片中心填充。<br/>默认值:false |
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| source | string \| [Resource](ts-types.md#resource类型) \| [linearGradient](ts-universal-attributes-gradient-color.md) | 边框图源或者渐变色设置。 |
| slice | [Length](ts-types.md#length)\| EdgeWidth | 设置图片边框切割宽度。<br/>默认值:0 |
| width | [Length](ts-types.md#length)\| EdgeWidth | 设置图片边框宽度。<br/>默认值:0 |
| outset | [Length](ts-types.md#length)\| EdgeWidth | 设置边框图片向外延伸距离。<br/>默认值:0 |
| RepeatMode | RepeatMode | 设置边框图片的重复方式。<br/>默认值:RepeatMode.Stretch |
| fill | boolean | 设置边框图片中心填充。<br/>默认值:false |
## EdgeWidth枚举说明
引用该对象时,至少传入一个参数。
| 名称 | 参数类型 | 必填 |描述 |
| -------- | -------- |-------- |-------- |
| left | [Length](ts-types.md#length) | 否 | 左侧距离参数。 |
| right | [Length](ts-types.md#length) | 否 | 右侧距离参数。 |
| top | [Length](ts-types.md#length) | 否 | 上侧距离参数。 |
| bottom | [Length](ts-types.md#length) | 否 | 下侧距离参数。 |
| 名称 | 参数类型 | 必填 | 描述 |
| ------ | ---------------------------- | ---- | ------- |
| left | [Length](ts-types.md#length) | 否 | 左侧距离参数。 |
| right | [Length](ts-types.md#length) | 否 | 右侧距离参数。 |
| top | [Length](ts-types.md#length) | 否 | 上侧距离参数。 |
| bottom | [Length](ts-types.md#length) | 否 | 下侧距离参数。 |
## RepeatMode枚举说明
| 名称 | 描述 |
| -------- | -------- |
| Repeat | 被切割图片重复铺平在图片边框上,超出的部分会被剪裁。|
| Stretch | 被切割图片以拉伸填充的方式铺满图片边框。 |
| Round | 被切割图片以整数次平铺在图片边框上,无法以整数次平铺时压缩被切割图片。 |
| Space | 被切割图片以整数次平铺在图片边框上,无法以整数次平铺时以空白填充。 |
| 名称 | 描述 |
| ------- | ----------------------------------- |
| Repeat | 被切割图片重复铺平在图片边框上,超出的部分会被剪裁。 |
| Stretch | 被切割图片以拉伸填充的方式铺满图片边框。 |
| Round | 被切割图片以整数次平铺在图片边框上,无法以整数次平铺时压缩被切割图片。 |
| Space | 被切割图片以整数次平铺在图片边框上,无法以整数次平铺时以空白填充。 |
## 示例
......
......@@ -12,57 +12,57 @@
## 属性
| 名称 | 参数类型 | 描述 |
| ------------ | ------------------------------------------------------------ | ------------------------------------------------------------ |
| border | {<br/>width?:&nbsp;[Length](ts-types.md#长度类型)&nbsp;\|&nbsp;EdgeWidth<sup>9+</sup>,<br/>color?: &nbsp;[ResourceColor](ts-types.md)&nbsp;\|&nbsp;EdgeColor<sup>9+</sup>,<br/>radius?: &nbsp;[Length](ts-types.md#长度类型)&nbsp;\|&nbsp;BorderRadiuses<sup>9+</sup>,<br/>style?:&nbsp;[BorderStyle](ts-appendix-enums.md#borderstyle)&nbsp;\|&nbsp;EdgeStyle<sup>9+</sup><br/>} | 统一边框样式设置接口。<br/>-&nbsp;width:设置边框宽度。<br/>-&nbsp;color:设置边框颜色。<br/>-&nbsp;radius:设置边框圆角半径。<br/>-&nbsp;style:设置边框样式。 |
| borderStyle | [BorderStyle](ts-appendix-enums.md#borderstyle) \| EdgeStyle<sup>9+</sup> | 设置元素的边框样式。<br/>默认值:BorderStyle.Solid |
| borderWidth | [Length](ts-types.md) \| EdgeWidth<sup>9+</sup> | 设置元素的边框宽度。 |
| borderColor | [ResourceColor](ts-types.md) \| EdgeColor<sup>9+</sup> | 设置元素的边框颜色。 |
| borderRadius | [Length](ts-types.md) \| BorderRadiuses<sup>9+</sup> | 设置元素的边框圆角半径。 |
| 名称 | 参数类型 | 描述 |
| ------------ | ---------------------------------------- | ---------------------------------------- |
| border | {<br/>width?:&nbsp;[Length](ts-types.md#length)&nbsp;\|&nbsp;EdgeWidth<sup>9+</sup>,<br/>color?: &nbsp;[ResourceColor](ts-types.md#resourcecolor8)&nbsp;\|&nbsp;EdgeColor<sup>9+</sup>,<br/>radius?: &nbsp;[Length](ts-types.md#length)&nbsp;\|&nbsp;BorderRadiuses<sup>9+</sup>,<br/>style?:&nbsp;[BorderStyle](ts-appendix-enums.md#borderstyle)&nbsp;\|&nbsp;EdgeStyle<sup>9+</sup><br/>} | 统一边框样式设置接口。<br/>-&nbsp;width:设置边框宽度。<br/>-&nbsp;color:设置边框颜色。<br/>-&nbsp;radius:设置边框圆角半径。<br/>-&nbsp;style:设置边框样式。 |
| borderStyle | [BorderStyle](ts-appendix-enums.md#borderstyle) \| EdgeStyle<sup>9+</sup> | 设置元素的边框样式。<br/>默认值:BorderStyle.Solid |
| borderWidth | [Length](ts-types.md#length) \| EdgeWidth<sup>9+</sup> | 设置元素的边框宽度。 |
| borderColor | [ResourceColor](ts-types.md#resourcecolor8) \| EdgeColor<sup>9+</sup> | 设置元素的边框颜色。 |
| borderRadius | [Length](ts-types.md#length) \| BorderRadiuses<sup>9+</sup> | 设置元素的边框圆角半径。 |
## EdgeWidth<sup>9+</sup>对象说明
引入该对象时,至少传入一个参数。
| 名称 | 参数类型 | 必填 | 描述 |
| ------ | ------------------------------------- | ---- | -------------- |
| left | [Length](ts-types.md#length) | 否 | 左侧边框宽度。 |
| right | [Length](ts-types.md#length) | 否 | 右侧边框宽度。 |
| top | [Length](ts-types.md#length) | 否 | 上侧边框宽度。 |
| bottom | [Length](ts-types.md#length) | 否 | 下侧边框宽度。 |
| 名称 | 参数类型 | 必填 | 描述 |
| ------ | ---------------------------- | ---- | ------- |
| left | [Length](ts-types.md#length) | 否 | 左侧边框宽度。 |
| right | [Length](ts-types.md#length) | 否 | 右侧边框宽度。 |
| top | [Length](ts-types.md#length) | 否 | 上侧边框宽度。 |
| bottom | [Length](ts-types.md#length) | 否 | 下侧边框宽度。 |
## EdgeColor<sup>9+</sup>对象说明
引入该对象时,至少传入一个参数。
| 名称 | 参数类型 | 必填 | 描述 |
| ------ | ------------------------------------- | ---- | -------------- |
| left | [ResourceColor](ts-types.md) | 否 | 左侧边框颜色。 |
| right | [ResourceColor](ts-types.md) | 否 | 右侧边框颜色。 |
| top | [ResourceColor](ts-types.md) | 否 | 上侧边框颜色。 |
| bottom | [ResourceColor](ts-types.md) | 否 | 下侧边框颜色。 |
| 名称 | 参数类型 | 必填 | 描述 |
| ------ | ---------------------------------------- | ---- | ------- |
| left | [ResourceColor](ts-types.md#resourcecolor8) | 否 | 左侧边框颜色。 |
| right | [ResourceColor](ts-types.md#resourcecolor8) | 否 | 右侧边框颜色。 |
| top | [ResourceColor](ts-types.md#resourcecolor8) | 否 | 上侧边框颜色。 |
| bottom | [ResourceColor](ts-types.md#resourcecolor8) | 否 | 下侧边框颜色。 |
## BorderRadiuses<sup>9+</sup>对象说明
引用该对象时,至少传入一个参数。
| 名称 | 参数类型 | 必填 | 描述 |
| ----------- | ------------------------------------- | ---- | ---------------- |
| topLeft | [Length](ts-types.md#length) | 否 | 左上角圆角半径。 |
| topRight | [Length](ts-types.md#length) | 否 | 右上角圆角半径。 |
| bottomLeft | [Length](ts-types.md#length) | 否 | 左下角圆角半径。 |
| bottomRight | [Length](ts-types.md#length) | 否 | 右下角圆角半径。 |
| 名称 | 参数类型 | 必填 | 描述 |
| ----------- | ---------------------------- | ---- | -------- |
| topLeft | [Length](ts-types.md#length) | 否 | 左上角圆角半径。 |
| topRight | [Length](ts-types.md#length) | 否 | 右上角圆角半径。 |
| bottomLeft | [Length](ts-types.md#length) | 否 | 左下角圆角半径。 |
| bottomRight | [Length](ts-types.md#length) | 否 | 右下角圆角半径。 |
## EdgeStyle<sup>9+</sup>对象说明
引入该对象时,至少传入一个参数。
| 名称 | 参数类型 | 必填 | 描述 |
| ------ | ----------------------------------------------- | ---- | -------------- |
| left | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 左侧边框样式。 |
| right | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 右侧边框样式。 |
| top | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 上侧边框样式。 |
| bottom | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 下侧边框样式。 |
| 名称 | 参数类型 | 必填 | 描述 |
| ------ | ---------------------------------------- | ---- | ------- |
| left | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 左侧边框样式。 |
| right | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 右侧边框样式。 |
| top | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 上侧边框样式。 |
| bottom | [BorderStyle](ts-appendix-enums.md#borderstyle) | 否 | 下侧边框样式。 |
## 示例
......
# Flex布局
> **说明:**
> - 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
>
> - 仅当父组件是 Flex、Column、Row 时生效。
> - 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
>
> - 仅当父组件是 Flex、Column、Row 时生效。
## 属性
| 名称 | 参数说明 | 描述 |
| -------- | -------- | -------- |
| flexBasis | number \| string | 设置组件在父容器主轴方向上的基准尺寸。<br/>默认值:'auto'(表示组件在主轴方向上的基准尺寸为组件原本的大小) |
| flexGrow | number | 设置父容器的剩余空间分配给此属性所在组件的比例。<br/>默认值:0 |
| flexShrink | number | 设置父容器压缩尺寸分配给此属性所在组件的比例。<br/>默认值:1 |
| alignSelf | [ItemAlign](ts-appendix-enums.md#itemalign) | 子组件在父容器交叉轴的对齐格式,覆盖Flex布局容器中alignItems默认配置。<br/>默认值:ItemAlign.Auto |
| 名称 | 参数说明 | 描述 |
| ---------- | ---------------------------------------- | ---------------------------------------- |
| flexBasis | number \| string | 设置组件在父容器主轴方向上的基准尺寸。<br/>默认值:'auto'(表示组件在主轴方向上的基准尺寸为组件原本的大小) |
| flexGrow | number | 设置父容器的剩余空间分配给此属性所在组件的比例。<br/>默认值:0 |
| flexShrink | number | 设置父容器压缩尺寸分配给此属性所在组件的比例。<br/>默认值:1 |
| alignSelf | [ItemAlign](ts-appendix-enums.md#itemalign) | 子组件在父容器交叉轴的对齐格式,覆盖Flex布局容器中alignItems默认配置。<br/>默认值:ItemAlign.Auto |
## 示例
......
......@@ -3,21 +3,16 @@
通过组件的宽高比和显示优先级约束组件显示效果。
> **说明:**
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
>
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 属性
| 名称 | 参数说明 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| aspectRatio | number | - | 指定当前组件的宽高比。 |
| displayPriority | number | - | 设置当前组件在布局容器中显示的优先级,当父容器空间不足时,低优先级的组件会被隐藏。<br/>>&nbsp;&nbsp;**说明:**<br/>>&nbsp;仅在Row/Column/Flex(单行)容器组件中生效。 |
| 名称 | 参数说明 | 描述 |
| --------------- | ------ | ---------------------------------------- |
| aspectRatio | number | 指定当前组件的宽高比。 |
| displayPriority | number | 设置当前组件在布局容器中显示的优先级,当父容器空间不足时,低优先级的组件会被隐藏。<br/>**说明:**<br/>仅在Row/Column/Flex(单行)容器组件中生效。 |
## 示例
......
# 透明度设置
> **说明:**
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
设置组件的透明度。
## 权限列表
> **说明:**
>
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| opacity | number&nbsp;\|&nbsp;[Resource](ts-types.md#resource类型) | 1 | 元素的不透明度,取值范围为0到1,1表示为不透明,0表示为完全透明。 |
| 名称 | 参数类型 | 描述 |
| ------- | ---------------------------------------- | ---------------------------------------- |
| opacity | number&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 元素的不透明度,取值范围为0到1,1表示为不透明,0表示为完全透明。<br>默认值:1 |
## 示例
......
......@@ -10,15 +10,15 @@
## 属性
| 名称 | 参数说明 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| width | Length | - | 设置组件自身的宽度,缺省时使用元素自身内容需要的宽度。 |
| height | Length | - | 设置组件自身的高度,缺省时使用元素自身内容需要的高度。 |
| size | {<br/>width?:&nbsp;Length,<br/>height?:&nbsp;Length<br/>} | - | 设置高宽尺寸。 |
| padding | {<br/>top?:&nbsp;Length,<br/>right?:&nbsp;Length,<br/>bottom?:&nbsp;Length,<br/>left?:&nbsp;Length<br/>}&nbsp;\|&nbsp;Length | 0 | 设置内边距属性。<br/>参数为Length类型时,四个方向内边距同时生效。 |
| margin | {<br/>top?:&nbsp;Length,<br/>right?:&nbsp;Length,<br/>bottom?:&nbsp;Length,<br/>left?:&nbsp;Length<br/>}<br/>\|&nbsp;Length | 0 | 设置外边距属性。<br/>参数为Length类型时,四个方向外边距同时生效。 |
| constraintSize | {<br/>minWidth?:&nbsp;Length,<br/>maxWidth?:&nbsp;Length,<br/>minHeight?:&nbsp;Length,<br/>maxHeight?:&nbsp;Length<br/>} | {<br/>minWidth:&nbsp;0,<br/>maxWidth:&nbsp;Infinity,<br/>minHeight:&nbsp;0,<br/>maxHeight:&nbsp;Infinity<br/>} | 设置约束尺寸,组件布局时,进行尺寸范围限制。constraintSize的优先级高于Width和Height。 |
| layoutWeight | number&nbsp;\|&nbsp;string | 0 | 容器尺寸确定时,元素与兄弟节点主轴布局尺寸按照权重进行分配,忽略本身尺寸设置,表示自适应占满剩余空间。<br/>>&nbsp;&nbsp;**说明:**<br/>>&nbsp;仅在Row/Column/Flex布局中生效。 |
| 名称 | 参数说明 | 描述 |
| -------------- | ---------------------------------------- | ---------------------------------------- |
| 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 | {<br/>top?:&nbsp;[Length](ts-types.md#length),<br/>right?:&nbsp;[Length](ts-types.md#length),<br/>bottom?:&nbsp;[Length](ts-types.md#length),<br/>left?:&nbsp;[Length](ts-types.md#length)<br/>}&nbsp;\|&nbsp;[Length](ts-types.md#length) | 设置内边距属性。<br/>参数为Length类型时,四个方向内边距同时生效。<br>默认值:0 |
| margin | {<br/>top?:&nbsp;[Length](ts-types.md#length),<br/>right?:&nbsp;[Length](ts-types.md#length),<br/>bottom?:&nbsp;[Length](ts-types.md#length),<br/>left?:&nbsp;[Length](ts-types.md#length)<br/>}<br/>\|&nbsp;[Length](ts-types.md#length) | 设置外边距属性。<br/>参数为Length类型时,四个方向外边距同时生效。<br>默认值:0 |
| 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。<br>默认值:<br>{<br/>minWidth:&nbsp;0,<br/>maxWidth:&nbsp;Infinity,<br/>minHeight:&nbsp;0,<br/>maxHeight:&nbsp;Infinity<br/>} |
| layoutWeight | number&nbsp;\|&nbsp;string | 容器尺寸确定时,元素与兄弟节点主轴布局尺寸按照权重进行分配,忽略本身尺寸设置,表示自适应占满剩余空间。<br>**说明:**<br/>仅在Row/Column/Flex布局中生效。<br>默认值:0 |
## 示例
......
......@@ -3,14 +3,10 @@
组件区域变化事件指组件显示的尺寸、位置等发生变化时触发的事件。
> **说明:**
>
> 从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 事件
| 名称 | 支持冒泡 | 功能描述 |
......
......@@ -2,17 +2,15 @@
组件可见区域变化事件指组件在屏幕中显示的面积变化,提供了判断组件是否完全或部分显示在屏幕中的能力,通常适用于像广告曝光埋点之类的场景。
> **说明:** 从API Version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
> **说明:**
>
> 从API Version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 事件
| 名称 | 功能描述 |
| -------- | -------- |
| 名称 | 功能描述 |
| ---------------------------------------- | ---------------------------------------- |
| onVisibleAreaChange(ratios: Array\<number>, event: (isVisible: boolean, currentRatio: number) => void) | 组件可见区域变化时触发该回调。<br/>-ratios:阈值数组。其中,每个阈值代表组件可见面积(即组件在屏幕显示区的面积)与组件自身面积的比值。当组件可见面积与自身面积的比值大于或小于阈值时,均会触发该回调。每个阈值的取值范围为[0.0, 1.0],如果开发者设置的阈值超出该范围,则会实际取值0.0或1.0.<br/>-isVisible:表示组件的可见面积与自身面积的比值是否大于阈值,true表示大于,false表示小于。<br/>-currentRatio:触发回调时,组件可见面积与自身面积的比值。 |
......
......@@ -9,11 +9,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介绍。 |
## ClickEvent对象说明
| 属性名称 | 类型 | 描述 |
| ------------------- | -------------------------------- | ------------------- |
| screenX | number | 点击点相对于设备屏幕左边沿的X坐标。 |
......@@ -24,8 +25,9 @@
| timestamp | number | 事件时间戳。 |
## EventTarget<sup>8+</sup>对象说明
| 名称 | 参数类型 | 描述 |
| ---- | ----------------- | ---------- |
| 名称 | 参数类型 | 描述 |
| ---- | ------------------------- | ---------- |
| area | [Area](ts-types.md#area8) | 目标元素的区域信息。 |
......
......@@ -3,35 +3,41 @@
拖拽事件指被长按后拖拽时触发的事件。
> **说明:**
>
> 从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 事件
| 名称 | 支持冒泡 | 功能描述 |
| ---------------------------------------- | ---- | ---------------------------------------- |
| onDragStart(event:&nbsp;(event?:&nbsp;DragEvent,&nbsp;extraParams?:&nbsp;string)&nbsp;=&gt;&nbsp;&nbsp;[CustomBuilder](ts-types.md#custombuilder8)) \| DragItemInfo | 否 | 第一次拖拽此事件绑定的组件时,触发回调。<br/>- event:拖拽事件信息,包括拖拽点坐标。<br/>- extraParams:拖拽事件额外信息,详见extraParam类型描述。<br/>返回值:当前跟手效果所拖拽的对象,用于显示拖拽时的提示组件。<br/>长按150毫秒(ms)可触发拖拽事件。优先级:长按手势配置时间小于等于150毫秒(ms)时,长按手势优先触发,否则拖拽事件优先触发。 |
| onDragStart(event:&nbsp;(event?:&nbsp;DragEvent,&nbsp;extraParams?:&nbsp;string)<br>&nbsp;=&gt;&nbsp;&nbsp;[CustomBuilder](ts-types.md#custombuilder8)) \| DragItemInfo | 否 | 第一次拖拽此事件绑定的组件时,触发回调。<br/>- event:拖拽事件信息,包括拖拽点坐标。<br/>- extraParams:拖拽事件额外信息,详见extraParam类型描述。<br/>返回值:当前跟手效果所拖拽的对象,用于显示拖拽时的提示组件。<br/>长按150毫秒(ms)可触发拖拽事件。优先级:长按手势配置时间小于等于150毫秒(ms)时,长按手势优先触发,否则拖拽事件优先触发。 |
| onDragEnter(event:&nbsp;(event?:&nbsp;DragEvent,&nbsp;extraParams?:&nbsp;string)&nbsp;=&gt;&nbsp;void) | 否 | 拖拽进入组件范围内时,触发回调。<br/>- event:拖拽事件信息,包括拖拽点坐标。<br/>- extraParams:拖拽事件额外信息,详见extraParam类型描述。<br/>当监听了onDrop事件时,此事件才有效。 |
| onDragMove(event:&nbsp;(event?:&nbsp;DragEvent,&nbsp;extraParams?:&nbsp;string)&nbsp;=&gt;&nbsp;void) | 否 | 拖拽在组件范围内移动时,触发回调。<br/>- event:拖拽事件信息,包括拖拽点坐标。<br/>- extraParams:拖拽事件额外信息,详见extraParam类型描述。<br/>当监听了onDrop事件时,此事件才有效。 |
| onDragLeave(event:&nbsp;(event?:&nbsp;DragEvent,&nbsp;extraParams?:&nbsp;string)&nbsp;=&gt;&nbsp;void) | 否 | 拖拽离开组件范围内时,触发回调。<br/>- event:拖拽事件信息,包括拖拽点坐标。<br/>- extraParams:拖拽事件额外信息,详见extraParam类型描述。<br/>当监听了onDrop事件时,此事件才有效。 |
| onDrop(event:&nbsp;(event?:&nbsp;DragEvent,&nbsp;extraParams?:&nbsp;string)&nbsp;=&gt;&nbsp;void) | 否 | 绑定此事件的组件可作为拖拽释放目标,当在本组件范围内停止拖拽行为时,触发回调。<br/>- event:拖拽事件信息,包括拖拽点坐标。<br/>- extraParams:拖拽事件额外信息,详见extraParam类型描述。 |
## DragItemInfo说明
| 属性名称 | 属性类型 | 必填 | 描述 |
| ------------- | ------ | ------- |--------------------------------- |
| pixelMap | [PixelMap](../apis/js-apis-image.md#pixelmap7) | 否 | 设置拖拽过程中显示的图片。 |
| builder | [CustomBuilder](ts-types.md#custombuilder8) | 否 | 使用自定义生成器进行绘图,如果设置了pixelMap,则忽略此值。 |
| extraInfo | string | 否 | 拖拽项的描述。 |
| 属性名称 | 属性类型 | 必填 | 描述 |
| --------- | ---------------------------------------- | ---- | --------------------------------- |
| pixelMap | [PixelMap](../apis/js-apis-image.md#pixelmap7) | 否 | 设置拖拽过程中显示的图片。 |
| builder | [CustomBuilder](ts-types.md#custombuilder8) | 否 | 使用自定义生成器进行绘图,如果设置了pixelMap,则忽略此值。 |
| extraInfo | string | 否 | 拖拽项的描述。 |
## extraParam说明
用于返回组件在拖拽中需要用到的额外信息。
extraParam是Json对象转换的string字符串,可以通过Json.parse转换的Json对象获取如下属性。
| 属性名称 | 属性类型 | 描述 |
| ------------- | ------ | ---------------------------------------- |
| selectedIndex | number | 当拖拽事件设在父容器的子元素时,selectedIndex表示当前被拖拽子元素是父容器第selectedIndex个子元素,selectedIndex从0开始。<br/>仅在ListItem组件中生效。 |
| insertIndex | number | 当前拖拽元素在List组件中放下时,insertIndex表示被拖拽元素插入该组件的第insertIndex个位置,insertIndex从0开始。<br/>仅在List组件的拖拽事件中生效。 |
### DragEvent对象说明
| 属性名称 | 属性类型 | 描述 |
| ------------- | ------ | ---------------------------------------- |
| selectedIndex | number | 当拖拽事件设在父容器的子元素时,selectedIndex表示当前被拖拽子元素是父容器第selectedIndex个子元素,selectedIndex从0开始。<br/>仅在ListItem组件中生效。 |
| insertIndex | number | 当前拖拽元素在List组件中放下时,insertIndex表示被拖拽元素插入该组件的第insertIndex个位置,insertIndex从0开始。<br/>仅在List组件的拖拽事件中生效。 |
## DragEvent对象说明
| 名称 | 返回值类型 | 功能描述 |
| ------ | ------ | ---------------- |
| getX() | number | 当前拖拽点x轴坐标,单位为vp。 |
......
......@@ -3,14 +3,10 @@
按键事件指组件与键盘、遥控器等按键设备交互时触发的事件。
> **说明:**
>
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 事件
| 名称 | 支持冒泡 | 功能描述 |
......@@ -20,16 +16,16 @@
## KeyEvent对象说明
| 名称 | 类型 | 描述 |
| ------------------------------------- | --------------------------- | -------------------------- |
| type | [KeyType](ts-appendix-enums.md#keytype) | 按键的类型。 |
| [keyCode](../apis/js-apis-keycode.md) | number | 按键的键码。 |
| keyText | string | 按键的键值。 |
| keySource | [KeySource](ts-appendix-enums.md#keysource) | 触发当前按键的输入设备类型。 |
| deviceId | number | 触发当前按键的输入设备ID。 |
| metaKey | number | 按键发生时元键的状态,1表示按压态,0表示未按压态。 |
| timestamp | number | 按键发生时的时间戳。 |
| stopPropagation | () => void | 阻塞事件冒泡传递。 |
| 名称 | 类型 | 描述 |
| ------------------------------------- | ---------------------------------------- | -------------------------- |
| type | [KeyType](ts-appendix-enums.md#keytype) | 按键的类型。 |
| [keyCode](../apis/js-apis-keycode.md) | number | 按键的键码。 |
| keyText | string | 按键的键值。 |
| keySource | [KeySource](ts-appendix-enums.md#keysource) | 触发当前按键的输入设备类型。 |
| deviceId | number | 触发当前按键的输入设备ID。 |
| metaKey | number | 按键发生时元键的状态,1表示按压态,0表示未按压态。 |
| timestamp | number | 按键发生时的时间戳。 |
| stopPropagation | () => void | 阻塞事件冒泡传递。 |
## 示例
......
......@@ -10,12 +10,13 @@
## 事件
| **名称** | **支持冒泡** | **功能描述** |
| -------- | -------- | -------- |
| onFocus(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 否 | 当前组件获取焦点时触发的回调。 |
| onBlur(event:()&nbsp;=&gt;&nbsp;void) | 否 | 当前组件失去焦点时触发的回调。 |
| **名称** | **支持冒泡** | **功能描述** |
| ---------------------------------------- | -------- | --------------- |
| onFocus(event:&nbsp;()&nbsp;=&gt;&nbsp;void) | 否 | 当前组件获取焦点时触发的回调。 |
| onBlur(event:()&nbsp;=&gt;&nbsp;void) | 否 | 当前组件失去焦点时触发的回调。 |
> **说明:**
>
> 支持焦点事件的组件:Button、Text、Image、List、Grid。
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册