SCNText - background "speech bubble"

Question

How can I insert a background (e.g. a "speech bubble" or a rectangle) to a SCNtext? Specifically, if I insert "Hello World" as SCNText (and obviously then as a SCNNode in the scene) then how can I add a background for that text only? Would it be a UIimage which will be inserted as a SCNNode at the same position in the "Hello World? (Keep in mind that there is nothing as background of SCNNode in SceneKit)

Answer 1

Here is a sample code. It will add SCNPlane as background of SCNTextNode:

let minVec = textNode.boundingBox.min
let maxVec = textNode.boundingBox.max
let bound = SCNVector3Make(maxVec.x - minVec.x, 
                           maxVec.y - minVec.y, 
                           maxVec.z - minVec.z);

let plane = SCNPlane(width: CGFloat(bound.x + 1), 
                    height: CGFloat(bound.y + 1))
plane.cornerRadius = 0.2
plane.firstMaterial?.diffuse.contents = UIColor.black.withAlphaComponent(0.9)

let planeNode = SCNNode(geometry: plane)
planeNode.position = SCNVector3(CGFloat( minVec.x) + CGFloat(bound.x) / 2 , 
                                CGFloat( minVec.y) + CGFloat(bound.y) / 2,CGFloat(minVec.z - 0.01))

textNode.addChildNode(planeNode)
planeNode.name = "text"

Hope it is helpful to someone

Answer 2

You could use a SCNPlane as another SCNNode, assign a SCNMaterial to its geometry, and set the diffuse.contents property of that material to the background image you want to use. And then yes, place it at same position as the SCNText node, but with a position.z value slightly lower than the SCNText node so it will be behind it. If you plan to move to or rotate the text node, add the SCNPlane node as a child node of the text node.