pixi.js
    Preparing search index...

    Class FederatedEvent<N>

    A DOM-compatible synthetic event implementation for PixiJS's event system. This class implements the standard DOM Event interface while providing additional functionality specific to PixiJS events.

    Note

    You wont receive an instance of this class directly, but rather a subclass of this class, such as FederatedPointerEvent, FederatedMouseEvent, or FederatedWheelEvent. This class is the base for all federated events.

    // Basic event handling
    sprite.on('pointerdown', (event: FederatedEvent) => {
    // Access standard DOM event properties
    console.log('Target:', event.target);
    console.log('Phase:', event.eventPhase);
    console.log('Type:', event.type);

    // Control propagation
    event.stopPropagation();
    });
    • Implements the standard DOM UIEvent interface
    • Provides event bubbling and capturing phases
    • Supports propagation control
    • Manages event paths through display tree
    • Normalizes native browser events

    Type Parameters

    Hierarchy (View Summary)

    Implements

    Index

    Constructors

    Properties

    AT_TARGET: 2

    The event propagation phase AT_TARGET that indicates that the event is at the target.

    2
    @advanced
    bubbles: boolean = true

    Flags whether this event bubbles. This will take effect only if it is set before propagation.

    BUBBLING_PHASE: 3

    The event propagation phase BUBBLING_PHASE that indicates that the event is in the bubbling phase.

    3
    @advanced
    cancelable: false

    Flags whether this event can be canceled using FederatedEvent.preventDefault. This is always false (for now).

    cancelBubble: boolean = true

    since 7.0.0

    CAPTURING_PHASE: 1

    The event propagation phase CAPTURING_PHASE that indicates that the event is in the capturing phase.

    1
    @advanced
    currentTarget: Container

    The listeners of the event target that are being notified.

    defaultPrevented: boolean = false

    Flags whether the default response of the user agent was prevent through this event.

    detail: number

    Event-specific detail

    eventPhase: number = FederatedEvent.prototype.NONE

    The propagation phase.

    isTrusted: boolean

    Flags whether this is a user-trusted event

    layer: Point = ...

    The coordinates of the event relative to the nearest DOM layer. This is a non-standard property.

    manager: EventBoundary

    The EventBoundary that manages this event. Null for root events.

    nativeEvent: N

    The native event that caused the foremost original event.

    NONE: 0

    The event propagation phase NONE that indicates that the event is not in any phase.

    0
    @advanced
    originalEvent: FederatedEvent<N>

    The original event that caused this event, if any.

    page: Point = ...

    The coordinates of the event relative to the DOM document. This is a non-standard property.

    The composed path of the event's propagation. The target is at the end.

    propagationImmediatelyStopped: boolean = false

    Flags whether propagation was immediately stopped.

    propagationStopped: boolean = false

    Flags whether propagation was stopped.

    returnValue: boolean

    since 7.0.0

    srcElement: EventTarget

    since 7.0.0

    target: Container

    The event target that this will be dispatched to.

    timeStamp: number

    The timestamp of when the event was created.

    type: string

    The type of event, e.g. "mouseup".

    view: Window

    The global Window object.

    Accessors

    • get data(): this

      Fallback for the deprecated InteractionEvent.data.

      Returns this

      since 7.0.0

    • get layerX(): number

      Returns number

    • get layerY(): number

      Returns number

    • get pageX(): number

      Returns number

    • get pageY(): number

      Returns number

    Methods

    • Prevent default behavior of both PixiJS and the user agent.

      Returns void

      sprite.on('click', (event) => {
      // Prevent both browser's default click behavior
      // and PixiJS's default handling
      event.preventDefault();

      // Custom handling
      customClickHandler();
      });
      • Only works if the native event is cancelable
      • Does not stop event propagation
    • Stop this event from propagating to any additional listeners, including those on the current target and any following targets in the propagation path.

      Returns void

      container.on('pointerdown', (event) => {
      // Stop all further event handling
      event.stopImmediatePropagation();

      // These handlers won't be called:
      // - Other pointerdown listeners on this container
      // - Any pointerdown listeners on parent containers
      });
      • Immediately stops all event propagation
      • Prevents other listeners on same target from being called
      • More aggressive than stopPropagation()
    • Stop this event from propagating to the next target in the propagation path. The rest of the listeners on the current target will still be notified.

      Returns void

      child.on('pointermove', (event) => {
      // Handle event on child
      updateChild();

      // Prevent parent handlers from being called
      event.stopPropagation();
      });

      // This won't be called if child handles the event
      parent.on('pointermove', (event) => {
      updateParent();
      });
      • Stops event bubbling to parent containers
      • Does not prevent other listeners on same target
      • Less aggressive than stopImmediatePropagation()