• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# 事件独占控制
2
3设置组件是否独占事件,事件范围包括组件自带的事件和开发者自定义的点击、触摸、手势事件。<br />
4在一个窗口内,设置了独占控制的组件上的事件如果首先响应,则本次交互只允许此组件上设置的事件响应,窗口内其他组件上的事件不会响应。
5
6>  **说明:**
7>
8>  从API Version 11开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
9
10## monopolizeEvents
11
12monopolizeEvents(monopolize: boolean)
13
14设置组件是否独占事件。
15
16**系统能力:** SystemCapability.ArkUI.ArkUI.Full
17
18**参数:**
19
20
21| 参数名   | 类型 | 必填 | 说明                  |
22| ----------- | -------- | ------------------------ | ------------------------ |
23| monopolize | boolean  | 是 | 设置组件是否独占事件。<br />默认值:false <br />**说明:**<br />1、如果第一根手指触发了组件事件独占,在抬起前又按下了一根手指,则第二根手指的交互继续处于组件独占状态,依次类推。<br />2、如果开发者通过[parallelGesture](ts-gesture-settings.md)绑定了与子组件同时触发的手势,如[PanGesture](ts-basic-gestures-pangesture.md),子组件设置了独占控制且首个响应事件,则父组件的手势不会响应。|
24
25## 示例
26
27```ts
28// xxx.ets
29@Entry
30@Component
31struct Index {
32  @State message: string = 'set monopolizeEvents false'
33  @State monopolize: boolean = false
34
35  build() {
36    Column() {
37      Text(this.message)
38      Column() {
39        Column(){}
40        // this.monopolize是true时,点击内层column只会触发自身的触摸事件,不会触发外层column的触摸事件
41        // this.monopolize是false时,点击内层column会同时触发自身的触摸事件和外层column的触摸事件
42        .monopolizeEvents(this.monopolize)
43        .width('100%')
44        .height('40%')
45        .backgroundColor(Color.Blue)
46        // 内层column绑定触摸事件
47        .onTouch((event:TouchEvent)=>{
48            if (event.type == TouchType.Down) {
49                console.log("inner column touch down")
50            }
51        })
52        Button('change monopolizeEvents')
53        // 通过button的点击事件来切换内层column的独占控制属性
54          .onClick(()=>{
55              this.monopolize = !this.monopolize
56            if (!this.monopolize) {
57              this.message = "set monopolizeEvents false"
58            } else {
59              this.message = "set monopolizeEvents true"
60            }
61          })
62      }
63      .backgroundColor(Color.Gray)
64      .height('100%')
65      .width('100%')
66      // 外层column绑定触摸事件
67      .onTouch((event)=>{
68        if (event.type == TouchType.Down) {
69          console.log("outside column touch down")
70        }
71      })
72    }
73    .height('100%')
74  }
75}
76```
77