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

!21850...

!21850 【挑单4.0Beta2】keyEvent增加intentionCode、ClickEvent/TouchObject/MouseEvent/DragEvent增加displayX/Y, windowX/Y 废弃 screenX/Y
Merge pull request !21850 from 胡清云/cherry-pick-1691027238
...@@ -19,13 +19,17 @@ ...@@ -19,13 +19,17 @@
| 名称 | 类型 | 描述 | | 名称 | 类型 | 描述 |
| ------------------- | ------------------------------------ | -------------------------------------------------------- | | ------------------- | ------------------------------------ | -------------------------------------------------------- |
| screenX | number | 点击位置相对于应用窗口左上角的X坐标。 |
| screenY | number | 点击位置相对于应用窗口左上角的Y坐标。 |
| x | number | 点击位置相对于被点击元素左上角的X坐标。 | | x | number | 点击位置相对于被点击元素左上角的X坐标。 |
| y | number | 点击位置相对于被点击元素左上角的Y坐标。 | | y | number | 点击位置相对于被点击元素左上角的Y坐标。 |
| timestamp<sup>8+</sup> | number | 事件时间戳。触发事件时距离系统启动的时间间隔,单位纳秒。 | | timestamp<sup>8+</sup> | number | 事件时间戳。触发事件时距离系统启动的时间间隔,单位纳秒。 |
| target<sup>8+</sup> | [EventTarget](#eventtarget8对象说明) | 触发事件的元素对象显示区域。 | | target<sup>8+</sup> | [EventTarget](#eventtarget8对象说明) | 触发事件的元素对象显示区域。 |
| source<sup>8+</sup> | [SourceType](ts-gesture-settings.md#sourcetype枚举说明) | 事件输入设备。 | | source<sup>8+</sup> | [SourceType](ts-gesture-settings.md#sourcetype枚举说明) | 事件输入设备。 |
| windowX<sup>10+</sup> | number | 点击位置相对于应用窗口左上角的X坐标。 |
| windowY<sup>10+</sup> | number | 点击位置相对于应用窗口左上角的Y坐标。 |
| displayX<sup>10+</sup> | number | 点击位置相对于应用屏幕左上角的X坐标。 |
| displayY<sup>10+</sup> | number | 点击位置相对于应用屏幕左上角的Y坐标。 |
| screenX<sup>(deprecated)</sup> | number | 点击位置相对于应用窗口左上角的X坐标。<br>从API verdion 10开始不再维护,建议使用windowX代替。 |
| screenY<sup>(deprecated)</sup> | number | 点击位置相对于应用窗口左上角的Y坐标。<br>从API verdion 10开始不再维护,建议使用windowY代替。 |
## EventTarget<sup>8+</sup>对象说明 ## EventTarget<sup>8+</sup>对象说明
...@@ -51,14 +55,14 @@ struct ClickExample { ...@@ -51,14 +55,14 @@ struct ClickExample {
Row({ space: 20 }) { Row({ space: 20 }) {
Button('Click').width(100).height(40) Button('Click').width(100).height(40)
.onClick((event: ClickEvent) => { .onClick((event: ClickEvent) => {
this.text = 'Click Point:' + '\n screenX:' + event.screenX + '\n screenY:' + event.screenY this.text = 'Click Point:' + '\n windowX:' + event.windowX + '\n windowY:' + event.windowY
+ '\n x:' + event.x + '\n y:' + event.y + '\ntarget:' + '\n component globalPos:(' + '\n x:' + event.x + '\n y:' + event.y + '\ntarget:' + '\n component globalPos:('
+ event.target.area.globalPosition.x + ',' + event.target.area.globalPosition.y + ')\n width:' + event.target.area.globalPosition.x + ',' + event.target.area.globalPosition.y + ')\n width:'
+ event.target.area.width + '\n height:' + event.target.area.height + '\ntimestamp' + event.timestamp; + event.target.area.width + '\n height:' + event.target.area.height + '\ntimestamp' + event.timestamp;
}) })
Button('Click').width(200).height(50) Button('Click').width(200).height(50)
.onClick((event: ClickEvent) => { .onClick((event: ClickEvent) => {
this.text = 'Click Point:' + '\n screenX:' + event.screenX + '\n screenY:' + event.screenY this.text = 'Click Point:' + '\n windowX:' + event.windowX + '\n windowY:' + event.windowY
+ '\n x:' + event.x + '\n y:' + event.y + '\ntarget:' + '\n component globalPos:(' + '\n x:' + event.x + '\n y:' + event.y + '\ntarget:' + '\n component globalPos:('
+ event.target.area.globalPosition.x + ',' + event.target.area.globalPosition.y + ')\n width:' + event.target.area.globalPosition.x + ',' + event.target.area.globalPosition.y + ')\n width:'
+ event.target.area.width + '\n height:' + event.target.area.height + '\ntimestamp' + event.timestamp; + event.target.area.width + '\n height:' + event.target.area.height + '\ntimestamp' + event.timestamp;
......
...@@ -49,8 +49,6 @@ ...@@ -49,8 +49,6 @@
| 名称 | 类型 | 描述 | | 名称 | 类型 | 描述 |
| ------ | ------ | ---------------- | | ------ | ------ | ---------------- |
| getX() | number | 当前拖拽点相对于屏幕左上角的x轴坐标,单位为vp。 |
| getY() | number | 当前拖拽点相对于屏幕左上角的y轴坐标,单位为vp。 |
| useCustomDropAnimation<sup>10+</sup> | boolean | 当拖拽结束时,是否使用系统默认落入动画。 | | useCustomDropAnimation<sup>10+</sup> | boolean | 当拖拽结束时,是否使用系统默认落入动画。 |
| setData(unifiedData: [UnifiedData](../apis/js-apis-data-udmf.md#unifieddata))<sup>10+</sup> | void | 向DragEvent中设置拖拽相关数据。 | | setData(unifiedData: [UnifiedData](../apis/js-apis-data-udmf.md#unifieddata))<sup>10+</sup> | void | 向DragEvent中设置拖拽相关数据。 |
| getData()<sup>10+</sup> | [UnifiedData](../apis/js-apis-data-udmf.md#unifieddata) | 从DragEvent中获取拖拽相关数据。 | | getData()<sup>10+</sup> | [UnifiedData](../apis/js-apis-data-udmf.md#unifieddata) | 从DragEvent中获取拖拽相关数据。 |
...@@ -61,6 +59,12 @@ ...@@ -61,6 +59,12 @@
| getVelocityX()<sup>10+</sup> | number | 获取当前拖拽的x轴方向拖动速度。坐标轴原点为屏幕左上角,单位为vp,分正负方向速度,从左往右为正,反之为负。 | | getVelocityX()<sup>10+</sup> | number | 获取当前拖拽的x轴方向拖动速度。坐标轴原点为屏幕左上角,单位为vp,分正负方向速度,从左往右为正,反之为负。 |
| getVelocityY()<sup>10+</sup> | number | 获取当前拖拽的y轴方向拖动速度。坐标轴原点为屏幕左上角,单位为vp,分正负方向速度,从上往下为正,反之为负。 | | getVelocityY()<sup>10+</sup> | number | 获取当前拖拽的y轴方向拖动速度。坐标轴原点为屏幕左上角,单位为vp,分正负方向速度,从上往下为正,反之为负。 |
| getVelocity()<sup>10+</sup> | number | 获取当前拖拽的主方向拖动速度。为xy轴方向速度的平方和的算术平方根。 | | getVelocity()<sup>10+</sup> | number | 获取当前拖拽的主方向拖动速度。为xy轴方向速度的平方和的算术平方根。 |
| getWindowX()<sup>10+</sup> | number | 当前拖拽点相对于窗口左上角的x轴坐标,单位为vp。 |
| getWindowY()<sup>10+</sup> | number | 当前拖拽点相对于窗口左上角的y轴坐标,单位为vp。 |
| getDisplayX()<sup>10+</sup> | number | 当前拖拽点相对于屏幕左上角的x轴坐标,单位为vp。 |
| getDisplayY()<sup>10+</sup> | number | 当前拖拽点相对于屏幕左上角的y轴坐标,单位为vp。 |
| getX()<sup>(deprecated)</sup> | number | 当前拖拽点相对于窗口左上角的x轴坐标,单位为vp。<br>从API verdion 10开始不再维护,建议使用getWindowX()代替。 |
| getY()<sup>(deprecated)</sup> | number | 当前拖拽点相对于窗口左上角的y轴坐标,单位为vp。<br>从API verdion 10开始不再维护,建议使用getWindowY()代替。 |
## DragRet<sup>10+</sup>枚举说明 ## DragRet<sup>10+</sup>枚举说明
......
...@@ -27,6 +27,7 @@ ...@@ -27,6 +27,7 @@
| metaKey | number | 按键发生时元键(即Windows键盘的WIN键、Mac键盘的Command键)的状态,1表示按压态,0表示未按压态。 | | metaKey | number | 按键发生时元键(即Windows键盘的WIN键、Mac键盘的Command键)的状态,1表示按压态,0表示未按压态。 |
| timestamp | number | 按键发生时的时间戳。 | | timestamp | number | 按键发生时的时间戳。 |
| stopPropagation | () => void | 阻塞事件冒泡传递。 | | stopPropagation | () => void | 阻塞事件冒泡传递。 |
| intentionCode<sup>10+</sup> | [IntentionCode](../apis/js-apis-intentioncode.md) | 按键对应的意图。 |
## 示例 ## 示例
...@@ -49,7 +50,7 @@ struct KeyEventExample { ...@@ -49,7 +50,7 @@ struct KeyEventExample {
if (event.type === KeyType.Up) { if (event.type === KeyType.Up) {
this.eventType = 'Up' this.eventType = 'Up'
} }
this.text = 'KeyType:' + this.eventType + '\nkeyCode:' + event.keyCode + '\nkeyText:' + event.keyText this.text = 'KeyType:' + this.eventType + '\nkeyCode:' + event.keyCode + '\nkeyText:' + event.keyText + '\nintentionCode:' + event.intentionCode
}) })
Text(this.text).padding(15) Text(this.text).padding(15)
}.height(300).width('100%').padding(35) }.height(300).width('100%').padding(35)
...@@ -57,4 +58,4 @@ struct KeyEventExample { ...@@ -57,4 +58,4 @@ struct KeyEventExample {
} }
``` ```
![keyEvent](figures/keyEvent.png) ![keyEvent](figures/keyEvent.gif)
...@@ -34,10 +34,14 @@ ...@@ -34,10 +34,14 @@
| ------- | ------------------------------------------- | ------------------------------------- | | ------- | ------------------------------------------- | ------------------------------------- |
| type | [TouchType](ts-appendix-enums.md#touchtype) | 触摸事件的类型。 | | type | [TouchType](ts-appendix-enums.md#touchtype) | 触摸事件的类型。 |
| id | number | 手指唯一标识符。 | | id | number | 手指唯一标识符。 |
| screenX | number | 触摸点相对于应用窗口左上角的X坐标。 |
| screenY | number | 触摸点相对于应用窗口左上角的Y坐标。 |
| x | number | 触摸点相对于被触摸元素左上角的X坐标。 | | x | number | 触摸点相对于被触摸元素左上角的X坐标。 |
| y | number | 触摸点相对于被触摸元素左上角的Y坐标。 | | y | number | 触摸点相对于被触摸元素左上角的Y坐标。 |
| windowX<sup>10+</sup> | number | 触摸点相对于应用窗口左上角的X坐标。 |
| windowY<sup>10+</sup> | number | 触摸点相对于应用窗口左上角的Y坐标。 |
| displayX<sup>10+</sup> | number | 触摸点相对于应用屏幕左上角的X坐标。 |
| displayY<sup>10+</sup> | number | 触摸点相对于应用屏幕左上角的Y坐标。 |
| screenX<sup>(deprecated)</sup> | number | 触摸点相对于应用窗口左上角的X坐标。<br>从API verdion 10开始不再维护,建议使用windowX代替。 |
| screenY<sup>(deprecated)</sup> | number | 触摸点相对于应用窗口左上角的Y坐标。<br>从API verdion 10开始不再维护,建议使用windowX代替。 |
## HistoricalPoint<sup>10+</sup>对象说明 ## HistoricalPoint<sup>10+</sup>对象说明
......
...@@ -23,8 +23,6 @@ ...@@ -23,8 +23,6 @@
| 名称 | 属性类型 | 描述 | | 名称 | 属性类型 | 描述 |
| ---------------------- | ---------------------------------------- | ---------------------------- | | ---------------------- | ---------------------------------------- | ---------------------------- |
| screenX | number | 鼠标位置相对于应用窗口左上角的x轴坐标。 |
| screenY | number | 鼠标位置相对于应用窗口左上角的y轴坐标。 |
| x | number | 鼠标位置相对于当前组件左上角的x轴坐标。 | | x | number | 鼠标位置相对于当前组件左上角的x轴坐标。 |
| y | number | 鼠标位置相对于当前组件左上角的y轴坐标。 | | y | number | 鼠标位置相对于当前组件左上角的y轴坐标。 |
| button | [MouseButton](ts-appendix-enums.md#mousebutton) | 鼠标按键。 | | button | [MouseButton](ts-appendix-enums.md#mousebutton) | 鼠标按键。 |
...@@ -33,6 +31,12 @@ ...@@ -33,6 +31,12 @@
| timestamp<sup>8+</sup> | number | 事件时间戳。触发事件时距离系统启动的时间间隔,单位纳秒。 | | timestamp<sup>8+</sup> | number | 事件时间戳。触发事件时距离系统启动的时间间隔,单位纳秒。 |
| target<sup>8+</sup> | [EventTarget](ts-universal-events-click.md#eventtarget8对象说明) | 触发事件的元素对象显示区域。 | | target<sup>8+</sup> | [EventTarget](ts-universal-events-click.md#eventtarget8对象说明) | 触发事件的元素对象显示区域。 |
| source<sup>8+</sup> | [SourceType](ts-gesture-settings.md#sourcetype枚举说明) | 事件输入设备。 | | source<sup>8+</sup> | [SourceType](ts-gesture-settings.md#sourcetype枚举说明) | 事件输入设备。 |
| windowX<sup>10+</sup> | number | 鼠标位置相对于应用窗口左上角的x轴坐标。 |
| windowY<sup>10+</sup> | number | 鼠标位置相对于应用窗口左上角的y轴坐标。 |
| displayX<sup>10+</sup> | number | 鼠标位置相对于应用屏幕左上角的x轴坐标。 |
| displayY<sup>10+</sup> | number | 鼠标位置相对于应用屏幕左上角的y轴坐标。 |
| screenX<sup>(deprecated)</sup> | number | 鼠标位置相对于应用窗口左上角的x轴坐标。<br>从API verdion 10开始不再维护,建议使用windowX代替。 |
| screenY<sup>(deprecated)</sup> | number | 鼠标位置相对于应用窗口左上角的y轴坐标。<br>从API verdion 10开始不再维护,建议使用windowY代替。 |
## HoverEvent<sup>10+</sup>对象说明 ## HoverEvent<sup>10+</sup>对象说明
...@@ -107,7 +111,7 @@ struct MouseEventExample { ...@@ -107,7 +111,7 @@ struct MouseEventExample {
} }
this.mouseText = 'onMouse:\nButton = ' + this.mouseBtn + this.mouseText = 'onMouse:\nButton = ' + this.mouseBtn +
'\nAction = ' + this.action + '\nXY=(' + event.x + ',' + event.y + ')' + '\nAction = ' + this.action + '\nXY=(' + event.x + ',' + event.y + ')' +
'\nscreenXY=(' + event.screenX + ',' + event.screenY + ')'; '\nwindowXY=(' + event.windowX + ',' + event.windowY + ')';
}) })
Text(this.mouseText) Text(this.mouseText)
}.padding({ top: 30 }).width('100%') }.padding({ top: 30 }).width('100%')
......
...@@ -102,7 +102,7 @@ onMouse(event: (event?: MouseEvent) => void) ...@@ -102,7 +102,7 @@ onMouse(event: (event?: MouseEvent) => void)
鼠标事件回调。绑定该API的组件每当鼠标指针在该组件内产生行为(MouseAction)时,触发事件回调,参数为[MouseEvent](../reference/arkui-ts/ts-universal-mouse-key.md)对象,表示触发此次的鼠标事件。该事件支持自定义冒泡设置,默认父子冒泡。常见用于开发者自定义的鼠标行为逻辑处理。 鼠标事件回调。绑定该API的组件每当鼠标指针在该组件内产生行为(MouseAction)时,触发事件回调,参数为[MouseEvent](../reference/arkui-ts/ts-universal-mouse-key.md)对象,表示触发此次的鼠标事件。该事件支持自定义冒泡设置,默认父子冒泡。常见用于开发者自定义的鼠标行为逻辑处理。
开发者可以通过回调中的MouseEvent对象获取触发事件的坐标(screenX/screenY/x/y)、按键([MouseButton](../reference/arkui-ts/ts-appendix-enums.md#mousebutton))、行为([MouseAction](../reference/arkui-ts/ts-appendix-enums.md#mouseaction))、时间戳(timestamp)、交互组件的区域([EventTarget](../reference/arkui-ts/ts-universal-events-click.md))、事件来源([SourceType](../reference/arkui-ts/ts-gesture-settings.md))等。MouseEvent的回调函数stopPropagation用于设置当前事件是否阻止冒泡。 开发者可以通过回调中的MouseEvent对象获取触发事件的坐标(displayX/displayY/windowX/windowY/x/y)、按键([MouseButton](../reference/arkui-ts/ts-appendix-enums.md#mousebutton))、行为([MouseAction](../reference/arkui-ts/ts-appendix-enums.md#mouseaction))、时间戳(timestamp)、交互组件的区域([EventTarget](../reference/arkui-ts/ts-universal-events-click.md))、事件来源([SourceType](../reference/arkui-ts/ts-gesture-settings.md))等。MouseEvent的回调函数stopPropagation用于设置当前事件是否阻止冒泡。
>**说明:** >**说明:**
...@@ -134,7 +134,7 @@ struct MouseExample { ...@@ -134,7 +134,7 @@ struct MouseExample {
'button = ' + event.button + '\n' + 'button = ' + event.button + '\n' +
'action = ' + event.action + '\n' + 'action = ' + event.action + '\n' +
'x,y = (' + event.x + ',' + event.y + ')' + '\n' + 'x,y = (' + event.x + ',' + event.y + ')' + '\n' +
'screenXY=(' + event.screenX + ',' + event.screenY + ')'; 'windowXY=(' + event.windowX + ',' + event.windowY + ')';
}) })
Divider() Divider()
Text(this.buttonText).fontColor(Color.Green) Text(this.buttonText).fontColor(Color.Green)
...@@ -151,7 +151,7 @@ struct MouseExample { ...@@ -151,7 +151,7 @@ struct MouseExample {
'button = ' + event.button + '\n' + 'button = ' + event.button + '\n' +
'action = ' + event.action + '\n' + 'action = ' + event.action + '\n' +
'x,y = (' + event.x + ',' + event.y + ')' + '\n' + 'x,y = (' + event.x + ',' + event.y + ')' + '\n' +
'screenXY=(' + event.screenX + ',' + event.screenY + ')'; 'windowXY=(' + event.windowX + ',' + event.windowY + ')';
}) })
} }
} }
...@@ -190,7 +190,7 @@ Button(this.isHovered ? 'Hovered!' : 'Not Hover') ...@@ -190,7 +190,7 @@ Button(this.isHovered ? 'Hovered!' : 'Not Hover')
'button = ' + event.button + '\n' + 'button = ' + event.button + '\n' +
'action = ' + event.action + '\n' + 'action = ' + event.action + '\n' +
'x,y = (' + event.x + ',' + event.y + ')' + '\n' + 'x,y = (' + event.x + ',' + event.y + ')' + '\n' +
'screenXY=(' + event.screenX + ',' + event.screenY + ')'; 'windowXY=(' + event.windowX + ',' + event.windowY + ')';
}) })
``` ```
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册