How to rotate a SCNNode around multiple axes and with different angles?

Question

I have a ‘SCNCylinder‘ in a ‘SCNView‘ inside a frame in SwiftUI. My goal is to rotate the cylinder around different axes and with different angles. I have two (sort of)buttons which take input from the user as either 180° or 90°. I want to rotate each of them on different axes. I want to rotate the cylinder 180° around ‘SCNVector3(1,0,0)‘ and 90° around ‘SCNVector3(0,0,1)‘. I have made a playground which is capable of doing this. The real problem is to do multiple rotations with the same. Suppose the user taps 180° first and then 90°, I want the cylinder to do the same. But currently it rotates by 180° just fine but rotates randomly when the user taps 90° button.

Here is my code:

struct ContentView: View {

@State var rotationAngle: Angle = .degrees(0)
@State var rotationAngle2: Angle = .degrees(0)
var body: some View {

    VStack{

        HStack{
        Text("180°").onTapGesture {
            self.rotationAngle = .degrees(180)

        }

        Divider()

        Text("90°").onTapGesture {
            self.rotationAngle2 = .degrees(90)
        }
   }     

        SceneKitView(radius: 0.02, height: 2, angle: $rotationAngle, angle2: $rotationAngle2)
            .position(x: 225.0, y: 175)
            .frame(width: 300, height: 300, alignment: .center)
        }  
     }
  }

struct SceneKitView: UIViewRepresentable {

@Binding var angle: Angle
@Binding var angle2 : Angle


let cylindernode: SCNNode

init(radius: CGFloat, height: CGFloat, angle: Binding<Angle>, angle2: Binding<Angle>) {

    let cylinder = SCNCylinder(radius: radius, height: height)
    cylinder.firstMaterial?.diffuse.contents = UIColor.green
    self.cylindernode = SCNNode(geometry: cylinder)
    self.cylindernode.position = SCNVector3(0, 0, 0)
    cylindernode.pivot = SCNMatrix4MakeTranslation(0, -1, 0)
    self._angle = angle
    self._angle2 = angle2

}

func makeUIView(context: UIViewRepresentableContext<SceneKitView>) -> SCNView {

    let sceneView = SCNView()
    sceneView.scene = SCNScene()
    sceneView.autoenablesDefaultLighting = true
    sceneView.allowsCameraControl = true
    sceneView.scene?.rootNode.addChildNode(cylindernode)
    return sceneView
}

func updateUIView(_ sceneView: SCNView, context: UIViewRepresentableContext<SceneKitView>) {

    let rotation = SCNAction.rotate(by: CGFloat(angle.radians), around: SCNVector3(1, 0, 0), duration: 3)        

    let rotation2 = SCNAction.rotate(by: CGFloat(angle2.radians), around: SCNVector3(0, 0, 1), duration: 3)

    print(angle.degrees)
    print(angle2.degrees)

    cylindernode.runAction(rotation)
    cylindernode.runAction(rotation2)
}

}

Please help me with this problem.

Chris Chris · Accepted Answer · 2019-12-15T12:26:07

I am not sure what happens if you runAction twice on the same node, but you can "control" your animations by these functions:

e.g.

1.) if you want the animations run parallel

cylindernode.runAction(SCNAction.group([rotation, rotation2]))

2.) if you want the animations run in sequence

cylindernode.runAction[SCNAction.sequence([rotation, rotation2]))

How to rotate a SCNNode around multiple axes and with different angles?

1 Answers