Custom Event Interception

The custom event interception capability provided for components allows you to dynamically determine the HitTestMode attribute of a component based on the position where the event is triggered on the component, as well as other event information such as the input source.

NOTE

The initial APIs of this module are supported since API version 12. Updates will be marked with a superscript to indicate their earliest API version.

onTouchIntercept

onTouchIntercept(callback: Callback<TouchEvent, HitTestMode>): T

Binds a custom event interception callback to a component.

NOTE

This API can be called in attributeModifier since API version 20.

Atomic service API: This API can be used in atomic services since API version 12.

System capability: SystemCapability.ArkUI.ArkUI.Full

Parameters

Name Type Mandatory Description
callback Callback<TouchEvent, HitTestMode> Yes Custom event interception callback. Triggered during hit testing and sets the hit test behavior for the component based on the return value.

Return value

Type Description
T Current component.

Example

This example demonstrates how to modify the HitTestMode attribute of a component using onTouchIntercept.

// xxx.ets
@Entry
@Component
struct Index {
  isPolygon(event: TouchEvent) {
    return true;
  }

  build() {
    Row() {
      Column() {
        Text("hello world")
          .backgroundColor(Color.Blue)
          .fontSize(50)
          .fontWeight(FontWeight.Bold)
          .onClick(() => {
            console.info("Text click");
          })
      }
      .width(400)
      .height(300)
      .backgroundColor(Color.Pink)
      .onClick(() => {
        console.info("Column click");
      })
      // Call onTouchIntercept to modify the HitTestMode attribute of the component.
      .onTouchIntercept((event: TouchEvent) => {
        console.info("OnTouchIntercept + " + JSON.stringify(event));
        // Check whether touches is empty before using it.
        if (event && event.touches) {
          let touches = event.touches;
          for (let i = 0; touches[i] != null; i++) {
            console.info('onTouchIntercept touches:', JSON.stringify(touches[i]));
          }
        }
        if (this.isPolygon(event)) {
          return HitTestMode.None;
        }
        return HitTestMode.Default;
      })
    }
    .width('100%')
  }
}