• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# 鼠标光标控制
2
3控制鼠标光标的显示样式。
4
5>  **说明：**
6>
7>  从API Version 11开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
8
9
10## cursorControl
11
12### setCursor
13
14setCursor(value: PointerStyle): void
15
16方法语句中可使用的全局接口，调用此接口可以更改当前的鼠标光标样式。
17
18**参数：**
19
20| 名称 | 类型 | 必填 | 描述 |
21| ----- | ------ | ---- | ---- |
22| value | [PointerStyle](../../apis-input-kit/js-apis-pointer.md#pointerstyle) | 是   | 设置的鼠标样式。 |
23
24
25### restoreDefault
26
27restoreDefault(): void
28
29方法语句中可使用的全局接口，调用此接口可以将鼠标光标恢复成默认的箭头光标样式。
30
31
32## 示例
33
34
35```ts
36// xxx.ets
37import pointer from '@ohos.multimodalInput.pointer';
38
39@Entry
40@Component
41struct CursorControlExample {
42  @State text: string = ''
43  controller: TextInputController = new TextInputController()
44
45  build() {
46    Column() {
47      Row().height(200).width(200).backgroundColor(Color.Green).position({x: 150 ,y:70})
48        .onHover((flag) => {
49          if (flag) {
50            cursorControl.setCursor(pointer.PointerStyle.EAST)
51          } else {
52            cursorControl.restoreDefault()
53          }
54        })
55      Row().height(200).width(200).backgroundColor(Color.Blue).position({x: 220 ,y:120})
56        .onHover((flag) => {
57          if (flag) {
58            cursorControl.setCursor(pointer.PointerStyle.WEST)
59          } else {
60            cursorControl.restoreDefault()
61          }
62        })
63    }.width('100%')
64  }
65}
66```
67示意图：
68
69当鼠标悬浮在蓝色区域时，显示：向西箭头光标
70
71![cursor_blue](figures/cursor_blue.jpg)
72
73当鼠标悬浮在绿色区域时，显示：向东箭头光标
74
75![cursor_green](figures/cursor_green.jpg)