From 81548e5234900deee6601b6dfe5b342df79dcf9e Mon Sep 17 00:00:00 2001 From: HelloCrease Date: Tue, 20 Sep 2022 09:41:29 +0800 Subject: [PATCH] update docs Signed-off-by: HelloCrease --- .../ts-universal-attributes-background.md | 12 ++-- .../ts-universal-attributes-border-image.md | 45 +++++++------- .../ts-universal-attributes-border.md | 62 +++++++++---------- .../ts-universal-attributes-flex-layout.md | 19 +++--- ...universal-attributes-layout-constraints.md | 17 ++--- .../ts-universal-attributes-opacity.md | 17 ++--- .../arkui-ts/ts-universal-attributes-size.md | 18 +++--- ...s-universal-component-area-change-event.md | 6 +- ...sal-component-visible-area-change-event.md | 12 ++-- .../arkui-ts/ts-universal-events-click.md | 12 ++-- .../arkui-ts/ts-universal-events-drag-drop.md | 28 +++++---- .../arkui-ts/ts-universal-events-key.md | 26 ++++---- .../arkui-ts/ts-universal-focus-event.md | 9 +-- 13 files changed, 133 insertions(+), 150 deletions(-) diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md index 16adaa56c3..59054502b2 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-background.md @@ -6,15 +6,13 @@ > > 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 - ## 属性 - -| 名称 | 参数类型 | 描述 | -| -------- | -------- | -------- | -| backgroundColor | [ResourceColor](ts-types.md) | 设置组件的背景色。 | -| backgroundImage | - src: [ResourceStr](ts-types.md),
- repeat?: [ImageRepeat](ts-appendix-enums.md#imagerepeat) | src:图片地址,支持网络图片资源和本地图片资源地址(不支持svg类型的图片)。
repeat:设置背景图片的重复样式,默认不重复。 | -| backgroundImageSize | {
width?: [Length](ts-types.md#length),
height?: [Length](ts-types.md#length)
} \| [ImageSize](ts-appendix-enums.md#imagesize) | 设置背景图像的高度和宽度。当输入为{width: Length, height: Length}对象时,如果只设置一个属性,则第二个属性保持图片原始宽高比进行调整。默认保持原图的比例不变。
默认值:ImageSize.Auto | +| 名称 | 参数类型 | 描述 | +| ----------------------- | ---------------------------------------- | ---------------------------------------- | +| backgroundColor | [ResourceColor](ts-types.md#resourcecolor8) | 设置组件的背景色。 | +| backgroundImage | - src: [ResourceStr](ts-types.md#resourcestr8),
- repeat?: [ImageRepeat](ts-appendix-enums.md#imagerepeat) | src:图片地址,支持网络图片资源和本地图片资源地址(不支持svg类型的图片)。
repeat:设置背景图片的重复样式,默认不重复。 | +| backgroundImageSize | {
width?: [Length](ts-types.md#length),
height?: [Length](ts-types.md#length)
} \| [ImageSize](ts-appendix-enums.md#imagesize) | 设置背景图像的高度和宽度。当输入为{width: Length, height: Length}对象时,如果只设置一个属性,则第二个属性保持图片原始宽高比进行调整。默认保持原图的比例不变。
默认值:ImageSize.Auto | | backgroundImagePosition | {
x?: [Length](ts-types.md#length),
y?: [Length](ts-types.md#length)
} \| [Alignment](ts-appendix-enums.md#alignment) | 设置背景图在组件中显示位置。
默认值:
{
x: 0,
y: 0
} | diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border-image.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border-image.md index 3292fda02a..c697ed06ab 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border-image.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border-image.md @@ -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 | 设置图片边框切割宽度。
默认值:0 | +| width | [Length](ts-types.md#length)\| EdgeWidth | 设置图片边框宽度。
默认值:0 | +| outset | [Length](ts-types.md#length)\| EdgeWidth | 设置边框图片向外延伸距离。
默认值:0 | +| RepeatMode | RepeatMode | 设置边框图片的重复方式。
默认值:RepeatMode.Stretch | +| fill | boolean | 设置边框图片中心填充。
默认值:false | -| 名称 | 参数类型 | 描述 | -| -------- | -------- | -------- | -| source | string \| [Resource](ts-types.md#resource类型) \| [linearGradient](ts-universal-attributes-gradient-color.md) | 边框图源或者渐变色设置。 | -| slice | [Length](ts-types.md#length)\| EdgeWidth | 设置图片边框切割宽度。
默认值:0 | -| width | [Length](ts-types.md#length)\| EdgeWidth | 设置图片边框宽度。
默认值:0 | -| outset | [Length](ts-types.md#length)\| EdgeWidth | 设置边框图片向外延伸距离。
默认值:0 | -| RepeatMode | RepeatMode | 设置边框图片的重复方式。
默认值:RepeatMode.Stretch | -| fill | boolean | 设置边框图片中心填充。
默认值: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 | 被切割图片以整数次平铺在图片边框上,无法以整数次平铺时以空白填充。 | ## 示例 diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border.md index 39f476affa..7b8da30f66 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-border.md @@ -12,57 +12,57 @@ ## 属性 -| 名称 | 参数类型 | 描述 | -| ------------ | ------------------------------------------------------------ | ------------------------------------------------------------ | -| border | {
width?: [Length](ts-types.md#长度类型) \| EdgeWidth9+,
color?:  [ResourceColor](ts-types.md) \| EdgeColor9+,
radius?:  [Length](ts-types.md#长度类型) \| BorderRadiuses9+,
style?: [BorderStyle](ts-appendix-enums.md#borderstyle) \| EdgeStyle9+
} | 统一边框样式设置接口。
- width:设置边框宽度。
- color:设置边框颜色。
- radius:设置边框圆角半径。
- style:设置边框样式。 | -| borderStyle | [BorderStyle](ts-appendix-enums.md#borderstyle) \| EdgeStyle9+ | 设置元素的边框样式。
默认值:BorderStyle.Solid | -| borderWidth | [Length](ts-types.md) \| EdgeWidth9+ | 设置元素的边框宽度。 | -| borderColor | [ResourceColor](ts-types.md) \| EdgeColor9+ | 设置元素的边框颜色。 | -| borderRadius | [Length](ts-types.md) \| BorderRadiuses9+ | 设置元素的边框圆角半径。 | +| 名称 | 参数类型 | 描述 | +| ------------ | ---------------------------------------- | ---------------------------------------- | +| border | {
width?: [Length](ts-types.md#length) \| EdgeWidth9+,
color?:  [ResourceColor](ts-types.md#resourcecolor8) \| EdgeColor9+,
radius?:  [Length](ts-types.md#length) \| BorderRadiuses9+,
style?: [BorderStyle](ts-appendix-enums.md#borderstyle) \| EdgeStyle9+
} | 统一边框样式设置接口。
- width:设置边框宽度。
- color:设置边框颜色。
- radius:设置边框圆角半径。
- style:设置边框样式。 | +| borderStyle | [BorderStyle](ts-appendix-enums.md#borderstyle) \| EdgeStyle9+ | 设置元素的边框样式。
默认值:BorderStyle.Solid | +| borderWidth | [Length](ts-types.md#length) \| EdgeWidth9+ | 设置元素的边框宽度。 | +| borderColor | [ResourceColor](ts-types.mdts-types.md#resourcecolor8) \| EdgeColor9+ | 设置元素的边框颜色。 | +| borderRadius | [Length](ts-types.md#length) \| BorderRadiuses9+ | 设置元素的边框圆角半径。 | ## EdgeWidth9+对象说明 引入该对象时,至少传入一个参数。 -| 名称 | 参数类型 | 必填 | 描述 | -| ------ | ------------------------------------- | ---- | -------------- | -| 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) | 否 | 下侧边框宽度。 | ## EdgeColor9+对象说明 引入该对象时,至少传入一个参数。 -| 名称 | 参数类型 | 必填 | 描述 | -| ------ | ------------------------------------- | ---- | -------------- | -| 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) | 否 | 下侧边框颜色。 | ## BorderRadiuses9+对象说明 引用该对象时,至少传入一个参数。 -| 名称 | 参数类型 | 必填 | 描述 | -| ----------- | ------------------------------------- | ---- | ---------------- | -| 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) | 否 | 右下角圆角半径。 | ## EdgeStyle9+对象说明 引入该对象时,至少传入一个参数。 -| 名称 | 参数类型 | 必填 | 描述 | -| ------ | ----------------------------------------------- | ---- | -------------- | -| 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) | 否 | 下侧边框样式。 | ## 示例 diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-flex-layout.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-flex-layout.md index 2aa5c67b0f..df1399bed4 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-flex-layout.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-flex-layout.md @@ -1,20 +1,19 @@ # Flex布局 > **说明:** -> - 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 -> -> - 仅当父组件是 Flex、Column、Row 时生效。 +> - 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 +> +> - 仅当父组件是 Flex、Column、Row 时生效。 ## 属性 - -| 名称 | 参数说明 | 描述 | -| -------- | -------- | -------- | -| flexBasis | number \| string | 设置组件在父容器主轴方向上的基准尺寸。
默认值:'auto'(表示组件在主轴方向上的基准尺寸为组件原本的大小) | -| flexGrow | number | 设置父容器的剩余空间分配给此属性所在组件的比例。
默认值:0 | -| flexShrink | number | 设置父容器压缩尺寸分配给此属性所在组件的比例。
默认值:1 | -| alignSelf | [ItemAlign](ts-appendix-enums.md#itemalign) | 子组件在父容器交叉轴的对齐格式,覆盖Flex布局容器中alignItems默认配置。
默认值:ItemAlign.Auto | +| 名称 | 参数说明 | 描述 | +| ---------- | ---------------------------------------- | ---------------------------------------- | +| flexBasis | number \| string | 设置组件在父容器主轴方向上的基准尺寸。
默认值:'auto'(表示组件在主轴方向上的基准尺寸为组件原本的大小) | +| flexGrow | number | 设置父容器的剩余空间分配给此属性所在组件的比例。
默认值:0 | +| flexShrink | number | 设置父容器压缩尺寸分配给此属性所在组件的比例。
默认值:1 | +| alignSelf | [ItemAlign](ts-appendix-enums.md#itemalign) | 子组件在父容器交叉轴的对齐格式,覆盖Flex布局容器中alignItems默认配置。
默认值:ItemAlign.Auto | ## 示例 diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-layout-constraints.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-layout-constraints.md index e60e84f306..3290c21537 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-layout-constraints.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-layout-constraints.md @@ -3,21 +3,16 @@ 通过组件的宽高比和显示优先级约束组件显示效果。 > **说明:** -> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 - - -## 权限列表 - -无 +> +> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 ## 属性 - -| 名称 | 参数说明 | 默认值 | 描述 | -| -------- | -------- | -------- | -------- | -| aspectRatio | number | - | 指定当前组件的宽高比。 | -| displayPriority | number | - | 设置当前组件在布局容器中显示的优先级,当父容器空间不足时,低优先级的组件会被隐藏。
>  **说明:**
> 仅在Row/Column/Flex(单行)容器组件中生效。 | +| 名称 | 参数说明 | 描述 | +| --------------- | ------ | ---------------------------------------- | +| aspectRatio | number | 指定当前组件的宽高比。 | +| displayPriority | number | 设置当前组件在布局容器中显示的优先级,当父容器空间不足时,低优先级的组件会被隐藏。
**说明:**
仅在Row/Column/Flex(单行)容器组件中生效。 | ## 示例 diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-opacity.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-opacity.md index 6fb486dcd3..592d818752 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-opacity.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-opacity.md @@ -1,23 +1,18 @@ # 透明度设置 -> **说明:** -> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 - - 设置组件的透明度。 - -## 权限列表 - -无 +> **说明:** +> +> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 ## 属性 -| 名称 | 参数类型 | 默认值 | 描述 | -| -------- | -------- | -------- | -------- | -| opacity | number \| [Resource](ts-types.md#resource类型) | 1 | 元素的不透明度,取值范围为0到1,1表示为不透明,0表示为完全透明。 | +| 名称 | 参数类型 | 描述 | +| ------- | ---------------------------------------- | ---------------------------------------- | +| opacity | number \| [Resource](ts-types.md#resource) | 元素的不透明度,取值范围为0到1,1表示为不透明,0表示为完全透明。
默认值:1 | ## 示例 diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-size.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-size.md index 8b5da5f79d..e8dda0a026 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-size.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-attributes-size.md @@ -10,15 +10,15 @@ ## 属性 -| 名称 | 参数说明 | 默认值 | 描述 | -| -------- | -------- | -------- | -------- | -| width | Length | - | 设置组件自身的宽度,缺省时使用元素自身内容需要的宽度。 | -| height | Length | - | 设置组件自身的高度,缺省时使用元素自身内容需要的高度。 | -| size | {
width?: Length,
height?: Length
} | - | 设置高宽尺寸。 | -| padding | {
top?: Length,
right?: Length,
bottom?: Length,
left?: Length
} \| Length | 0 | 设置内边距属性。
参数为Length类型时,四个方向内边距同时生效。 | -| margin | {
top?: Length,
right?: Length,
bottom?: Length,
left?: Length
}
\| Length | 0 | 设置外边距属性。
参数为Length类型时,四个方向外边距同时生效。 | -| constraintSize | {
minWidth?: Length,
maxWidth?: Length,
minHeight?: Length,
maxHeight?: Length
} | {
minWidth: 0,
maxWidth: Infinity,
minHeight: 0,
maxHeight: Infinity
} | 设置约束尺寸,组件布局时,进行尺寸范围限制。constraintSize的优先级高于Width和Height。 | -| layoutWeight | number \| string | 0 | 容器尺寸确定时,元素与兄弟节点主轴布局尺寸按照权重进行分配,忽略本身尺寸设置,表示自适应占满剩余空间。
>  **说明:**
> 仅在Row/Column/Flex布局中生效。 | +| 名称 | 参数说明 | 描述 | +| -------------- | ---------------------------------------- | ---------------------------------------- | +| width | [Length](ts-types.md#length) | 设置组件自身的宽度,缺省时使用元素自身内容需要的宽度。 | +| height | [Length](ts-types.md#length) | 设置组件自身的高度,缺省时使用元素自身内容需要的高度。 | +| size | {
width?: [Length](ts-types.md#length),
height?: [Length](ts-types.md#length)
} | 设置高宽尺寸。 | +| padding | {
top?: [Length](ts-types.md#length),
right?: [Length](ts-types.md#length),
bottom?: [Length](ts-types.md#length),
left?: [Length](ts-types.md#length)
} \| [Length](ts-types.md#length) | 设置内边距属性。
参数为Length类型时,四个方向内边距同时生效。
默认值:0 | +| margin | {
top?: [Length](ts-types.md#length),
right?: [Length](ts-types.md#length),
bottom?: [Length](ts-types.md#length),
left?: [Length](ts-types.md#length)
}
\| [Length](ts-types.md#length) | 设置外边距属性。
参数为Length类型时,四个方向外边距同时生效。
默认值:0 | +| constraintSize | {
minWidth?: [Length](ts-types.md#length),
maxWidth?: [Length](ts-types.md#length),
minHeight?: [Length](ts-types.md#length),
maxHeight?: [Length](ts-types.md#length)
} | 设置约束尺寸,组件布局时,进行尺寸范围限制。constraintSize的优先级高于Width和Height。
默认值:
{
minWidth: 0,
maxWidth: Infinity,
minHeight: 0,
maxHeight: Infinity
} | +| layoutWeight | number \| string | 容器尺寸确定时,元素与兄弟节点主轴布局尺寸按照权重进行分配,忽略本身尺寸设置,表示自适应占满剩余空间。
**说明:**
仅在Row/Column/Flex布局中生效。
默认值:0 | ## 示例 diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-area-change-event.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-area-change-event.md index fd3bdbfd34..315aa13fb9 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-area-change-event.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-area-change-event.md @@ -3,14 +3,10 @@ 组件区域变化事件指组件显示的尺寸、位置等发生变化时触发的事件。 > **说明:** +> > 从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 -## 权限列表 - -无 - - ## 事件 | 名称 | 支持冒泡 | 功能描述 | diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-visible-area-change-event.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-visible-area-change-event.md index 97c1054736..79082fc267 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-visible-area-change-event.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-component-visible-area-change-event.md @@ -2,17 +2,15 @@ 组件可见区域变化事件指组件在屏幕中显示的面积变化,提供了判断组件是否完全或部分显示在屏幕中的能力,通常适用于像广告曝光埋点之类的场景。 -> **说明:** 从API Version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 - -## 权限列表 - -无 +> **说明:** +> +> 从API Version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 ## 事件 -| 名称 | 功能描述 | -| -------- | -------- | +| 名称 | 功能描述 | +| ---------------------------------------- | ---------------------------------------- | | onVisibleAreaChange(ratios: Array\, event: (isVisible: boolean, currentRatio: number) => void) | 组件可见区域变化时触发该回调。
-ratios:阈值数组。其中,每个阈值代表组件可见面积(即组件在屏幕显示区的面积)与组件自身面积的比值。当组件可见面积与自身面积的比值大于或小于阈值时,均会触发该回调。每个阈值的取值范围为[0.0, 1.0],如果开发者设置的阈值超出该范围,则会实际取值0.0或1.0.
-isVisible:表示组件的可见面积与自身面积的比值是否大于阈值,true表示大于,false表示小于。
-currentRatio:触发回调时,组件可见面积与自身面积的比值。 | diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-click.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-click.md index e6ad83abb7..46e34939e9 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-click.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-click.md @@ -9,11 +9,12 @@ ## 事件 -| 名称 | 支持冒泡 | 功能描述 | -| ------------------------------------------------------------ | -------- | --------------------------------------------------- | -| onClick(event: (event?: ClickEvent) => void) | 否 | 点击动作触发该方法调用,event参数见ClickEvent介绍。 | +| 名称 | 支持冒泡 | 功能描述 | +| ---------------------------------------- | ---- | --------------------------------- | +| onClick(event: (event?: ClickEvent) => void) | 否 | 点击动作触发该方法调用,event参数见ClickEvent介绍。 | ## ClickEvent对象说明 + | 属性名称 | 类型 | 描述 | | ------------------- | -------------------------------- | ------------------- | | screenX | number | 点击点相对于设备屏幕左边沿的X坐标。 | @@ -24,8 +25,9 @@ | timestamp | number | 事件时间戳。 | ## EventTarget8+对象说明 -| 名称 | 参数类型 | 描述 | -| ---- | ----------------- | ---------- | + +| 名称 | 参数类型 | 描述 | +| ---- | ------------------------- | ---------- | | area | [Area](ts-types.md#area8) | 目标元素的区域信息。 | diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md index 646fee2de6..67ac190384 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-drag-drop.md @@ -3,35 +3,41 @@ 拖拽事件指被长按后拖拽时触发的事件。 > **说明:** +> > 从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 ## 事件 | 名称 | 支持冒泡 | 功能描述 | | ---------------------------------------- | ---- | ---------------------------------------- | -| onDragStart(event: (event?: DragEvent, extraParams?: string) =>  [CustomBuilder](ts-types.md#custombuilder8)) \| DragItemInfo | 否 | 第一次拖拽此事件绑定的组件时,触发回调。
- event:拖拽事件信息,包括拖拽点坐标。
- extraParams:拖拽事件额外信息,详见extraParam类型描述。
返回值:当前跟手效果所拖拽的对象,用于显示拖拽时的提示组件。
长按150毫秒(ms)可触发拖拽事件。优先级:长按手势配置时间小于等于150毫秒(ms)时,长按手势优先触发,否则拖拽事件优先触发。 | +| onDragStart(event: (event?: DragEvent, extraParams?: string)
 =>  [CustomBuilder](ts-types.md#custombuilder8)) \| DragItemInfo | 否 | 第一次拖拽此事件绑定的组件时,触发回调。
- event:拖拽事件信息,包括拖拽点坐标。
- extraParams:拖拽事件额外信息,详见extraParam类型描述。
返回值:当前跟手效果所拖拽的对象,用于显示拖拽时的提示组件。
长按150毫秒(ms)可触发拖拽事件。优先级:长按手势配置时间小于等于150毫秒(ms)时,长按手势优先触发,否则拖拽事件优先触发。 | | onDragEnter(event: (event?: DragEvent, extraParams?: string) => void) | 否 | 拖拽进入组件范围内时,触发回调。
- event:拖拽事件信息,包括拖拽点坐标。
- extraParams:拖拽事件额外信息,详见extraParam类型描述。
当监听了onDrop事件时,此事件才有效。 | | onDragMove(event: (event?: DragEvent, extraParams?: string) => void) | 否 | 拖拽在组件范围内移动时,触发回调。
- event:拖拽事件信息,包括拖拽点坐标。
- extraParams:拖拽事件额外信息,详见extraParam类型描述。
当监听了onDrop事件时,此事件才有效。 | | onDragLeave(event: (event?: DragEvent, extraParams?: string) => void) | 否 | 拖拽离开组件范围内时,触发回调。
- event:拖拽事件信息,包括拖拽点坐标。
- extraParams:拖拽事件额外信息,详见extraParam类型描述。
当监听了onDrop事件时,此事件才有效。 | | onDrop(event: (event?: DragEvent, extraParams?: string) => void) | 否 | 绑定此事件的组件可作为拖拽释放目标,当在本组件范围内停止拖拽行为时,触发回调。
- event:拖拽事件信息,包括拖拽点坐标。
- 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开始。
仅在ListItem组件中生效。 | - | insertIndex | number | 当前拖拽元素在List组件中放下时,insertIndex表示被拖拽元素插入该组件的第insertIndex个位置,insertIndex从0开始。
仅在List组件的拖拽事件中生效。 | -### DragEvent对象说明 +| 属性名称 | 属性类型 | 描述 | +| ------------- | ------ | ---------------------------------------- | +| selectedIndex | number | 当拖拽事件设在父容器的子元素时,selectedIndex表示当前被拖拽子元素是父容器第selectedIndex个子元素,selectedIndex从0开始。
仅在ListItem组件中生效。 | +| insertIndex | number | 当前拖拽元素在List组件中放下时,insertIndex表示被拖拽元素插入该组件的第insertIndex个位置,insertIndex从0开始。
仅在List组件的拖拽事件中生效。 | + +## DragEvent对象说明 + | 名称 | 返回值类型 | 功能描述 | | ------ | ------ | ---------------- | | getX() | number | 当前拖拽点x轴坐标,单位为vp。 | diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-key.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-key.md index 8f1332dff5..725e0516b5 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-key.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-events-key.md @@ -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 | 阻塞事件冒泡传递。 | ## 示例 diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-universal-focus-event.md b/zh-cn/application-dev/reference/arkui-ts/ts-universal-focus-event.md index e435dd497e..4a3fc90ef5 100644 --- a/zh-cn/application-dev/reference/arkui-ts/ts-universal-focus-event.md +++ b/zh-cn/application-dev/reference/arkui-ts/ts-universal-focus-event.md @@ -10,12 +10,13 @@ ## 事件 -| **名称** | **支持冒泡** | **功能描述** | -| -------- | -------- | -------- | -| onFocus(event: () => void) | 否 | 当前组件获取焦点时触发的回调。 | -| onBlur(event:() => void) | 否 | 当前组件失去焦点时触发的回调。 | +| **名称** | **支持冒泡** | **功能描述** | +| ---------------------------------------- | -------- | --------------- | +| onFocus(event: () => void) | 否 | 当前组件获取焦点时触发的回调。 | +| onBlur(event:() => void) | 否 | 当前组件失去焦点时触发的回调。 | > **说明:** +> > 支持焦点事件的组件:Button、Text、Image、List、Grid。 -- GitLab