three.js 動畫相關(guān)

需求描述

通過剪輯AnimationClip、操作AnimationAction、混合器AnimationMixer的屬性或方法完成一些播放效果。

定義動畫

1.創(chuàng)建混合器并返回動畫操作對象

定義動畫

2.在幀渲染函數(shù)中獲取兩幀的時間間隔,并更新混合器時間(非常重要)

幀渲染

播放/暫停/加速

1. 播放

runAction.play();

2. 暫停

runAction.paused = true;

3.加速

方法一:runAction.timeScale = actionSpeed; // 默認(rèn)為1

方法二:mixer.update(dt * actionSpeed); // 修改更新混合器時間的大小

滾動條播放

滾動條

其它

1.是否循環(huán)播放 - AnimationAction.loop

THREE.LoopRepeat? ?默認(rèn)值,重復(fù)次數(shù)為repetitions次

THREE.LoopOnce? ?只執(zhí)行一次

THREE.LoopPingPong? ?重復(fù)次數(shù)為repetitions次,且像乒乓球一樣在起始點(diǎn)與結(jié)束點(diǎn)之間來回循環(huán)

2.動畫剪輯執(zhí)行次數(shù) - repetitions

可以直接設(shè)置repetitions值,默認(rèn)是Infinity,也可以通過setLoop(loop, repetitions)同時設(shè)置兩個屬性

3.最后一幀自動暫停 - clampWhenFinished

默認(rèn)為false

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容