Scenekit: Animating Camera Node While Using Constraints - ios

I am attempting to animate the camera node in Scenekit while having the camera look at a specific point with a constraint. For some reason activating the constraint locks the camera position.
Is there a specific reason this does not work or what am I missing here?
cameraNode = SCNNode()
let camera = SCNCamera()
cameraNode.camera = camera
cameraNode.position = SCNVector3Make(5.0, 10.0, 5.0)
scene.rootNode.addChildNode(cameraNode)
let center = SCNNode()
center.position = SCNVector3Make(0, 0, 0)
let lookConstraint = SCNLookAtConstraint(target: center)
cameraNode.constraints = [lookConstraint]
let firstAnimation = SCNAction.move(to: SCNVector3Make(10, 10, 10), duration: 2.0)
let secondAnimation = SCNAction.move(by: SCNVector3Make(0, 5, 5), duration: 2.0)
let sequence = SCNAction.sequence([firstAnimation, secondAnimation])
cameraNode.runAction(sequence)

Related

Rotate the Scene using panGestureRecognizer

I'm a new programmer working on a simple demo iOS program which I use SceneKit to render the scene.
I want to rotate the camera to see different perspective of the scene. But the original camera control is little bit tricky. Especially when I want to rotate the scene in one direction. e.g. if I swipe from right to left and the camera goes from right to left, then go downwards, then go upwards, then go downwards again, finally it goes left again.
What I want to achieve is that when I swipe from right to the left, the camera rotate around the z-axis. And when I swipe up and down my camera just move up and down. And I can also zoom in and out. Additionally I want to set a constraint so that the camera won't go underground.
So I come up with an idea that I fix the camera to look at the object that I focus on. Then place the object in the center of the scene. And I want to rotate the scene just around z-axis when I swipe the screen.
I assume that I use panGestureRecognizer and translate the position change to a rotation order.But how can I achieve that?
Or you have some other idea to get this results?
Here's a simple version of what I write so far. I've tried using UIPanGestureRecognizer but it didn't work, so I delete it and set allowCameraControl = true
let sceneView = SCNView(frame: self.view.frame)
self.view.addSubview(sceneView)
let scene = SCNScene()
sceneView.scene = scene
let camera = SCNCamera()
let cameraNode = SCNNode()
cameraNode.camera = camera
cameraNode.position = SCNVector3(x: -5.0, y: 5.0, z: 5.0)
let light = SCNLight()
light.type = SCNLight.LightType.spot
light.spotInnerAngle = 30
light.spotOuterAngle = 80
light.castsShadow = true
let lightNode = SCNNode()
lightNode.light = light
lightNode.position = SCNVector3(x: 1.5, y: 1.5, z: 1.5)
let ambientLight = SCNLight()
ambientLight.type = SCNLight.LightType.ambient
ambientLight.color = UIColor(red: 0.2, green: 0.2, blue: 0.2, alpha: 1.0)
cameraNode.light = ambientLight
let cubeGeometry = SCNBox(width: 1.0, height: 1.0, length: 1.0, chamferRadius: 0.0)
let cubeNode = SCNNode(geometry: cubeGeometry)
let planeGeometry = SCNPlane(width: 50.0, height: 50.0)
let planeNode = SCNNode(geometry: planeGeometry)
planeNode.eulerAngles = SCNVector3(x: GLKMathDegreesToRadians(-90), y: 0, z: 0)
planeNode.position = SCNVector3(x: 0, y: -0.5, z: 0)
cameraNode.position = SCNVector3(x: -3.0, y: 3.0, z: 3.0)
let constraint = SCNLookAtConstraint(target: cubeNode)
constraint.isGimbalLockEnabled = true
cameraNode.constraints = [constraint]
lightNode.constraints = [constraint]
scene.rootNode.addChildNode(lightNode)
scene.rootNode.addChildNode(cameraNode)
scene.rootNode.addChildNode(cubeNode)
scene.rootNode.addChildNode(planeNode)
sceneView.allowsCameraControl = true
I solved this problem by using Spherical coordinate system.
General idea is to get the start position and the angle, then transform it to spherical coordinate system. Then you do rotation by just changing the two angle.
It's even easier to use spherical coordinate system to deal with pinch gesture. You just have to change the radius.
here's some code that I use.
func handlePan(_ gestureRecognize: UIPanGestureRecognizer) {
// retrieve scene
let carView = self.view as! SCNView
// save node data and pan gesture data
let cameraNode = carView.scene?.rootNode.childNode(withName: "Camera", recursively: true)!
//let translation = gestureRecognize.translation(in: gestureRecognize.view!)
let speed = gestureRecognize.velocity(in: gestureRecognize.view!)
var speedX = sign(Float(speed.x)) * Float(sqrt(abs(speed.x)))
var speedY = sign(Float(speed.y)) * Float(sqrt(abs(speed.y)))
if speedX.isNaN {speedX = 0}
if speedY.isNaN {speedY = 0}
// record start value
let cameraXStart = cameraNode!.position.x
let cameraYStart = cameraNode!.position.y
let cameraZStart = cameraNode!.position.z - 1.0
let cameraAngleStartZ = cameraNode!.eulerAngles.z
let cameraAngleStartX = cameraNode!.eulerAngles.x
let radiusSquare = cameraXStart * cameraXStart + cameraYStart * cameraYStart + cameraZStart * cameraZStart
// calculate delta value
let deltaAngleZ = -0.003 * Float(speedX)
let deltaAngleX = -0.003 * Float(speedY)
// get new Value
var cameraNewAngleZ = cameraAngleStartZ + deltaAngleZ
var cameraNewAngleX = cameraAngleStartX + deltaAngleX
if cameraNewAngleZ >= 100 * Float.pi {
cameraNewAngleZ = cameraNewAngleZ - 100 * Float.pi
} else if cameraNewAngleZ < -100 * Float.pi {
cameraNewAngleZ = cameraNewAngleZ + 100 * Float.pi
} else {
// set limit
if cameraNewAngleX > 1.4 {
cameraNewAngleX = 1.4
} else if cameraNewAngleX < 0.1 {
cameraNewAngleX = 0.1
}
// use angle value to get position value
let cameraNewX = sqrt(radiusSquare) * cos(cameraNewAngleZ - Float.pi/2) * cos(cameraNewAngleX - Float.pi/2)
let cameraNewY = sqrt(radiusSquare) * sin(cameraNewAngleZ - Float.pi/2) * cos(cameraNewAngleX - Float.pi/2)
let cameraNewZ = -sqrt(radiusSquare) * sin(cameraNewAngleX - Float.pi/2) + 1
if cameraNode?.camera?.usesOrthographicProjection == false {
cameraNode?.position = SCNVector3Make(cameraNewX, cameraNewY, cameraNewZ)
cameraNode?.eulerAngles = SCNVector3Make(cameraNewAngleX, 0, cameraNewAngleZ)
}
else if cameraNode?.camera?.usesOrthographicProjection == true {
cameraNode?.position = SCNVector3Make(0, 0, 10)
cameraNode?.eulerAngles = SCNVector3Make(0, 0, cameraNewAngleZ)
}
}
}

