Skip to main content

Visibility Component

The Visibility component is designed to control the visibility and collision states of 3D objects in real-time. It supports synchronized visibility changes across all connected clients, configurable delays for smooth transitions, and automatic collision management. The component can listen for custom events to trigger visibility changes and emit completion events for chaining actions. Important: This component only handles visibility and collision state management - it does not perform any other actions. You must associate other components or custom logic to trigger the visibility changes and create the desired behaviors.

Download Component

Overview

The VisibilityController component allows you to dynamically control the visibility and collision states of 3D nodes in your scene. It supports both local and synchronized visibility changes, configurable delays for smooth transitions, and automatic collision setup for 3D models. The component acts as a pure state management system - it handles visibility and collision changes, but relies on other components or custom logic to trigger those changes and create the actual behaviors (showing/hiding objects, managing collision states, etc.).

Key Features

  • Dual State Control: Manage both visibility and collision states independently
  • Synchronized Changes: Support for client-server synchronization across all connected players
  • Configurable Delays: Add delays before applying visibility changes for smooth transitions
  • Event-Driven: Listen for custom events to trigger visibility changes
  • Automatic Collision: Automatic collision setup for 3D models with mesh detection
  • Completion Events: Emit events when visibility changes are completed for action chaining
  • Debug System: Comprehensive logging for troubleshooting visibility and collision issues

Video Demo

Watch the Visibility component in action: demonstrating synchronized visibility changes, collision management, and event-driven state control.

Properties

Basic Configuration

PropertyTypeDefaultDescription
appIDstring""Unique identifier for this visibility controller
nodeNamestring""The name of the 3D node in your scene to control
isDebugModebooleanfalseEnable detailed logging for troubleshooting
hasCollisionbooleantrueForces all meshes to have collision
isVisiblebooleantrueInitial visibility state when the app starts

Signal Settings

PropertyTypeDefaultDescription
visibilityControllerIsSyncbooleanfalseSynchronize visibility changes across all clients
visibilityControllerIsVisiblebooleantrueDefault visibility state for events
visibilityControllerHasCollisionbooleantrueDefault collision state for events
visibilityControllerHasDelaybooleantrueEnable delay before applying visibility changes
visibilityControllerDelaynumber0Time in seconds to wait before applying changes
visibilityControllerReceiverstring"[]"JSON array of event names to listen for
visibilityControllerEmitCompletedbooleantrueEmit completion event when changes are finished

Events

Emitted Signals

Event NameDescriptionParameters
visibility-completed-{appID}Visibility change completed{ playerId, timestamp }

Internal Events

Event NameDescriptionDirection
visibility-scServer to client visibilityServer → Client
visibility-csClient to server visibilityClient → Server

Event Parameters

When triggering visibility changes via events, you can pass these parameters:

ParameterTypeDescription
isVisiblebooleanWhether the object should be visible
hasCollisionbooleanWhether the object should have collision
isSyncbooleanWhether to synchronize across all clients
delaynumberDelay in seconds before applying the change

Common Use Cases

The Visibility component is perfect for creating dynamic environments that respond to player actions or game events. Common applications include:

  • Dynamic Doors: Show/hide doors based on player proximity or interaction
  • Interactive Objects: Reveal hidden objects when players solve puzzles
  • Environmental Effects: Hide/show environmental elements based on time or conditions
  • Collision Management: Enable/disable collision for objects based on game state
  • Synchronized Effects: Ensure all players see the same visibility changes

Integration

The Visibility component works by listening for custom events and applying visibility/collision changes to 3D nodes. For example, a door emitter might emit a "door-open" signal that the visibility component listens for to hide the door object. The component can also emit completion events that other components can listen for to chain additional actions.

Best Practices

  • Use synchronization for objects that all players should see change simultaneously
  • Implement delays for smooth visual transitions and better user experience
  • Configure collision states appropriately for your game mechanics
  • Use completion events to chain multiple actions together
  • Enable debug mode during development to troubleshoot visibility issues
  • Set appropriate event receivers to avoid unnecessary processing