SceneKit_中级03_切换照相机视角

2024-06-11 01:38

本文主要是介绍SceneKit_中级03_切换照相机视角,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

SceneKit_入门01_旋转人物
SceneKit_入门02_如何创建工程
SceneKit_入门03_节点
SceneKit_入门04_灯光
SceneKit_入门05_照相机
SceneKit_入门06_行为动画
SceneKit_入门07_几何体
SceneKit_入门08_材质
SceneKit_入门09_物理身体
SceneKit_入门10_物理世界
SceneKit_入门11_粒子系统
SceneKit_入门12_物理行为
SceneKit_入门13_骨骼动画
SceneKit_中级01_模型之间的过渡动画
SceneKit_中级02_SCNView 详细讲解
SceneKit_中级03_切换照相机视角
SceneKit_中级04_约束的使用
SceneKit_中级05_力的使用
SceneKit_中级06_场景的切换
SceneKit_中级07_动态修改属性
SceneKit_中级08_阴影详解
SceneKit_中级09_碰撞检测
SceneKit_中级10_滤镜效果制作
SceneKit_中级11_动画事件
SceneKit_高级01_GLSL
SceneKit_高级02_粒子系统深入研究
SceneKit_高级03_自定义力
SceneKit_高级04_自定义场景过渡效果
SceneKit_高级05 检测手势点击到节点
SceneKit_高级06_加载顶点、纹理、法线坐标
SceneKit_高级07_SCNProgram用法探究
SceneKit_高级08_天空盒子制作
SceneKit_高级09_雾效果
SceneKit_大神01_掉落的文字
SceneKit_大神02_弹幕来袭
SceneKit_大神03_navigationbar上的3D文字

1594482-ed6554e21af4cbc5.PNG
让学习成为一种习惯

在游戏中,我们经常可以看到,有视角切换这个功能,那在SceneKit中怎么进行视角切换了,今天就带大家练习这个功能!

今天教大家实现下面的效果:

1594482-05044053aaa044b5.gif
让学习成为一种习惯
1594482-cd1a11d95d546dfe.gif
让学习成为一种习惯
1594482-4822b0d07a712810.gif
让学习成为一种习惯
走进代码的世界

1.创建工程(略)
2.添加素材(自己截图, 放到工程中去)

1594482-df7f6bcc3a2c9ac3.png
太阳
1594482-a2ea7effbce65ce8.png
月球
1594482-24922766ac1f974a.png
地球

3.创建3个按钮和SCNView页面

1594482-5f11970678502e32.png
在.m文件中添加对应的三个事件

4.添加框架#import <SceneKit/SceneKit.h>

5.创建游戏场景(这个简单)

self.scnView.scene = [SCNScene scene];
self.scnView.backgroundColor = [UIColor blackColor];

6.创建太阳系(也很简单)

SCNNode *sunNode = [SCNNode node];
sunNode.geometry = [SCNSphere sphereWithRadius:3];
sunNode.geometry.firstMaterial.diffuse.contents = @"sun.jpg";
[self.scnView.scene.rootNode addChildNode:sunNode];

7.创建地月系(有点复杂哦)

// 1.我们需要先创建一个地月系节点.并且设置它为太阳系的子节点SCNNode *earthMoonNode = [SCNNode node];earthMoonNode.position = SCNVector3Make(10, 0, 0);[sunNode addChildNode:earthMoonNode];//2.创建一个地球节点,添加到地月系节点上去SCNNode *earthNode = [SCNNode node];
earthNode.geometry = [SCNSphere sphereWithRadius:1];
earthNode.geometry.firstMaterial.diffuse.contents = @"earth.jpg";
earthNode.position = SCNVector3Make(0, 0, 0);
[earthMoonNode  addChildNode:earthNode];// 3.创建一个月球系,让它添加到地球节点上去
SCNNode *moonNode = [SCNNode node];
moonNode.geometry = [SCNSphere sphereWithRadius:0.5];
moonNode.geometry.firstMaterial.diffuse.contents = @"moon.jpg";
moonNode.position = SCNVector3Make(2, 0, 0);
[earthNode addChildNode:moonNode];

8.接下来是,执行运动了

//1.太阳绕着Y轴自传SCNAction *sunRotate = [SCNAction repeatActionForever:[SCNAction rotateByAngle:0.1 aroundAxis:SCNVector3Make(0, 1, 0) duration:0.3]];
[sunNode runAction:sunRotate];// 2.地球绕着Y轴自传SCNAction *rotation =[SCNAction repeatActionForever:[SCNAction rotateByAngle:0.1 aroundAxis:SCNVector3Make(0, 1, 0) duration:0.05]];[earthNode runAction:rotation];

完成上面的步骤,太阳系我们创建好了,运行一下试试吧!

9.创建两个视角

 // 1.我们创建一个场景范围内的第三视角
@property(nonatomic,strong)SCNNode *thirdViewCamera;
self.thirdViewCamera = [SCNNode node];
self.thirdViewCamera.camera = [SCNCamera camera];
self.thirdViewCamera.camera.automaticallyAdjustsZRange = true;
self.thirdViewCamera.position = SCNVector3Make(0, 0, 30);
[self.scnView.scene.rootNode addChildNode:self.thirdViewCamera];// 2.我们创建一个地月系的第一视角
@property(nonatomic,strong)SCNNode *firstViewCamera;self.firstViewCamera = [SCNNode node];
self.firstViewCamera.camera =[SCNCamera camera];
self.firstViewCamera.position = SCNVector3Make(0, 0, 10);
[earthMoonNode addChildNode:self.firstViewCamera];

10.下面就是决定你视角是哪个的重要代码,请认真记住

 self.scnView.pointOfView = self.thirdViewCamera;

