@masatomakino/threejs-interactive-object
    Preparing search index...

    Class CheckBoxObject<Value>

    Legacy alias for CheckBoxInteractionHandler.

    Use CheckBoxInteractionHandler instead. This class will be removed in next minor version.

    This class exists solely for backward compatibility. All functionality is identical to CheckBoxInteractionHandler. See ClickableObject for details on the renaming rationale.

    // ❌ Deprecated usage (still works but shows warning)
    const checkbox = new CheckBoxObject({ view: mesh });

    // ✅ Recommended usage
    const checkbox = new CheckBoxInteractionHandler({ view: mesh });

    CheckBoxInteractionHandler - The recommended replacement class

    Type Parameters

    • Value

      Type of value associated with the checkbox

    Hierarchy (View Summary)

    Index

    Constructors

    constructor

    Properties

    _alpha _enable _isOver _isPress _isSelect _materialSet? frozen mouseEnabled state value view prefixed

    Accessors

    alpha isOver isPress materialSet selection

    Methods

    addListener checkActivity disable emit enable eventNames listenerCount listeners off on once onMouseClick onMouseDownHandler onMouseOutHandler onMouseOverHandler onMouseUpHandler removeAllListeners removeListener switchEnable updateMaterial updateState

    Constructors

    Properties

    Protected Internal_alpha

    _alpha: number = 1.0

    Internal alpha multiplier for opacity control.

    Protected Internal_enable

    _enable: boolean = true

    Internal state tracking enabled/disabled status.

    Protected Internal_isOver

    _isOver: boolean = false

    Internal state tracking pointer hover status.

    Protected Internal_isPress

    _isPress: boolean = false

    Internal state tracking pointer press status.

    Protected_isSelect

    _isSelect: boolean = false

    Protected Optional Internal_materialSet

    _materialSet?: StateMaterialSet

    Internal reference to the material set.

    frozen: boolean = false

    Temporarily prevents interaction handling while maintaining current visual state.

    When frozen is true, the object stops responding to pointer interactions but preserves its current visual state (does not switch to disable state). Useful when you want to temporarily pause interactions without changing the visual appearance to disabled.

    false
    mouseEnabled: boolean = true

    Controls whether the object responds to pointer interactions.

    When set to false, the object will not respond to any pointer interactions. This differs from the disable() method which changes the visual state.

    true
    state: ClickableState = "normal"

    Current visual interaction state of the object.

    Represents the current state used for material selection:

    • normal: Default resting state
    • over: Pointer hovering over the object
    • down: Pointer pressed down on the object
    • disable: Object is disabled and non-interactive
    value: undefined | Value

    Arbitrary data associated with this interactive object.

    The value property allows association of custom data with the interactive object, making it useful for identifying specific buttons in multi-button scenarios or storing configuration data. Event listeners can use this value to determine appropriate responses to interactions.

    // String identifier
    handler.value = 'save-button';

    // Complex object with metadata
    handler.value = { id: 'btn1', action: 'save', data: {...} };
    view: CheckBoxMesh<Value> | CheckBoxSprite<Value>

    The display object being managed by this interaction handler.

    This readonly reference maintains the connection between the handler and the Three.js display object (Mesh, Sprite, or Group).

    prefixed: string | boolean

    Accessors

    • set alpha(value: number): void

      Sets the opacity alpha multiplier for the material set.

      Parameters

      • value: number

        Alpha value between 0.0 (transparent) and 1.0 (opaque)

      Returns void

      Controls the overall opacity of the interactive object by setting an alpha multiplier that is applied to all materials in the material set. This allows for fade effects while preserving the relative opacity differences between different interaction states.

    • get isOver(): boolean

      Indicates whether the pointer is currently hovering over the object.

      Returns boolean

      True if pointer is over the object, false otherwise

    • get isPress(): boolean

      Indicates whether the pointer is currently pressed down on the object.

      Returns boolean

      True if pointer is pressed down, false otherwise

    • get materialSet(): undefined | StateMaterialSet

      Gets the current StateMaterialSet managing visual states.

      Returns undefined | StateMaterialSet

      The current material set, or undefined if none is assigned

    • set materialSet(value: undefined | StateMaterialSet): void

      Sets the StateMaterialSet for managing visual states.

      Parameters

      • value: undefined | StateMaterialSet

        The material set to assign, or undefined to remove

      Returns void

      When a new material set is assigned, the handler automatically updates the display object's material to reflect the current interaction state. Setting the same material set again will not trigger an update.

    Methods

    • Protected

      Checks if the object is currently active and can respond to interactions.

      Returns boolean

      True if the object is enabled and not frozen, false otherwise

      Determines whether the object should respond to pointer interactions by checking both the enabled state and the frozen flag. An object must be both enabled and not frozen to be considered active.

    • Handles pointer click interactions by toggling selection state and emitting select events.

      Returns void

      Overrides base onMouseClick to implement checkbox toggle behavior. Toggles internal selection state, emits select event, and updates material for visual feedback.

      select - Emitted with the updated selection state after toggling

      Called automatically on complete pointer interactions.

    • Handles pointer up events and manages click detection logic.

      Parameters

      Returns void

      Processes pointer up events by resetting press state, determining the next visual state based on hover status, and emitting the up event. If the pointer was previously pressed down, also triggers click event emission through the onMouseClick hook.

      up - Emitted when the pointer is released

      click - Emitted when a complete click interaction is detected

    • Remove all listeners, or those of the specified event.

      Parameters

      • Optionalevent: keyof ThreeMouseEventMap<Value>

      Returns this

    • Switches the interactive object between enabled and disabled states.

      Parameters

      • bool: boolean

        True to enable, false to disable

      Returns void

      Changes the enabled state of the interactive object and immediately updates the interaction state and material. When enabled, the state becomes "normal"; when disabled, the state becomes "disable".

      // Enable the button
      handler.switchEnable(true);

      // Disable the button
      handler.switchEnable(false);

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Accessors
    Methods