1# 鼠标光标开发指导 2 3## 场景介绍 4 5鼠标光标控制提供对鼠标光标显示隐藏、光标样式查询设置的能力。使用场景例如：用户在全屏观看视频时，开发者可以控制鼠标光标的显示隐藏；当用户执行取色时，开发者可以将鼠标光标样式切换为取色器样式。 6 7## 导入模块 8 9```js 10import pointer from '@ohos.multimodalInput.pointer'; 11``` 12 13## 接口说明 14 15鼠标光标控制常用接口如下表所示，接口详细介绍请参见[ohos.multimodalInput.pointer文档](../reference/apis/js-apis-pointer.md) 16 17| 实例名 | 接口名 | 说明 | 18| ------- | ------------------------------------------------------------ | ------------------------------------------------------------ | 19| pointer | function isPointerVisible(callback: AsyncCallback\<boolean>): void; | 获取鼠标指针显示或隐藏状态。 | 20| pointer | function setPointerVisible(visible: boolean, callback: AsyncCallback\<void>): void; | 设置鼠标指针显示或隐藏状态，改接口会影响全局鼠标光标的显示状态。 | 21| pointer | function setPointerStyle(windowId: number, pointerStyle: PointerStyle, callback: AsyncCallback\<void>): void; | 设置鼠标光标样式，改接口会影响指定窗口鼠标光标样式。 | 22| pointer | function getPointerStyle(windowId: number, callback: AsyncCallback\<PointerStyle>): void; | 查询鼠标光标样式。 | 23 24## 设置鼠标光标隐藏 25 26用户在全屏观看视频时，可以调用鼠标光标的隐藏接口设置鼠标光标不可见，提升用户体验。 27 28## 开发步骤 29 301. 应用切换到全屏播放。 312. 在应用中调用鼠标光标隐藏接口隐藏光标。 323. 应用退出全屏播放。 334. 在应用中调用鼠标光标显示接口显示光标。 34 35```js 36import pointer from '@ohos.multimodalInput.pointer'; 37 38// 1.应用切换到全屏播放 39// 2.调用鼠标光标隐藏接口隐藏光标 40try { 41 pointer.setPointerVisible(false, (error) => { 42 if (error) { 43 console.log(`Set pointer visible failed, error: ${JSON.stringify(error, [`code`, `message`])}`); 44 return; 45 } 46 console.log(`Set pointer visible success.`); 47 }); 48} catch (error) { 49 console.log(`The mouse pointer hide attributes is failed. ${JSON.stringify(error, [`code`, `message`])}`); 50} 51 52// 3.应用退出全屏播放 53// 4.调用鼠标光标显示接口显示光标 54try { 55 pointer.setPointerVisible(true, (error) => { 56 if (error) { 57 console.log(`Set pointer visible failed, error: ${JSON.stringify(error, [`code`, `message`])}`); 58 return; 59 } 60 console.log(`Set pointer visible success.`); 61 }); 62} catch (error) { 63 console.log(`Set pointer visible failed, ${JSON.stringify(error, [`code`, `message`])}`); 64} 65``` 66 67## 设置鼠标光标样式 68 69当开发者设计取色器特性时，可以将鼠标光标样式切换为取色器样式，完成取色后，设置鼠标光标样式为默认样式，该接口设置和查询当前应用内指定窗口的光标样式，总共可设置39种光标样式，具体参考[光标样式](../reference/apis/js-apis-pointer.md#pointerstyle9)。 70 71### 开发步骤 72 731. 开发者使能取色功能。 742. 调用窗口实例获取对应的窗口id。 753. 设置鼠标光标样式为取色器样式。 764. 取色结束。 775. 设置鼠标光标样式为默认样式。 78 79```js 80import pointer from '@ohos.multimodalInput.pointer'; 81import window from '@ohos.window'; 82 83// 1.开发者使能取色功能 84// 2.调用窗口实例获取对应的窗口id 85window.getLastWindow(this.context, (error, windowClass) => { 86 if (error.code) { 87 console.error('Failed to obtain the top window. Cause: ' + JSON.stringify(error)); 88 return; 89 } 90 var windowId = windowClass.getWindowProperties().id; 91 if (windowId < 0) { 92 console.log(`Invalid windowId`); 93 return; 94 } 95 try { 96 // 3.设置鼠标光标样式为取色器样式 97 pointer.setPointerStyle(windowId, pointer.PointerStyle.COLOR_SUCKER).then(() => { 98 console.log(`Successfully set mouse pointer style`); 99 }); 100 } catch (error) { 101 console.log(`Failed to set the pointer style, error=${JSON.stringify(error)}, msg=${JSON.stringify(`message`)}`); 102 } 103}); 104// 4.取色结束 105window.getLastWindow(this.context, (error, windowClass) => { 106 if (error.code) { 107 console.error('Failed to obtain the top window. Cause: ' + JSON.stringify(error)); 108 return; 109 } 110 var windowId = windowClass.getWindowProperties().id; 111 if (windowId < 0) { 112 console.log(`Invalid windowId`); 113 return; 114 } 115 try { 116 // 5.设置鼠标光标样式为默认样式 117 pointer.setPointerStyle(windowId, pointer.PointerStyle.DEFAULT).then(() => { 118 console.log(`Successfully set mouse pointer style`); 119 }); 120 } catch (error) { 121 console.log(`Failed to set the pointer style, error=${JSON.stringify(error)}, msg=${JSON.stringify(`message`)}`); 122 } 123}); 124``` 125