Hello World 的Demo 里面骑士Fbx模型,默认只提供了一种站立动作。有没有模型是多种动作?答案是有的,这个时借助Cocos 商店给我们这个便利来实现多套动作观察。
1 通过商城获取模型资源Cocos 商店引入模型
Cocos商店提供了付费和免费两档的资源服务。进入商城后,寻找美术资源,免费一栏。找到Cocos 宇航员的素材。点击查看详情下载引入Cocos的太空形象到相应的项目,这个操作只需要在CocosDashboard 商城打开导入资源管理目录即可获取到免费的学习资源。
Cocos 的官方商店
这个时候,场景中可以拥有多动作的模型。为了对比效果,将骑士和太空鼠摆放在同一个场景。
形象对比
动作组件展示对应一个动作
2.手动切换不同动作在属性面板里面,提供了一个动作绑定。通过资源管理器拖动资源到Default Clip处实现展示不同的动作。这个不能立刻预览,需要编译后才能观察到每一个动作播放情况。默认勾选了Play On Load 这个选项会在运行的时候播放,如果不希望运行的时候播放则取消即可。
动作播放
拖放到对应的文件
跑步动作
3.通过代码实现不同动作切换商店素材提供了多个动作文件,通过手动变换实现不同动作表现。而使用代码切换实现代码控制播放。属性面板通过SkeletalAnimation 来播放默认的影片剪辑AnimationClip。代码中需要拿到这个SkeletalAnimation组件引用,再通过设置不同的影片剪辑实现不同的动作播放。
面板里面将2个动作绑定在属性面板里面
import { _decorator, Component, Node, SkeletalAnimation, AnimationClip } from 'cc';
const { ccclass, property } = _decorator;
@ccclass('MulAction')
export class MulAction extends Component {
private skAnimation:SkeletalAnimation
@property(AnimationClip)
public runAnimationClip:AnimationClip = null
@property(AnimationClip)
public attackAnimationClip:AnimationClip = null
private time:number = 0;
private isRun:Boolean = true;
start() {
this.skAnimation = this.getComponent(SkeletalAnimation)
}
update(deltaTime: number) {
this.time ;
if(this.time % 200== 0){
this.time = 0;
if( this.isRun ){
this.isRun = false;
this.skAnimation.defaultClip = this.runAnimationClip
this.skAnimation.play()
console.log("切换了跑步动作")
}else{
this.skAnimation.defaultClip = this.attackAnimationClip
this.isRun = true;
this.skAnimation.play()
console.log("切换了攻击动作")
}
}
}
}
4.Cocos 属性面板添加编辑属性
拖拽对应动画文件
Cocos 里面提供了这种属性的机制,使用property 绑定相应的类,属性面板能够提供一个输入框来完成可以输入的机制。十分方便去引用对应资源。
@property(AnimationClip)
public runAnimationClip:AnimationClip = null
@property(AnimationClip)
public attackAnimationClip:AnimationClip = null
代码控制
@property(Boolean)
public isRun:Boolean = true;
通过指定对应类型,面板就可以实现修改这个变量值。
5.不同动作来源在Hello World 文件中提供了一个骑士模型,还可以通过Blender,Cocos 商店来获取Fbx资源文件实验。这些文件极大方便在初学的时候使用。合理利用这些软件配合Hello World的完成。这个Demo中还包含了很多隐藏的信息。需要再一步挖掘。
攻击和跑步动作切换
Copyright © 2024 妖气游戏网 www.17u1u.com All Rights Reserved