本节学习目标
我们在将一张图渲染在球体上制作全景图的时候,会发现图片上的文字从球体内部来看是反的,我们举例说明一下
先看一下我们的全景图全貌
注意红色"ab"的看起来是正常的,但是经过我们下面渲染球体的代码
第一步 创建一个球体
let sphereNode = SCNNode()
sphereNode.position = SCNVector3Make(0, 0, 0)
sphereNode.geometry = SCNSphere(radius: 100)
self.scnView.scene?.rootNode.addChildNode(sphereNode)
第二步 贴图
sphereNode.geometry?.firstMaterial?.diffuse.contents = srcImage
sphereNode.geometry?.firstMaterial?.isDoubleSided = true
sphereNode.geometry?.firstMaterial?.diffuse.wrapT = .repeat;
sphereNode.geometry?.firstMaterial?.diffuse.wrapS = .repeat;
第三步 给球体内部放置一个相机
let cameraNode = SCNNode()
cameraNode.camera = SCNCamera()
cameraNode.camera?.automaticallyAdjustsZRange = true
cameraNode.position = SCNVector3Make(0, 0, 0)
sphereNode.addChildNode(cameraNode)
效果如下
这个时候我们会发现“ab”是 内部往外看的效果
接下来我们可以使用下面的三种办法解决这个问题
第一种 我们不演示 就是把这种图透射处理一下 然后再渲染,记住不是镜像
第二种 对纹理坐标进行矩阵变换
默认的矩阵为
SCNMatrix4(m11: 1.0, m12: 0.0, m13: 0.0, m14: 0.0, m21: 0.0, m22: 1.0, m23: 0.0, m24: 0.0, m31: 0.0, m32: 0.0, m33: 1.0, m34: 0.0, m41: 0.0, m42: 0.0, m43: 0.0, m44: 1.0)
旋转矩阵
SCNMatrix4(m11: -1.0, m12: 0.0, m13: 0.0, m14: 0.0, m21: 0.0, m22: 1.0, m23: 0.0, m24: 0.0, m31: 0.0, m32: 0.0, m33: 1.0, m34: 0.0, m41: 0.0, m42: 0.0, m43: 0.0, m44: 1.0)
如果沿y轴中心将图片旋转90度渲染就可以了接下来看代码
sphereNode.geometry?.firstMaterial?.diffuse.contentsTransform = SCNMatrix4MakeScale(-1,1,1); // 纹理坐标翻转一下
这个时候 你会发现什么都看不见 因为球体内部没有灯光 在球体内部加上环境光试试看
let lightNode = SCNNode()
lightNode .light = SCNLight()
lightNode .light?.type = .ambient
sphereNode.addChildNode(lightNode)
你会发现正是我们需要的
第三种方式 这种方式是不需要添加灯光的
sphereNode.geometry?.firstMaterial?.diffuse.contentsTransform = SCNMatrix4Translate(SCNMatrix4MakeScale(-1, 1, 1), 1, 0, 0)
运行效果和上面的方式一样