Scene Kit node not rotating

I am trying to rotate by scene kit node, however it is not rotating.
I want it to rotate around the y axis. It is a sphere.
let node = SCNNode()
node.geometry = SCNSphere(radius: 1)
node.geometry?.firstMaterial?.diffuse.contents = UIImage(named: "diffuse.png")
node.geometry?.firstMaterial?.specular.contents = UIImage(named: "specular.png")
node.geometry?.firstMaterial?.emission.contents = UIImage(named: "emission.png")
scene.rootNode.addChildNode(node)
let action = SCNAction.rotate(by:360 * CGFloat((Double.pi)/180.0), around: SCNVector3(x: 0, y: 1, z: 0), duration: 8)
let repeatAction = SCNAction.repeatForever(action)
node.runAction(repeatAction)
Are you certain it isn't rotating? I'm not sure what your diffuse, specular and emission images are but maybe because it's a sphere it just doesn't really look like it is rotating because it looks the same from all sides.
Running the same action on a cube in viewDidAppear is working for me, so it could just be that you can't really notice the sphere rotating. I used this code:
let node = SCNNode()
node.geometry = SCNBox (width: 0.5, height: 0.5, length: 0.5, chamferRadius: 0.1)
node.position = SCNVector3Make(0, 0, -1)
sceneView.scene.rootNode.addChildNode(node)
let action = SCNAction.rotate(by:360 * CGFloat((Double.pi)/180.0), around: SCNVector3(x: 0, y: 1, z: 0), duration: 8)
let repeatAction = SCNAction.repeatForever(action)
node.runAction(repeatAction)
The cube is rotating fine with the way that you rotated the SCNNode.
Hope this helps

