HoverEffectComponent.HoverEffect

static · iOS 26.0+

shader

TypeScript

static shaderGroupID(inputs: HoverEffectComponent_ShaderHoverEffectInputs, groupID: HoverEffectComponent_GroupID): HoverEffectComponent_HoverEffect

Swift declaration

static func shader(_ inputs: HoverEffectComponent.ShaderHoverEffectInputs, groupID: HoverEffectComponent.GroupID) -> HoverEffectComponent.HoverEffect

Returns a shader hover effect that is assigned to the group.

static · iOS 18.0+

shader

TypeScript

static shader(inputs: HoverEffectComponent_ShaderHoverEffectInputs): HoverEffectComponent_HoverEffect

Swift declaration

static func shader(_ inputs: HoverEffectComponent.ShaderHoverEffectInputs) -> HoverEffectComponent.HoverEffect

Returns a hover effect style that applies hover state data to a custom shader that applies to the entity's model. The custom shader can be either MaterialX or ``CustomMaterial``. - Warning: This style doesn't display anything without an appropriate custom shader. - Parameter inputs: A ``ShaderHoverEffectInputs`` instance that allows you to customize various aspects of this hover effect.

get · iOS 26.0+

groupID

TypeScript

get groupID(): (HoverEffectComponent_GroupID) | null

Swift declaration

var groupID: HoverEffectComponent.GroupID? { get set }

An optional group identifier for the hover effect. The system activates the hover effect entities that have the same ``GroupID`` instance at the same time when a person looks at it or hovers over any entity in the group. ### Activating Hover Effects The system activates hover effect entities with a `groupID` independently from the hierarchical activation behavior. ``` swift let boxSize = SIMD3<Float>(0.3, 0.1, 0.05) let modelComponent = ModelComponent( mesh: MeshResource.generateBox(size: boxSize, cornerRadius: 0.2), materials: [SimpleMaterial(color: .black, roughness: 0.5, isMetallic: false)] ) let collisionComponent = CollisionComponent( shapes: [ShapeResource.generateBox(size: boxSize)] ) let inputTargetComponent = InputTargetComponent() let hoverEntityA = Entity(components: modelComponent, collisionComponent, inputTargetComponent ) let hoverEntityB = hoverEntityA.clone(recursive: true) hoverEntityB.position.x = -0.2 hoverEntityB.position.y = -0.15 let hoverEntityBB = hoverEntityA.clone(recursive: true) hoverEntityBB.position.y = -0.15 let hoverEntityC = hoverEntityA.clone(recursive: true) hoverEntityC.position.x = 0.2 hoverEntityC.position.y = -0.15 content.add(hoverEntityA) hoverEntityA.addChild(hoverEntityB) hoverEntityB.addChild(hoverEntityBB) hoverEntityA.addChild(hoverEntityC) // Create hover effect component for the top entity in the scene. let hoverA = HoverEffectComponent( .highlight(HoverEffectComponent.HighlightHoverEffectStyle( color: .green, strength: 2.0 ))) hoverEntityA.components.set(hoverA) // Create hover effect components for the two children on the left side. var hoverB = HoverEffectComponent( .highlight(HoverEffectComponent.HighlightHoverEffectStyle( color: .yellow, strength: 2.0 ))) var hoverBB = HoverEffectComponent( .highlight(HoverEffectComponent.HighlightHoverEffectStyle( color: .orange, strength: 2.0 ))) // Create a `HoverEffectComponent.GroupID` instance for the children on the left side let leftGroupId = HoverEffectComponent.GroupID() hoverB.hoverEffect.groupID = leftGroupId hoverBB.hoverEffect.groupID = leftGroupId hoverEntityB.components.set(hoverB) hoverEntityBB.components.set(hoverBB) ``` In this example, the top entity, `entityA`, doesn't have a group identifier. However, the left side entities, `entityB` and `entityBB`, have the same ``GroupID`` instance. The top entity `entityA` and its right child `entityC` both glow when a person activates either one in the right side hierarchical branch. However, the left child `entityB` and its descendent `entityBB` glow only when a person activates either one of them. @Video( source: hovereffectcomponent-exclude-groupid-from-hierarchical, alt: "A video of a living room scene with four black rectangles arranged in a tree arrangement with one rectangle on the top, two rectangles on the left side branch, and one rectangle on the right side branch. The top and right side rectangles start glowing as the gaze pointer hovers over the top rectangle and then over the right side rectange. The left side rectangles start glowing as the gaze pointer hovers over the upper left side rectangle and then over the lower left side rectangle.", poster: hovereffectcomponent-exclude-groupid-from-hierarchical-poster )

set · iOS 26.0+

groupID

TypeScript

set groupID(value: (HoverEffectComponent_GroupID) | null)

Swift declaration

var groupID: HoverEffectComponent.GroupID? { get set }

