本節(jié)學(xué)習(xí)目標(biāo)
提供兩種將序列幀動(dòng)畫(huà)渲染到模型上的方式
準(zhǔn)備一組動(dòng)畫(huà)圖片跟著教程一起做
image.png
第一種方式 - 使用行為動(dòng)畫(huà)(SCNAction)
// 第一步 - 創(chuàng)建動(dòng)畫(huà)組
var images :[UIImage] = []
for i in 1...10 {
let name = "\(i).tiff"
images.append(UIImage(named:name)!)
}
// 第二步 給模型節(jié)點(diǎn)添加行為動(dòng)畫(huà)
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]
}
}
// 讓行為持續(xù) 長(zhǎng)一點(diǎn) 就能實(shí)現(xiàn)連貫的動(dòng)畫(huà)
planeNode.runAction( SCNAction.repeat(action, count: 1000))
tip:為什么 要設(shè)置 progress >= 0.1 而不是 = ,0.1代表我們行為持續(xù)的時(shí)間,看下面的日志
0.00141505610443735
0.0180852222157303
0.0347495143823253
0.0513938077001841
0.0681048463002569
0.084751595329517
0.100000001490116 // 是一個(gè)> 0.1 的值有誤差范圍
第二種方式 - 將uiimageview 渲染到模型上
// 第一步 創(chuàng)建持有動(dòng)畫(huà)的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
這個(gè)時(shí)候,你運(yùn)行程序是沒(méi)有動(dòng)畫(huà)效果的,因?yàn)槟Ｐ褪庆o止的,scenekit 不會(huì)對(duì)靜止的模型實(shí)時(shí)渲染,這個(gè)時(shí)候要讓模型渲染imageview 有兩種辦法,第一種就是讓模型小幅度運(yùn)動(dòng),但讓用戶(hù)察覺(jué)不到,另外一種方式如下
scnView.isPlaying = true
這個(gè)時(shí)候運(yùn)行程序 序列幀動(dòng)畫(huà)已經(jīng)開(kāi)始執(zhí)行了 效果如下
gif6.gif