SCNText rendering without curves, not font-like

When I run this SceneKit code:
let txt = SCNText(string: "Hello", extrusionDepth: 0.2)
let textNode = SCNNode(geometry: txt)
scene.rootNode.addChildNode(textNode)
I get very angular text:
It seems to do this regardless of font and it behaves the same way on a device as in the simulator.
Here's the code in context:
// create a new scene
let scene = SCNScene()
// create and add a camera to the scene
let cameraNode = SCNNode()
cameraNode.camera = SCNCamera()
scene.rootNode.addChildNode(cameraNode)
// place the camera
cameraNode.position = SCNVector3(x: 10, y: 0, z: 75)
// create and add a light to the scene
let lightNode = SCNNode()
lightNode.light = SCNLight()
lightNode.light!.type = SCNLightTypeOmni
lightNode.position = SCNVector3(x: 0, y: 10, z: 10)
scene.rootNode.addChildNode(lightNode)
// create and add an ambient light to the scene
let ambientLightNode = SCNNode()
ambientLightNode.light = SCNLight()
ambientLightNode.light!.type = SCNLightTypeAmbient
ambientLightNode.light!.color = UIColor.darkGrayColor()
scene.rootNode.addChildNode(ambientLightNode)
let txt = SCNText(string: "Hello", extrusionDepth: 0.2)
let textNode = SCNNode(geometry: txt)
scene.rootNode.addChildNode(textNode)
// retrieve the SCNView
let scnView = self.view as! SCNView
// set the scene to the view
scnView.scene = scene
SCNText subdivides the 2D Bézier path for your text just like Core Graphics would do if you were drawing it. You can always use the flatness property to make it smoother, but you won't get "sub-pixel smoothness".
To solve this issue you can use a bigger font size, so that the underlying Bézier path is bigger and more vertices are generated when discretization occurs.
My solution was using big font as #mnuages was suggested then using scale on the text node with
animatedTextNode.scale = SCNVector3(0.1, 0.1, 0.1)
to get what size I wanted.
In that case when you animate text and when it comes closer to the camera it looks smooth.

Create smoother edges or otherwise fix jagged edges on box in SCNView?