An optional group identifier for the hover effect. The system activates the hover effect entities that have the same ``GroupID`` instance at the same time when a person looks at it or hovers over any entity in the group. ### Activating Hover Effects The system activates hover effect entities with a `groupID` independently from the hierarchical activation behavior. ``` swift let boxSize = SIMD3<Float>(0.3, 0.1, 0.05) let modelComponent = ModelComponent( mesh: MeshResource.generateBox(size: boxSize, cornerRadius: 0.2), materials: [SimpleMaterial(color: .black, roughness: 0.5, isMetallic: false)] ) let collisionComponent = CollisionComponent( shapes: [ShapeResource.generateBox(size: boxSize)] ) let inputTargetComponent = InputTargetComponent() let hoverEntityA = Entity(components: modelComponent, collisionComponent, inputTargetComponent ) let hoverEntityB = hoverEntityA.clone(recursive: true) hoverEntityB.position.x = -0.2 hoverEntityB.position.y = -0.15 let hoverEntityBB = hoverEntityA.clone(recursive: true) hoverEntityBB.position.y = -0.15 let hoverEntityC = hoverEntityA.clone(recursive: true) hoverEntityC.position.x = 0.2 hoverEntityC.position.y = -0.15 content.add(hoverEntityA) hoverEntityA.addChild(hoverEntityB) hoverEntityB.addChild(hoverEntityBB) hoverEntityA.addChild(hoverEntityC) // Create hover effect component for the top entity in the scene. let hoverA = HoverEffectComponent( .highlight(HoverEffectComponent.HighlightHoverEffectStyle( color: .green, strength: 2.0 ))) hoverEntityA.components.set(hoverA) // Create hover effect components for the two children on the left side. var hoverB = HoverEffectComponent( .highlight(HoverEffectComponent.HighlightHoverEffectStyle( color: .yellow, strength: 2.0 ))) var hoverBB = HoverEffectComponent( .highlight(HoverEffectComponent.HighlightHoverEffectStyle( color: .orange, strength: 2.0 ))) // Create a `HoverEffectComponent.GroupID` instance for the children on the left side let leftGroupId = HoverEffectComponent.GroupID() hoverB.hoverEffect.groupID = leftGroupId hoverBB.hoverEffect.groupID = leftGroupId hoverEntityB.components.set(hoverB) hoverEntityBB.components.set(hoverBB) ``` In this example, the top entity, `entityA`, doesn't have a group identifier. However, the left side entities, `entityB` and `entityBB`, have the same ``GroupID`` instance. The top entity `entityA` and its right child `entityC` both glow when a person activates either one in the right side hierarchical branch. However, the left child `entityB` and its descendent `entityBB` glow only when a person activates either one of them. @Video( source: hovereffectcomponent-exclude-groupid-from-hierarchical, alt: "A video of a living room scene with four black rectangles arranged in a tree arrangement with one rectangle on the top, two rectangles on the left side branch, and one rectangle on the right side branch. The top and right side rectangles start glowing as the gaze pointer hovers over the top rectangle and then over the right side rectange. The left side rectangles start glowing as the gaze pointer hovers over the upper left side rectangle and then over the lower left side rectangle.", poster: hovereffectcomponent-exclude-groupid-from-hierarchical-poster )

static · iOS 26.0+

highlight

TypeScript

static highlightGroupID(style: HoverEffectComponent_HighlightHoverEffectStyle, groupID: HoverEffectComponent_GroupID): HoverEffectComponent_HoverEffect

Swift declaration

static func highlight(_ style: HoverEffectComponent.HighlightHoverEffectStyle, groupID: HoverEffectComponent.GroupID) -> HoverEffectComponent.HoverEffect

Returns a highlight hover effect that is assigned to the group.

static · iOS 18.0+

highlight

TypeScript

static highlight(style: HoverEffectComponent_HighlightHoverEffectStyle): HoverEffectComponent_HoverEffect

Swift declaration

static func highlight(_ style: HoverEffectComponent.HighlightHoverEffectStyle) -> HoverEffectComponent.HoverEffect

Returns a hover effect style that uniformly highlights the entity and also applies a feathered spotlight effect. - Parameter style: A ``HighlightHoverEffectStyle`` instance that allows you to customize various aspects of this hover effect.

static · iOS 26.0+

spotlight

TypeScript

static spotlightGroupID(style: HoverEffectComponent_SpotlightHoverEffectStyle, groupID: HoverEffectComponent_GroupID): HoverEffectComponent_HoverEffect

Swift declaration

static func spotlight(_ style: HoverEffectComponent.SpotlightHoverEffectStyle, groupID: HoverEffectComponent.GroupID) -> HoverEffectComponent.HoverEffect

Returns a spotlight hover effect that is assigned to the group.

static · iOS 18.0+

spotlight

TypeScript

static spotlight(style: HoverEffectComponent_SpotlightHoverEffectStyle): HoverEffectComponent_HoverEffect

Swift declaration

static func spotlight(_ style: HoverEffectComponent.SpotlightHoverEffectStyle) -> HoverEffectComponent.HoverEffect

Returns a hover effect that displays a feathered spotlight on the entity where the current hover location is. - Parameter style: A ``SpotlightHoverEffectStyle`` instance that allows you to customize various aspects of this hover effect.

Members (8)

shader

shader

groupID

groupID

highlight

highlight

spotlight

spotlight

Skipped declarations