Class StateMaterialSet

constructor

• new StateMaterialSet(
      param: {
          disable?: StateMaterialType;
          down?: StateMaterialType;
          downSelect?: StateMaterialType;
          normal: StateMaterialType;
          normalSelect?: StateMaterialType;
          over?: StateMaterialType;
          overSelect?: StateMaterialType;
      },
  ): StateMaterialSet

  Creates a new StateMaterialSet with the specified materials for different states.

  Parameters

  • param: {
        disable?: StateMaterialType;
        down?: StateMaterialType;
        downSelect?: StateMaterialType;
        normal: StateMaterialType;
        normalSelect?: StateMaterialType;
        over?: StateMaterialType;
        overSelect?: StateMaterialType;
    }

    Configuration object containing materials for each state

    • Optionaldisable?: StateMaterialType

      Material for disabled state (optional, fallback to normal)

    • Optionaldown?: StateMaterialType

      Material for pressed state (optional, fallback to normal)

    • OptionaldownSelect?: StateMaterialType

      Material for pressed selected state (optional, fallback to normal)

    • normal: StateMaterialType

      Material for normal state (required)

    • OptionalnormalSelect?: StateMaterialType

      Material for normal selected state (optional, fallback to normal)

    • Optionalover?: StateMaterialType

      Material for hover state (optional, fallback to normal)

    • OptionaloverSelect?: StateMaterialType

      Material for hover selected state (optional, fallback to normal)

  Returns StateMaterialSet

  Example

  // Basic usage
  const materialSet = new StateMaterialSet({
    normal: new MeshBasicMaterial({ color: 0x888888 }),
    over: new MeshBasicMaterial({ color: 0xaaaaaa })
  });
  Copy

  Throws

  When normal material is not provided

disable

down

downSelect

materials

normal

normalSelect

over

overSelect

getMaterial

• getMaterial(
      state: ClickableState,
      enabled: boolean,
      isSelected?: boolean,
  ): StateMaterial

  Gets the appropriate StateMaterial for the given interaction state and conditions.

  Parameters

  • state: ClickableState

    The current interaction state (normal, over, down)

  • enabled: boolean

    Whether the interaction handler is enabled

  • isSelected: boolean = false

    Whether the object is in selected state (default: false)

  Returns StateMaterial

  The StateMaterial instance for the specified conditions

  Remarks

  State selection priority:

  1. If enabled is false, always returns disable material
  2. Otherwise, returns the appropriate material based on state and selection:
     • normal + selected = normalSelect
     • over + selected = overSelect
     • down + selected = downSelect
     • normal = normal
     • over = over
     • down = down

  Example

  const materialSet = new StateMaterialSet({
    normal: normalMat,
    over: hoverMat,
    disable: disabledMat
  });
  
  // Get normal material
  const normal = materialSet.getMaterial("normal", true, false);
  
  // Get hover material for selected object
  const hoverSelected = materialSet.getMaterial("over", true, true);
  
  // Get disabled material (ignores state and selection)
  const disabled = materialSet.getMaterial("over", false, true);
  Copy

init

• init(): void

  Returns void

setOpacity

• setOpacity(opacity: number): void

  Sets the opacity for all managed materials simultaneously.

  Parameters

  • opacity: number

    The opacity multiplier to apply (0.0 to 1.0)

  Returns void

  Remarks

  Applies the opacity multiplier to all managed StateMaterial instances simultaneously.

  Example

  // Set all materials to 50% of their original opacity
  materialSet.setOpacity(0.5);
  
  // Make invisible or restore original opacity
  materialSet.setOpacity(0.0); // invisible
  materialSet.setOpacity(1.0); // original
  Copy