The code below generates a red box in a SCNView. However, the edges are jagged along the top and bottom of the side/element facing you (as illustrated by the attachment). The goal is to render smoother edges similar to Minecraft boxes. Changing the camera position reduces the pixelation of certain edges, so is this a camera angle issue? If yes, is it possible to render boxes with smooth edges no matter the camera angle?
For instance setting the camera position to SCNVector3(x: 0.0, y: 0.0, z: 10.0) renders the box effectively in 2D and with crisp edges (second attachment).
let sceneView = SCNView(frame: self.view.frame)
self.view.addSubview(sceneView)
let scene = SCNScene()
sceneView.scene = scene
let camera = SCNCamera()
let cameraNode = SCNNode()
cameraNode.camera = camera
cameraNode.position = SCNVector3(x: -3.0, y: 0.0, z: 10.0)
let ambientLight = SCNLight()
ambientLight.type = SCNLightTypeAmbient
ambientLight.color = UIColor(red: 0.2, green: 0.2, blue: 0.2, alpha: 1.0)
cameraNode.light = ambientLight
let light = SCNLight()
light.type = SCNLightTypeOmni
let lightNode = SCNNode()
lightNode.light = light
lightNode.position = SCNVector3(x: 0, y: 20, z: 10)
let cubeGeometry = SCNBox(width: 3.0, height: 3.0, length: 3.0, chamferRadius: 0.0)
let cubeNode = SCNNode(geometry: cubeGeometry)
let planeGeometry = SCNPlane(width: 100.0, height: 100.0)
let planeNode = SCNNode(geometry: planeGeometry)
planeNode.eulerAngles = SCNVector3(x: GLKMathDegreesToRadians(-90), y: 0, z: 0)
planeNode.position = SCNVector3(x: 0, y: -0.5, z: 0)
let redMaterial = SCNMaterial()
redMaterial.diffuse.contents = UIColor.redColor()
cubeGeometry.materials = [redMaterial]
let greenMaterial = SCNMaterial()
greenMaterial.diffuse.contents = UIColor.greenColor()
planeGeometry.materials = [greenMaterial]
let constraint = SCNLookAtConstraint(target: cubeNode)
constraint.gimbalLockEnabled = true
cameraNode.constraints = [constraint]
lightNode.constraints = [constraint]
scene.rootNode.addChildNode(lightNode)
scene.rootNode.addChildNode(cameraNode)
scene.rootNode.addChildNode(cubeNode)
scene.rootNode.addChildNode(planeNode)
As mentioned in the comments, if you want to antialias every frame set the antialiasingMode. It doesn’t do as nice a job as CoreGraphics but it’s reasonably nice. However, it does increase the workload a ton, so you’re going to burn batteries and slow down your framerate.
On OS X the default is to 4x multisample every frame. On iOS the default is no multisampling, since it’s so expensive.
Luckily there’s a solution I much prefer, which is to turn on jittering. It’s kind of like multisampling but lazy. When objects are moving they are rendered normally (with jaggies), but when they stop moving the renderer runs like 96 more frames in the background and smooths out all the jaggies.
The final look is much better than antialiasing (because there’s no “96x antialiasing mode”) and on fast hardware most people I’ve shown it to don’t realize that the quality is changing when objects move.

Scale SCNNode in SceneKit

I have the following SCNNode:
let box = SCNBox(width: 10.0, height: 10.0, length: 10.0, chamferRadius: 0)
let boxNode = SCNNode(geometry: box)
boxNode.position = SCNVector3(x: 0, y: 0, z: 0)
If I apply:
boxNode.scale = SCNVector3(x: 0.5, y: 0.5, z: 0.5)
it appears to have no effect on the size of the box. I've checked this with boxNode.getBoundingBoxMin(&v1, max: &v2). It's always the same and appears the same on-screen.
Am I missing something? The docs imply that setting the scale should affect the node's geometry and thus be a different size.
Thanks.
J.
I just tested in a playground and it worked perfectly for me. Perhaps your camera is zooming in to compensate for the smaller box?
import SceneKit
import SpriteKit
import XCPlayground
let sceneView = SCNView(frame: CGRect(x: 0, y: 0, width: 800, height: 600))
XCPlaygroundPage.currentPage.liveView = sceneView
var scene = SCNScene()
sceneView.scene = scene
sceneView.backgroundColor = SKColor.greenColor()
sceneView.debugOptions = .ShowWireframe
// default lighting
sceneView.autoenablesDefaultLighting = true
// a camera
var cameraNode = SCNNode()
cameraNode.camera = SCNCamera()
cameraNode.position = SCNVector3(x: 15, y: 15, z: 30)
scene.rootNode.addChildNode(cameraNode)
let box = SCNBox(width: 10.0, height: 10.0, length: 10.0, chamferRadius: 0)
let boxNode = SCNNode(geometry: box)
boxNode.position = SCNVector3(x: 0, y: 0, z: 0)
scene.rootNode.addChildNode(boxNode)
let centerConstraint = SCNLookAtConstraint(target: boxNode)
cameraNode.constraints = [centerConstraint]
let sphere = SCNSphere(radius: 4)
let sphereNode = SCNNode(geometry: sphere)
sphereNode.position = SCNVector3(x:15, y:0, z:0)
scene.rootNode.addChildNode(sphereNode)
//boxNode.scale = SCNVector3(x: 0.5, y: 0.5, z: 0.5)
Uncomment the last line and you'll see the box (10 x 10 x 10) switch switch from being larger than the sphere (diameter of 8) to being smaller than the sphere. Here it is after the scaling:

Resources