本节学习目标
提供两种将序列帧动画渲染到模型上的方式
准备一组动画图片跟着教程一起做
image.png
第一种方式 - 使用行为动画(SCNAction)
// 第一步 - 创建动画组
var images :[UIImage] = []
for i in 1...10 {
let name = "\(i).tiff"
images.append(UIImage(named:name)!)
}
// 第二步 给模型节点添加行为动画
var count = 0
let action = SCNAction.customAction(duration: 0.1) { (node, progress) in
print(progress)
if progress >= 0.1 {
count += 1
node.geometry?.firstMaterial?.diffuse.contents = images[count%9]
}
}
// 让行为持续 长一点 就能实现连贯的动画
planeNode.runAction( SCNAction.repeat(action, count: 1000))
tip:为什么 要设置 progress >= 0.1 而不是 = ,0.1代表我们行为持续的时间,看下面的日志
0.00141505610443735
0.0180852222157303
0.0347495143823253
0.0513938077001841
0.0681048463002569
0.084751595329517
0.100000001490116 // 是一个> 0.1 的值有误差范围
第二种方式 - 将uiimageview 渲染到模型上
// 第一步 创建持有动画的imageView
let imageView = UIImageView()
imageView.frame = CGRect(x: 0, y: 0, width: 200, height: 200)
var images :[UIImage] = []
for i in 1...10 {
let name = "\(i).tiff"
images.append(UIImage(named:name)!)
}
imageView.animationImages = images
imageView.animationDuration = 1
imageView.animationRepeatCount = -1
imageView.startAnimating()
// 第二步 渲染imageView 到模型上去
planeNode.geometry?.firstMaterial?.diffuse.contents = imageView
这个时候,你运行程序是没有动画效果的,因为模型是静止的,scenekit 不会对静止的模型实时渲染,这个时候要让模型渲染imageview 有两种办法,第一种就是让模型小幅度运动,但让用户察觉不到,另外一种方式如下
scnView.isPlaying = true
这个时候运行程序 序列帧动画已经开始执行了 效果如下
gif6.gif