11.下面是和我们界面上绑定的三个button的事件

// 进入太阳系
- (IBAction)enterSunSystem:(id)sender {
self.scnView.pointOfView = self.thirdViewCamera;
SCNAction *move = [SCNAction moveTo:SCNVector3Make(0, 0, 30) duration:1];
[self.thirdViewCamera runAction:move];  
}
// 进入地月系
- (IBAction)enterEarthMoonSystem:(id)sender {
self.scnView.pointOfView = self.firstViewCamera;
}
// 离开太阳系
- (IBAction)exitSunSystem:(id)sender {SCNAction *move = [SCNAction moveTo:SCNVector3Make(0, 0, 400) duration:1];[self.thirdViewCamera runAction:move];
}

如果你想要理解三个星球的运动原理,请看下面这张图

1594482-0bc0a27af3ac0a3b.png
让学习成为一种习惯

你应该知道的

系统提供给我们的旋转方法,是只能沿着轴转动,比如你的节点在(0,1,0) 你让他沿着X轴旋转,它旋转后的坐标还是(0,1,0),因为它是沿着自身坐标系旋转的。

上图原理:

我们首先创建一个地月节点,将其设置为太阳的自节点,这样太阳旋转的时候,我们的地月节点,就会围绕这太阳转动,然后我们创建一个地球节点,让其成为地月节点的子节点,这样地球就能和地月节点一起围绕太阳节点转动了,同样的道理,月球节点成为地球节点的子节点,那么地球自身的时候,也能带动月球转动了。

提示:

本节内容比较简单,但是使用的频率比较高,请大家务必掌握。


代码库,听说经常给人点赞都当老板了!

这篇关于SceneKit_中级03_切换照相机视角的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1049856

相关文章

IDEA如何切换数据库版本mysql5或mysql8

《IDEA如何切换数据库版本mysql5或mysql8》本文介绍了如何将IntelliJIDEA从MySQL5切换到MySQL8的详细步骤,包括下载MySQL8、安装、配置、停止旧服务、启动新服务以及... 目录问题描述解决方案第一步第二步第三步第四步第五步总结问题描述最近想开发一个新应用,想使用mysq

React实现原生APP切换效果

《React实现原生APP切换效果》最近需要使用Hybrid的方式开发一个APP,交互和原生APP相似并且需要IM通信,本文给大家介绍了使用React实现原生APP切换效果,文中通过代码示例讲解的非常... 目录背景需求概览技术栈实现步骤根据 react-router-dom 文档配置好路由添加过渡动画使用

Spring Boot实现多数据源连接和切换的解决方案

《SpringBoot实现多数据源连接和切换的解决方案》文章介绍了在SpringBoot中实现多数据源连接和切换的几种方案,并详细描述了一个使用AbstractRoutingDataSource的实... 目录前言一、多数据源配置与切换方案二、实现步骤总结前言在 Spring Boot 中实现多数据源连接

cross-plateform 跨平台应用程序-03-如果只选择一个框架,应该选择哪一个?

跨平台系列 cross-plateform 跨平台应用程序-01-概览 cross-plateform 跨平台应用程序-02-有哪些主流技术栈? cross-plateform 跨平台应用程序-03-如果只选择一个框架,应该选择哪一个? cross-plateform 跨平台应用程序-04-React Native 介绍 cross-plateform 跨平台应用程序-05-Flutte

MyBatis 切换不同的类型数据库方案

下属案例例当前结合SpringBoot 配置进行讲解。 背景: 实现一个工程里面在部署阶段支持切换不同类型数据库支持。 方案一 数据源配置 关键代码(是什么数据库,该怎么配就怎么配) spring:datasource:name: test# 使用druid数据源type: com.alibaba.druid.pool.DruidDataSource# @需要修改 数据库连接及驱动u

FreeRTOS内部机制学习03(事件组内部机制)

文章目录 事件组使用的场景事件组的核心以及Set事件API做的事情事件组的特殊之处事件组为什么不关闭中断xEventGroupSetBitsFromISR内部是怎么做的? 事件组使用的场景 学校组织秋游,组长在等待: 张三:我到了 李四:我到了 王五:我到了 组长说:好,大家都到齐了,出发! 秋游回来第二天就要提交一篇心得报告,组长在焦急等待:张三、李四、王五谁先写好就交谁的

Unity3D自带Mouse Look鼠标视角代码解析。

Unity3D自带Mouse Look鼠标视角代码解析。 代码块 代码块语法遵循标准markdown代码,例如: using UnityEngine;using System.Collections;/// MouseLook rotates the transform based on the mouse delta./// Minimum and Maximum values can

解决Office Word不能切换中文输入

我们在使用WORD的时可能会经常碰到WORD中无法输入中文的情况。因为,虽然我们安装了搜狗输入法,但是到我们在WORD中使用搜狗的输入法的切换中英文的按键的时候会发现根本没有效果,无法将输入法切换成中文的。下面我就介绍一下如何在WORD中把搜狗输入法切换到中文。

Vue day-03

目录 Vue常用特性 一.响应更新 1. 1 v-for更新监测 1.2 v-for就地更新 1.3 什么是虚拟DOM 1.4 diff算法更新虚拟DOM 总结:key值的作用和注意点: 二.过滤器 2.1 vue过滤器-定义使用 2.2 vue过滤器-传参和多过滤器 三. 计算属性(computed) 3.1 计算属性-定义使用 3.2 计算属性-缓存 3.3 计算属

15 组件的切换和对组件的data的使用

划重点 a 标签的使用事件修饰符组件的定义组件的切换:登录 / 注册 泡椒鱼头 :微辣 <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-