提交 ca942b4c 编写于 作者: T tianyu

release first

Signed-off-by: Ntianyu <tianyu55@h-partners.com>
上级 6b2ccd9d
......@@ -6,25 +6,21 @@
>
> 该组件从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 子组件
## 接口
CheckboxGroup( option?: {group?: string} )
CheckboxGroup( options?: {group?: string} )
创建多选框群组,可以控制群组内的Checkbox全选或者不全选,相同group的Checkbox和CheckboxGroup为同一群组。
**参数:**
| 参数名 | 参数类型 | 必填 | 默认值 | 参数描述 |
| ----- | ------ | ---- | ---- | ----- |
| group | string | 否 | - | 群组名称。 |
| 参数名 | 参数类型 | 必填 | 参数描述 |
| ------ | -------- | ---- | ---------- |
| group | string | 否 | 群组名称。 |
## 属性
......@@ -50,7 +46,7 @@ CheckboxGroup的选中状态或群组内的Checkbox的选中状态发生变化
| 名称 | 参数类型 | 描述 |
| ------ | ------------------- | -------------- |
| name | Array&lt;string&gt; | checkBox名称。 |
| status | selectStatus | 选中状态。 |
| status | SelectStatus | 选中状态。 |
## SelectStatus枚举说明
......
......@@ -7,11 +7,6 @@
> 该组件从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 子组件
支持单个子组件。
......@@ -28,7 +23,7 @@ TabContent()
| 名称 | 参数类型 | 默认值 | 描述 |
| ------ | ------------------------------------------------------------ | ------ | ------------------------------------------------------------ |
| tabBar | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource)&nbsp;\|&nbsp;{<br/>icon?:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>text?:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource)<br/>}<br/>\|&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<sup>8+</sup> | - | 设置TabBar上显示内容。<br/>CustomBuilder:&nbsp;构造器,内部可以传入组件(API8版本以上适用)。<br/>>&nbsp;&nbsp;**说明:**<br/>>&nbsp;如果icon采用svg格式图源,则要求svg图源删除其自有宽高属性值。如采用带有自有宽高属性的svg图源,icon大小则是svg本身内置的宽高属性值大小。 |
| tabBar | string&nbsp;\|&nbsp;[Resource](ts-types.md#resource)&nbsp;\|&nbsp;{<br/>icon?:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource),<br/>text?:&nbsp;string&nbsp;\|&nbsp;[Resource](ts-types.md#resource)<br/>}<br/>\|&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<sup>8+</sup> | - | 设置TabBar上显示内容。<br/>CustomBuilder:&nbsp;构造器,内部可以传入组件(API8版本以上适用)。<br/>**说明:**<br/>如果icon采用svg格式图源,则要求svg图源删除其自有宽高属性值。如采用带有自有宽高属性的svg图源,icon大小则是svg本身内置的宽高属性值大小。 |
> **说明:**
> - TabContent组件不支持设置通用宽度属性,其宽度默认撑满Tabs父组件。
......
......@@ -7,11 +7,6 @@
> 该组件从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 子组件
包含子组件[TabContent](ts-container-tabcontent.md)
......@@ -19,7 +14,7 @@
## 接口说明
Tabs(value: {barPosition?: BarPosition, index?: number, controller?: [TabsController](#tabscontroller)})
Tabs(value?: {barPosition?: BarPosition, index?: number, controller?: [TabsController](#tabscontroller)})
**参数:**
......
# Video
视频播放组件。
> **说明:**
>
> 该组件从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
视频播放组件。
## 权限列表
使用网络视频时,需要在config或者module.json对应的"abilities"中添加网络使用权限ohos.permission.INTERNET。
......@@ -27,7 +28,7 @@
## 接口
Video(value: {src?: string | Resource, currentProgressRate?: number | string | PlaybackSpeed, previewUri?: string | PixelMap | Resource, controller?: VideoController})
Video(value: {src?: string | Resource, currentProgressRate?: number | string | PlaybackSpeed, previewUri?: string | PixelMap | Resource, controller?: VideoController})
**参数:**
......@@ -68,10 +69,10 @@
| onPause(event:()&nbsp;=&gt;&nbsp;void) | 暂停时触发该事件。 |
| onFinish(event:()&nbsp;=&gt;&nbsp;void) | 播放结束时触发该事件。 |
| onError(event:()&nbsp;=&gt;&nbsp;void) | 播放失败时触发该事件。 |
| onPrepared(callBack:(event?:&nbsp;{&nbsp;duration:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 视频准备完成时触发该事件,通过duration可以获取视频时长,单位为s。<br/>- duration: 视频的时长。 |
| onSeeking(callBack:(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 操作进度条过程时上报时间信息,单位为s。 |
| onSeeked(callBack:(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 操作进度条完成后,上报播放时间信息,单位为s。 |
| onUpdate(callBack:(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 播放进度变化时触发该事件,单位为s,更新时间间隔为250ms。 |
| onPrepared(callback:(event?:&nbsp;{&nbsp;duration:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 视频准备完成时触发该事件,通过duration可以获取视频时长,单位为s。<br/>- duration: 视频的时长。 |
| onSeeking(callback:(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 操作进度条过程时上报时间信息,单位为s。 |
| onSeeked(callback:(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 操作进度条完成后,上报播放时间信息,单位为s。 |
| onUpdate(callback:(event?:&nbsp;{&nbsp;time:&nbsp;number&nbsp;})&nbsp;=&gt;&nbsp;void) | 播放进度变化时触发该事件,单位为s,更新时间间隔为250ms。 |
## VideoController
......
# 背景设置
> **说明:**
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
设置组件的背景色。
## 权限列表
> **说明:**
>
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| backgroundColor | Color | - | 设置组件的背景色。 |
| backgroundImage | src:&nbsp;string,<br/>repeat?:&nbsp;[ImageRepeat](ts-appendix-enums.md#imagerepeat) | - | src参数:图片地址,支持网络图片资源和本地图片资源地址(不支持svg类型的图片)。<br/>repeat参数:设置背景图片的重复样式,默认不重复。 |
| backgroundImageSize | {<br/>width?:&nbsp;Length,<br/>height?:&nbsp;Length<br/>}&nbsp;\|&nbsp;[ImageSize](ts-appendix-enums.md#imagesize) | Auto | 设置背景图像的高度和宽度。当输入为{width:&nbsp;Length,&nbsp;height:&nbsp;Length}对象时,如果只设置一个属性,则第二个属性保持图片原始宽高比进行调整。默认保持原图的比例不变。 |
| backgroundImagePosition | {<br/>x?:&nbsp;Length,<br/>y?:&nbsp;Length<br/>}&nbsp;\|&nbsp;[Alignment](ts-appendix-enums.md#alignment) | {<br/>x:&nbsp;0,<br/>y:&nbsp;0<br/>} | 设置背景图在组件中显示位置。 |
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| 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 | {<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/>x:&nbsp;0,<br/>y:&nbsp;0<br/>} |
## 示例
......
# 边框设置
> **说明:**
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
设置组件边框样式。
## 权限列表
> **说明:**
>
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| -------- | -------- | -------- | -------- |
| border | {<br/>width?:&nbsp;Length,<br/>color?:&nbsp;Color,<br/>radius?:&nbsp;Length,<br/>style?:&nbsp;[BorderStyle](ts-appendix-enums.md#borderstyle)<br/>} | - | 统一边框样式设置接口。 |
| borderStyle | [BorderStyle](ts-appendix-enums.md#borderstyle) | &nbsp;BorderStyle.Solid | 设置元素的边框样式。 |
| borderWidth | Length | 0 | 设置元素的边框宽度。 |
| borderColor | Color | - | 设置元素的边框颜色。 |
| borderRadius | Length | 0 | 设置元素的边框圆角半径。 |
| 名称 | 参数类型 | 描述 |
| -------- | -------- | -------- |
| border | {<br/>width?:&nbsp;[Length](ts-types.md#length),<br/>color?:&nbsp;[ResourceColor](ts-types.md#resourcecolor),<br/>radius?:&nbsp;[Length](ts-types.md#length),<br/>style?:&nbsp;[BorderStyle](ts-appendix-enums.md#borderstyle)<br/>} | 统一边框样式设置接口。 |
| borderStyle | [BorderStyle](ts-appendix-enums.md#borderstyle) | 设置元素的边框样式。<br/>默认值:BorderStyle.Solid |
| borderWidth | [Length](ts-types.md#length) | 设置元素的边框宽度。 |
| borderColor | [ResourceColor](ts-types.md#resourcecolor) | 设置元素的边框颜色。 |
| borderRadius | [Length](ts-types.md#length) | 设置元素的边框圆角半径。 |
......
......@@ -5,23 +5,18 @@
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| ---------------------------- | ------------------------------------------------------------ | ------ | ------------------------------------------------------------ |
| bindMenu | Array<MenuItem&gt;&nbsp;\|&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<sup>8+</sup> | - | 给组件绑定菜单,点击后弹出菜单。弹出菜单项支持文本和自定义两种功能。 |
| bindContextMenu<sup>8+</sup> | content:&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<br>responseType:&nbsp;[ResponseType](ts-appendix-enums.md#responsetype8) | - | 给组件绑定菜单,触发方式为长按或者右键点击,弹出菜单项需要自定义。 |
| 名称 | 参数类型 | 描述 |
| ---------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| bindMenu | Array<MenuItem&gt;&nbsp;\|&nbsp;[CustomBuilder](ts-types.md#custombuilder8) | 给组件绑定菜单,点击后弹出菜单。弹出菜单项支持文本和自定义两种功能。 |
| bindContextMenu<sup>8+</sup> | content:&nbsp;[CustomBuilder](ts-types.md#custombuilder8)<br>responseType:&nbsp;[ResponseType](ts-appendix-enums.md#responsetype8) | 给组件绑定菜单,触发方式为长按或者右键点击,弹出菜单项需要自定义。 |
## MenuItem
| 名称 | 类型 | 描述 |
| ------ | ----------------------- | ----------- |
| ------ | ----------------------- | ---------------------- |
| value | string | 菜单项文本。 |
| action | ()&nbsp;=&gt;&nbsp;void | 点击菜单项的事件回调。 |
......
......@@ -7,17 +7,12 @@
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| ------- | ------ | ---- | ---------------------------------- |
| opacity | number | 1 | 元素的不透明度,取值范围为0到1,1表示为不透明,0表示为完全透明。 |
| 名称 | 参数类型 | 描述 |
| ------- | ---------------------------------------------------- | ------------------------------------------------------------ |
| opacity | number&nbsp;\|&nbsp;[Resource](ts-types.md#resource) | 元素的不透明度,取值范围为0到1,1表示为不透明,0表示为完全透明。<br/>默认值:1 |
## 示例
......
# 多态样式
> **说明:**
> 从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
设置组件不同状态下的样式。
## 权限列表
> **说明:**
>
> 从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| ----------- | ----------- | ---- | ------------ |
| stateStyles | StateStyles | - | 设置组件不同状态的样式。 |
| 名称 | 参数类型 | 描述 |
| ----------- | ----------- | ------------------------ |
| stateStyles | StateStyles | 设置组件不同状态的样式。 |
## StateStyles接口说明
| 名称 | 类型 | 必填 | 默认值 | 描述 |
| -------- | ----------- | ---- | ---- | ---------- |
| normal | ()=&gt;void | 否 | - | 组件无状态时的样式。 |
| pressed | ()=&gt;void | 否 | - | 组件按下状态的样式。 |
| disabled | ()=&gt;void | 否 | - | 组件禁用状态的样式。 |
| 名称 | 类型 | 必填 | 描述 |
| -------- | ---- | ---- | -------------------- |
| normal | any | 否 | 组件无状态时的样式。 |
| pressed | any | 否 | 组件按下状态的样式。 |
| disabled | any | 否 | 组件禁用状态的样式。 |
| focused | any | 否 | 组件获焦状态的样式。 |
| clicked | any | 否 | 组件点击状态的样式。 |
## 示例
......
......@@ -5,39 +5,34 @@
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| --------- | ---------------------------------------- | ---- | ---------------------------------------- |
| bindPopup | show:&nbsp;boolean,<br/>popup:&nbsp;PopupOptions\|&nbsp;CustomPopupOptions | - | 给组件绑定Popup,点击弹出弹窗。<br/>show:&nbsp;创建页面弹窗提示是否默认显示,默认值为false。<br/>popup:&nbsp;配置当前弹窗提示的参数。 |
## PopupOptions类型接口说明
| 名称 | 类型 | 必填 | 默认值 | 描述 |
| --------------- | ---------------------------------------- | ---- | ----- | ---------------------------------------- |
| message | string | 是 | - | 弹窗信息内容。 |
| placementOnTop | boolean | 否 | false | 是否在组件上方显示,默认值为false。 |
| primaryButton | {<br/>value:&nbsp;string,<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | - | 第一个按钮。<br/>value:&nbsp;弹窗里主按钮的文本。<br/>action:&nbsp;点击主按钮的回调函数。 |
| secondaryButton | {<br/>value:&nbsp;string,<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | - | 第二个按钮。<br/>value:&nbsp;弹窗里辅助按钮的文本。<br/>action:&nbsp;点击辅助按钮的回调函数。 |
| onStateChange | (isVisible:&nbsp;boolean)&nbsp;=&gt;&nbsp;void | 否 | - | 弹窗状态变化事件回调,参数isVisible为弹窗当前的显示状态。 |
## CustomPopupOptions<sup>8+</sup>类型接口说明
| 名称 | 类型 | 必填 | 默认值 | 描述 |
| ------------- | ---------------------------------------------- | ---- | ---------------- | ------------------------------------------------------------ |
| builder | ()&nbsp;=&gt;&nbsp;any | 是 | - | 提示气泡内容的构造器。 |
| placement | [Placement](ts-appendix-enums.md#placement8) | 否 | Placement.Bottom | 气泡组件优先显示的位置,当前位置显示不下时,会自动调整位置。 |
| maskColor | [Color](ts-appendix-enums.md#color) | 否 | - | 提示气泡遮障层的颜色。 |
| popupColor | [Color](ts-appendix-enums.md#color) | 否 | - | 提示气泡的颜色。 |
| enableArrow | boolean | 否 | true | 是否显示箭头,只有上、下方向的气泡会显示箭头。 |
| autoCancel | boolean | 否 | true | 页面有操作时,是否自动关闭气泡 |
| onStateChange | (isVisible:&nbsp;boolean)&nbsp;=&gt;&nbsp;void | 否 | - | 弹窗状态变化事件回调,参数为弹窗当前的显示状态。 |
## 接口
| 名称 | 参数类型 | 描述 |
| --------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| bindPopup | show:&nbsp;boolean,<br/>popup:&nbsp;PopupOptions\|&nbsp;CustomPopupOptions<sup>8+</sup> | 给组件绑定Popup,点击弹出弹窗。<br/>show:&nbsp;创建页面弹窗提示是否默认显示,默认值为false。<br/>popup:&nbsp;配置当前弹窗提示的参数。 |
## PopupOptions类型说明
| 名称 | 类型 | 必填 | 描述 |
| --------------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ |
| message | string | 是 | 弹窗信息内容。 |
| placementOnTop | boolean | 否 | 是否在组件上方显示,默认值为false。 |
| primaryButton | {<br/>value:&nbsp;string,<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | 第一个按钮。<br/>value:&nbsp;弹窗里主按钮的文本。<br/>action:&nbsp;点击主按钮的回调函数。 |
| secondaryButton | {<br/>value:&nbsp;string,<br/>action:&nbsp;()&nbsp;=&gt;&nbsp;void<br/>} | 否 | 第二个按钮。<br/>value:&nbsp;弹窗里辅助按钮的文本。<br/>action:&nbsp;点击辅助按钮的回调函数。 |
| onStateChange | (event:{isVisible:&nbsp;boolean })&nbsp;=&gt;&nbsp;void | 否 | 弹窗状态变化事件回调,参数isVisible为弹窗当前的显示状态。 |
## CustomPopupOptions<sup>8+</sup>类型说明
| 名称 | 类型 | 必填 | 描述 |
| ------------- | ------------------------------------------------------- | ---- | ------------------------------------------------------------ |
| builder | [CustomBuilder](ts-types.md#custombuilder8) | 是 | 提示气泡内容的构造器。 |
| placement | [Placement](ts-appendix-enums.md#placement8) | 否 | 气泡组件优先显示的位置,当前位置显示不下时,会自动调整位置。<br/>默认值:Placement.Bottom |
| maskColor | [ResourceColor](ts-types.md#resourcecolor) | 否 | 提示气泡遮障层的颜色。 |
| popupColor | [ResourceColor](ts-types.md#resourcecolor) | 否 | 提示气泡的颜色。 |
| enableArrow | boolean | 否 | 是否显示箭头,只有上、下方向的气泡会显示箭头。<br/>默认值:true |
| autoCancel | boolean | 否 | 页面有操作时,是否自动关闭气泡<br/>默认值:true |
| onStateChange | (event:{isVisible:&nbsp;boolean })&nbsp;=&gt;&nbsp;void | 否 | 弹窗状态变化事件回调,参数为弹窗当前的显示状态。 |
## 示例
......
......@@ -5,23 +5,18 @@
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 属性
| 名称 | 参数说明 | 默认值 | 描述 |
| -------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | ------------------------------------------------------------ |
| 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/>} | 设置约束尺寸,组件布局时,进行尺寸范围限制。 |
| layoutWeight | number | 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 | [Padding](ts-types.md#padding)&nbsp;\|&nbsp;[Length](ts-types.md#length) | 设置内边距属性。<br/>参数为Length类型时,四个方向内边距同时生效。<br/>默认值:0 |
| margin | [Margin](ts-types.md#margin)&nbsp;\|&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/>} | 设置约束尺寸,组件布局时,进行尺寸范围限制。<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/>默认值:0<br/>**说明:**<br/>仅在Row/Column/Flex布局中生效。 |
## 示例
......
# 触摸热区设置
适用于支持通用点击事件、通用触摸事件、通用手势处理的组件。
> **说明:**
>
> 从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
适用于支持通用点击事件、通用触摸事件、通用手势处理的组件。
## 权限列表
## 属性
| 名称 | 参数类型 | 默认值 | 描述 |
| -------------- | ---------------------------------------- | ---------------------------------------- | ---------------------------------------- |
| responseRegion | Array&lt;Rectangle&gt;&nbsp;\|&nbsp;Rectangle | {<br/>x:0,<br/>y:0,<br/>width:'100%',<br/>height:'100%'<br/>} | 设置一个或多个触摸热区,包括位置和大小。<br/>>&nbsp;&nbsp;**说明:**<br/>>&nbsp;-百分比是相对于组件本身来度量的。<br/>>&nbsp;-x和y可以设置正负值百分比。当x设置为'100%'时表示热区往右偏移组件本身宽度大小,当x设置为'-100%'时表示热区往左偏移组件本身宽度大小。当y设置为'100%'时表示热区往下偏移组件本身高度大小,当y设置为'-100%'时表示热区往上偏移组件本身高度大小。<br/>>&nbsp;-width和height只能设置正值百分比。width:'100%'表示热区宽度设置为该组件本身的宽度。比如组件本身宽度是100vp,那么'100%'表示热区宽度也为100vp。height:'100%'表示热区高度设置为该组件本身的高度。 |
| 名称 | 参数类型 | 描述 |
| -------------- | --------------------------------------------- | ------------------------------------------------------------ |
| responseRegion | Array&lt;Rectangle&gt;&nbsp;\|&nbsp;Rectangle | 设置一个或多个触摸热区,包括位置和大小。<br/>默认值:<br/>{<br/>x:0,<br/>y:0,<br/>width:'100%',<br/>height:'100%'<br/>} |
### Rectangle对象说明
| 名称 | 类型 | 必填 | 默认值 | 描述 |
| ------ | ------ | ---- | ---- | ------------------ |
| x | Length | 否 | 0vp | 触摸点相对于组件本身左边沿的X坐标。 |
| y | Length | 否 | 0vp | 触摸点相对于组件本身左边沿的Y坐标。 |
| width | Length | 否 | 100% | 触摸热区范围的宽度。 |
| height | Length | 否 | 100% | 触摸热区范围的高度。 |
| ------ | ---------------------------- | ---- | ------ | --------------------------------------------------- |
| x | [Length](ts-types.md#length) | 否 | 0vp | 触摸点相对于组件本身左边沿的X坐标。<br/>默认值:0vp |
| y | [Length](ts-types.md#length) | 否 | 0vp | 触摸点相对于组件本身左边沿的Y坐标。<br/>默认值:0vp |
| width | [Length](ts-types.md#length) | 否 | 100% | 触摸热区范围的宽度。<br/>默认值:100% |
| height | [Length](ts-types.md#length) | 否 | 100% | 触摸热区范围的高度。<br/>默认值:100% |
> **说明:**
>
> 当x和y都设置为正值时,表示组件的触摸热区的范围整体往组件本身右下角偏移,偏移的大小可通过数值来设置。
> x和y可以设置正负值百分比。当x设置为'100%'时表示热区往右偏移组件本身宽度大小,当x设置为'-100%'时表示热区往左偏移组件本身宽度大小。当y设置为'100%'时表示热区往下偏移组件本身高度大小,当y设置为'-100%'时表示热区往上偏移组件本身高度大小。
>
> width和height只能设置正值百分比。width:'100%'表示热区宽度设置为该组件本身的宽度。比如组件本身宽度是100vp,那么'100%'表示热区宽度也为100vp。height:'100%'表示热区高度设置为该组件本身的高度。
>
> 百分比是相对于组件本身来度量的。
## 示例
......
......@@ -5,26 +5,22 @@
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 事件
| 名称 | 支持冒泡 | 功能描述 |
| ---------------------------------------- | ---- | --------------------------------- |
| onClick(callback:&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坐标。 |
| screenY | number | 点击点相对于设备屏幕上边沿的Y坐标。 |
| x | number | 点击点相对于被点击元素左边沿的X坐标。 |
| y | number | 点击点相对于被点击元素上边沿的Y坐标。 |
| target<sup>8+</sup> | [EventTarget](#eventtarget8对象说明) | 被点击元素对象。 |
| timestamp | number | 事件时间戳。 |
| timestamp<sup>8+</sup> | number | 事件时间戳。 |
| source<sup>8+</sup> | [SourceType](ts-gesture-settings.md) | 事件输入设备。 |
## EventTarget<sup>8+</sup>对象说明
| 名称 | 参数类型 | 描述 |
......
......@@ -5,16 +5,11 @@
> 从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 事件
| 名称 | 是否冒泡 | 功能描述 |
| ---------------------------------------- | ---- | ---------------------------------------- |
| onTouch(callback:&nbsp;(event?:&nbsp;TouchEvent)&nbsp;=&gt;&nbsp;void) | 是 | 触摸动作触发该方法调用,event参数见[TouchEvent](#touchevent对象说明)介绍。 |
| ------------------------------------------------------------ | -------- | ------------------------------------------------------------ |
| onTouch(event:&nbsp;(event?:&nbsp;TouchEvent)&nbsp;=&gt;&nbsp;void) | 是 | 触摸动作触发该方法调用,event参数见[TouchEvent](#touchevent对象说明)介绍。 |
## TouchEvent对象说明
......
......@@ -5,17 +5,12 @@
> 从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
## 权限列表
## 事件
| 名称 | 支持冒泡 | 描述 |
| ---------------------------------------- | ---- | ---------------------------------------- |
| onHover(callback:&nbsp;(isHover:&nbsp;boolean)&nbsp;=&gt;&nbsp;void) | 否 | 鼠标进入或退出组件时触发该回调。<br/>isHover:表示鼠标是否悬浮在组件上,鼠标进入时为true,&nbsp;退出时为false。 |
| onMouse(callback:&nbsp;(event?:&nbsp;MouseEvent)&nbsp;=&gt;&nbsp;void) | 是 | 当前组件被鼠标按键点击时或者鼠标在组件上移动时,触发该回调,event参数包含触发事件时的时间戳、鼠标按键、动作、点击触点在整个屏幕上的坐标和点击触点相对于当前组件的坐标。 |
| ------------------------------------------------------------ | -------- | ------------------------------------------------------------ |
| onHover(event:&nbsp;(isHover:&nbsp;boolean)&nbsp;=&gt;&nbsp;void) | 否 | 鼠标进入或退出组件时触发该回调。<br/>isHover:表示鼠标是否悬浮在组件上,鼠标进入时为true,&nbsp;退出时为false。 |
| onMouse(event:&nbsp;(event?:&nbsp;MouseEvent)&nbsp;=&gt;&nbsp;void) | 是 | 当前组件被鼠标按键点击时或者鼠标在组件上移动时,触发该回调,event参数包含触发事件时的时间戳、鼠标按键、动作、点击触点在整个屏幕上的坐标和点击触点相对于当前组件的坐标。 |
## MouseEvent对象说明
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册