Sirop4ik
Sirop4ik

Reputation: 5273

How to change the color of text just on one (front) side SCNText?

I am working with SCNScene where I place the SCNText node, so as a result, I get 3d text on the scene, the problem is that if I change the depth of the text it looks like a block of solid color, so it is hard to see what exactly on the screen, there are a few examples

enter image description here

enter image description here

I need somehow came up with the idea of how to make the text understandable even when it has a big depth value

I thought about drow the edges like this (I am not a good artist:)

enter image description here

Hope you got the idea

Or make the front side of the text lighter or in a different color, like this, so it will be more obvious for the user what it is written

Is there a way to do something like this?

enter image description here

Upvotes: 1

Views: 277

Answers (2)

Andy Jazz
Andy Jazz

Reputation: 58563

The easiest way to differently "colorize" the front and side parts of 3D text in SceneKit is to use two text nodes under a common parent container. Container allows you simultaneously move and rotate both text child nodes.

let sceneView = self.view as! SCNView
sceneView.scene = SCNScene()
sceneView.allowsCameraControl = true
sceneView.backgroundColor = .black

// Nodes
let container = SCNNode() 
let frontText = SCNNode()
let backText = SCNNode()

container.addChildNode(frontText)       
container.addChildNode(backText)
sceneView.scene?.rootNode.addChildNode(container)

// Red stuff
backText.geometry = SCNText(string: "Hi", extrusionDepth: 10.0)
backText.geometry?.firstMaterial?.diffuse.contents = NSColor.red

// White stuff
frontText.geometry = SCNText(string: "Hi", extrusionDepth: 0.005)
frontText.geometry?.firstMaterial?.diffuse.contents = NSColor.white
frontText.position.z = (10.0 / 2) + 0.005

enter image description here

Upvotes: 0

mnuages
mnuages

Reputation: 13462

from the documentation:

A text geometry may contain one, three, or five geometry elements:

If its extrusion depth is greater than zero and its chamferRadius property is 0.0, the text geometry has three elements, corresponding to its front, back, and extruded sides.

SceneKit can render each element using a different material. For details, see the description of the materials property in SCNGeometry.

So you can set an array of materials, with one SCNMaterial instance for the front, and another material used twice for the back and sides.

Upvotes: 1

Related Questions