How to make Text to have the same position and orientation as Box?

user_7800332 0
Viewed 359

I am using RealityKit and struggling to set text which should readable and placed on a box. No matter how the box was set, It should always follow the position of the box.

let textMesh = MeshResource.generateText("ABC", extrusionDepth: 0.001, font: fonts)
        
let textEntity = ModelEntity(mesh: textMesh, materials: [UnlitMaterial(color: .black)])
let boxMeshForText = MeshResource.generateBox(width: 0.25,
                                             height: 0.1,
                                              depth: 0,
                                       cornerRadius: 0.001)
let boxEntityForText = ModelEntity(mesh: boxMeshForText,
                              materials: [UnlitMaterial(color: UIColor.white)])
textEntity.setPosition([-0.09, -0.03, 0.001], relativeTo: boxEntityForText)
boxEntityForText.addChild(textEntity)
        
let textAnchor = ARAnchorEntity()
textAnchor.addChild(boxEntityForText, preservingWorldTransform: true)
textAnchor.setPosition([0.05, 0.05, 0.02], relativeTo: anchor)
textAnchor.transform.rotation = simd_quatf(angle: -90 * .pi/180, axis: [1,0,0])
anchor.addChild(textAnchor)

The above code gives me the wrong result. The result I want can be seen in the attached image.

enter image description here

realitykit arkit augmented-reality swift
2 Answers

It's easy. Just make a text to be a child of cube and pin that cube with anchor. In ECS frameworks child always copy from its parent position, orientation and scale.

let box = MeshResource.generateBox(size: 1)
let boxEntity = ModelEntity(mesh: box)
    
let anchor = AnchorEntity()
boxEntity.setParent(anchor)
arView.scene.addAnchor(anchor)
    
let text = MeshResource.generateText("AR", 
                      extrusionDepth: 0.01, 
                                font: .systemFont(ofSize: 0.25), 
                      containerFrame: .zero, 
                           alignment: .center, 
                       lineBreakMode: .byWordWrapping)

let shader = UnlitMaterial(color: .yellow)
let textEntity = ModelEntity(mesh: text, materials: [shader])
textEntity.position.z += 0.6
    
// Changing a position, orientation and scale of the parent
boxEntity.addChild(textEntity)        
boxEntity.transform = Transform(pitch: .pi/8, yaw: .pi/8, roll: .pi/8)
boxEntity.position.x = -0.5
boxEntity.scale /= 2

Now child always follows his parent.

enter image description here

user_65995900

Thank you @Andy Fedoroff for the answer.

By learning your suggestion, I came to get the result, Here is the code I have used.

        let boxDepth: Float = 0.25
        let textBoxMesh = MeshResource.generateBox(width: 0.1,
                                                   height: 0.01,
                                                   depth: 0.25,
                                                   cornerRadius: 0.02)
        let textBoxEntity = ModelEntity.init(mesh: textBoxMesh,
                                             materials: [UnlitMaterial(color: UIColor.white)])
        textBoxEntity.position = .init(boxDepth/2, 0, 0)
        anchor.addChild(textBoxEntity)
        
        let fonts: UIFont = .init(descriptor: .init(name: "Helvetica", size: 0),
                                  size: 0.06)
        let textToDisplay = meterToDisplayText(meters: meters)
        
        let textMesh = MeshResource.generateText(textToDisplay,
                                                 extrusionDepth: 0.001,
                                                 font: fonts)
        let textEntity = ModelEntity(mesh: textMesh, materials: [UnlitMaterial(color: .black)])
      
        textEntity.transform = Transform(pitch: -90 * .pi/180,
                                         yaw: -90 * .pi/180,
                                         roll: 0)
        textBoxEntity.addChild(textEntity)
user_78003320
Related