cocos creator实现读取白鹭movieClip组件(尝试)

背景:原本是做白鹭项目的,后续考虑换成creator,但是由于creator的动画编辑器比较难受,而在白鹭那边已经有了一些脚本工具,因此希望在creator上实现一个组件,直接能够播放白鹭的movieClip。

        在cocos社区找了一圈,没有找到可以直接伸手的组件,故想着自己也试着来造造轮子。

期待的样子:

1.实现movieClip控件(继承Node节点),直接new出来,添加到对应节点下,然后可以调用load(fileName)接口直接加载资源。playMovie/loadAndPlay等直接播放或者加载播放对应的动画/动作;一些额外回调操作;

2.实现movieClipComponent组件,可以挂载到节点上。具体是实现上述的需求。

首先做的一些准备:

        1.封装了读取mc资源的接口,主要是来读取json跟texture2d;

 加载json,加载texture,保证两步都加载完成了,才进行下一步操作。

解析配置主要做的是把json里的资源resData跟  动画mcData保存下来。

实现思路:

        1.当前帧包括当前动画/当前动作/当前帧索引等。将这些作为一个私有变量保存起来,这样可以随时getter/setter。在数据发生变化的时候才重新去计算当前值。

        2.基于update帧驱动或者计时器驱动,获取当前帧的配置数据,将纹理渲染出来,然后索引+1,等待下一次刷新。

只是拿到了当前帧的配置数据,怎样才能在雪碧图里裁切出想要的子图呢?

在这里我采取的办法是spriteFrame中的设置rect,来实现子图的效果。

在实现的路上,暂时忽略new过程中的性能损耗。。。。

3.后续又加入了循环以及播放次数的判断。播放结束/完成等的判断。

 最后终于能够把动画播放起来了。 

延时切换到该文件下的其他动画,结果也是可行。 

最后是完整的代码。。。。。

import { Node } from "cc";
import { MovieClipComponent } from "./MovieClipComponent";

export class MovieClip extends Node{

    private _mcc:MovieClipComponent;
    private get mcc(){
        if(!this._mcc)
            this._mcc = this.addComponent(MovieClipComponent);
        return this._mcc;
    }
    private _fileName:string;
    constructor(){
        super();
    }

    onLoad(){
        
    };

    /**
     *  加载mc资源文件
     */
    public loadFile(fileName:string){
        if(fileName === this._fileName){
            return;
        }
        this._fileName = fileName;
        this.mc
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值