How to create hand anchors with Anchoring Component
Creating entities with anchoring components attached instead of using AnchorEntity.
We’ve been using AnchorEntity for our examples until now. I recently learned that AnchorEntity is essentially a convenient wrapper for an entity with an AnchoringComponent.
Want to use AnchorEntity instead?
We can add the Anchoring component in Reality Composer Pro.
Options:
- Target: select Hand
- Chirality: Left, Right, Either
- Anchor: select from preset locations or target a specific joint
We can do the same thing in code by creating an instance of component and setting it on an entity.
let entity = Entity()
let anchor = AnchoringComponent(.hand(.left, location: .palm))
entity.components.set(anchor)Video demo
The left hand has three anchors that I created in Reality Composer Pro. The right hand has a anchor for each joint, added via code.
Full example code
struct Example025: View {
var body: some View {
RealityView { content in
if let scene = try? await Entity(named: "HandAnchoringLabs", in: realityKitContentBundle) {
content.add(scene)
// Left Hand: Three small spheres were created in Reality Composer Pro. Each one has an Anchoring Component.
// Right Hand: Create an entity for each joint
if let rightHandSphere = scene.findEntity(named: "StepSphereGreen") {
// Create an array of all joints to iterate over.
let joints: [AnchoringComponent.Target.HandLocation.HandJoint] = [
.thumbIntermediateBase,
.thumbIntermediateTip,
.thumbKnuckle,
.thumbTip,
.indexFingerIntermediateBase,
.indexFingerIntermediateTip,
.indexFingerKnuckle,
.indexFingerMetacarpal,
.indexFingerTip,
.middleFingerIntermediateBase,
.middleFingerIntermediateTip,
.middleFingerKnuckle,
.middleFingerMetacarpal,
.middleFingerTip,
.ringFingerIntermediateBase,
.ringFingerIntermediateTip,
.ringFingerKnuckle,
.ringFingerMetacarpal,
.ringFingerTip,
.littleFingerIntermediateBase,
.littleFingerIntermediateTip,
.littleFingerKnuckle,
.littleFingerMetacarpal,
.littleFingerTip,
]
for joint in joints {
let entity = rightHandSphere.clone(recursive: true)
let anchor = AnchoringComponent(
.hand(.right, location: .joint(for: joint)),
trackingMode: .continuous
)
entity.components.set(anchor)
content.add(entity)
}
}
}
}
.persistentSystemOverlays(.hidden)
.upperLimbVisibility(.hidden)
}What are you using in your apps? AnchorEntity or AnchoringComponent directly?
Download the Xcode project with this and many more examples from Step Into Vision.
Some examples are provided as standalone Xcode projects. You can find those here.
Follow Step Into Vision