Search code examples
swiftxcodearkitscnnodescntext

Adding Text to SCNSphere


Good afternoon,

Firstly, please forgive my (probably) very basic question, I am fairly new to the world of AR...

I am playing about with displaying 3D objects when the user taps the screen. I have successfully projected a bubble-like object into a set position when the user taps:

override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
    let bubble = SCNSphere(radius: 0.1)
    bubble.firstMaterial?.transparency = 0.5
    bubble.firstMaterial?.writesToDepthBuffer = false
    bubble.firstMaterial?.blendMode = .screen
    bubble.firstMaterial?.reflective.contents = #imageLiteral(resourceName: "bubble")

    let node = SCNNode(geometry: bubble)
    node.position = SCNVector3Make(0, 0.1, 0)

    let parentNode = SCNNode()
    parentNode.addChildNode(node)

    if let camera = sceneView.pointOfView {
        parentNode.position = camera.position

        // Animation like bubble
        let wait = SCNAction.wait(duration: 0.2)

        let speedsArray: [TimeInterval] = [0.5, 1.0, 1.5]
        let speed: TimeInterval = speedsArray[Int(arc4random_uniform(UInt32(speedsArray.count)))]

        let toPositionCamera = SCNVector3Make(0, 0, -2)
        let toPosition = camera.convertPosition(toPositionCamera, to: nil)

        let move = SCNAction.move(to: toPosition, duration: speed)
        move.timingMode = .easeOut
        let group = SCNAction.sequence([wait, move])
        parentNode.runAction(group) {

        }
    }
    sceneView.scene.rootNode.addChildNode(parentNode)
}

What I would like to do now is display a number on the SCNSphere. Ideally so it looks like it is printed on the sphere's surface.

I have tried the following code but found that, although the text is rendered, it is barely visible behind the sphere, and also a lot smaller than the sphere (I have attached a photograph to try and show this). I have tried playing about with the different values but I feel I am missing something vital with regards to positioning.

let string = "25"
    let text = SCNText(string: string, extrusionDepth: 0.1)
    text.font = UIFont.systemFont(ofSize: 5)
    text.firstMaterial?.diffuse.contents = UIColor.black
    text.flatness = 0.005
    let textNode = SCNNode(geometry: text)
    let fontScale: Float = 0.01
    textNode.scale = SCNVector3(fontScale, fontScale, fontScale)

    parentNode.addChildNode(textNode)

Any advice would be greatly appreciated.

Thanks in advance!

enter image description here


Solution

  • Not sure if it will give you what you exactly want. Its just a way where I put the number as a texture on sphere.

    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
        let bubble = SCNSphere(radius: 0.1)
    
        let view = UIView(frame: CGRect(x: 0, y: 0, width: 200, height: 100))
        view.backgroundColor = .black
        let label = UILabel(frame: CGRect(x: 0, y: 35, width: 200, height: 30))
        label.font = UIFont.systemFont(ofSize: 30)
        view.addSubview(label)
        label.textAlignment = .center
        label.text = "25"
        label.textColor = .white
    
        bubble.firstMaterial?.diffuse.contents = view
        .
        .
        .
    }