【Creator】学习笔记

这篇博客介绍了Cocos Creator中如何设置物体移动方向,强调了脚本名称大小写的敏感性,详细讲解了update函数、Prefab资源的使用、组件获取、点间角度计算以及坐标转换方法。还涵盖了动态加载资源如Prefab、AnimationClip、SpriteFrame以及SpriteAtlas的操作,并提到了配置文件的加载。此外,博主分享了如何通过属性检查器调整物体的移动方向。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Cocos Creator 中脚本名称就是组件的名称,这个命名是大小写敏感的!如果组件名称的大小写不正确,将无法正确通过名称使用组件!打开的脚本里已经有了预先设置好的一些代码块,这些代码就是编写一个组件脚本所需的结构。

// 定义全局变量可以直接通过”this.”的方式

this.jumpAction = this.setJumpAction(); 

// 详情查询Cocos Creator生命周期
update function 在加载场景以后自动每帧调用一次

// 预制文件
对于需要重复生成的节点,我们可以将他保存成Prefab(预制)资源,作为我们动态生成节点时使用的模板。

// 用来定义属性和创建接口,命名开头加”_”可不在外部显示

 properties: {
     externalInterface: cc.type
 }

只有在属性声明时规定 type 为引用类型时(比如cc.Prefab , cc.Node…类型),才能够将资源或节点拖拽到该属性上

// this.getComponent(“name”)

getComponent 获取节点上指定类型的组件,如果节点有附加指定类型的组件,则返回,如果没有则为空。传入参数也可以是脚本的名称。 (在当前节点上去获取”name”组件)

// 求两个点之间的角度

cc.radiansToDegrees(cc.pAngleSigned(po1,po2)) 返回点po1,po2之间的角度

// 转坐标
convertToWorldSpaceAR(将一个点转换到世界空间坐标系。结果以 Vec2 为单位。返回值将基于节点坐标。)
convertToNodeSpaceAR(将一个点转换到局部坐标系。结果以 Vec2 为单位。返回值将基于节点坐标。)

// 动态加载
// 需要动态加载的资源必须放在名为resources的文件夹下**

1.加载 Prefab

cc.loader.loadRes("test assets/prefab", function (err, prefab) {
    var newNode = cc.instantiate(prefab);
    cc.director.getScene().addChild(newNode);
});

2.加载 AnimationClip

    cc.loader.loadRes("test assets/anim", function (err, clip) {
        myNode.getComponent(cc.Animation).addClip(clip, "anim");
    });

3.加载单独的SpriteFrame

cc.loader.loadRes("test assets/image", cc.SpriteFrame, function (err, spriteFrame) {
        myNode.getComponent(cc.Sprite).spriteFrame = spriteFrame;
    });

4.将加载SpriteFrame封装成一个function,传入container(需要添加图片节点的Sprite),name(图片名字)两个参数,并在1S后显示他

_addSpriteFrameToContainer:function(container , name){
        cc.log('load pic:',name)
        container.spriteFrame = this.loadWaitImage
        cc.loader.loadRes(name, cc.SpriteFrame, function (err, atlas) {
            cc.log(atlas)
            setTimeout(function() {
                container.spriteFrame = atlas
            }, 1000);
        });
    }

5.加载 SpriteAtlas(图集),并且获取其中的一个 SpriteFrame
! 注意 atlas 资源文件(plist)通常会和一个同名的图片文件(png)放在一个目录下
所以需要在第二个参数指定资源类型**

    cc.loader.loadRes("test assets/sheep", cc.SpriteAtlas, function (err, atlas) {
      var frame = atlas.getSpriteFrame('sheep_down_0');
      sprite.spriteFrame = frame;
    });

加载配置文件

_loadMapData:function(){
        var that = this
        cc.loader.loadRes("csv/map", function (err, mapCsv) {
            //  配置文件内容换行
            var mapArr = mapCsv.split("\n")
            //  将配置文件从第二行开始用","隔开放入一个数组里
            for(var i = 1; i < mapArr.length;i++){
                var arr = mapArr[i].split(',')
                //  如果GameData.map[arr[0]]不存在则将GameData.map[arr[0]] = {}
                //  如果GameData.map[arr[0]]存在则将值赋给他
                GameData.map[arr[0]] = GameData.map[arr[0]] || {}
                //  将配置文件里的内容添加到GameData.map里
                GameData.map[arr[0]][arr[1]] = {
                    image:"pic/map_person/"+arr[2],
                    name:arr[3],
                    msg:arr[4],
                    position:cc.p(parseInt(arr[5]),parseInt(arr[6])),
                    action:arr[7]
                }
            }
            that._loadEnd()
        });
    },
    _loadEnd:function(){
        this._loadedNum ++
        //  当所有配置文件加载完成以后,就进入if
        if(this._loadedNum == this._C_needLoadNum){
            //  加载完成
            //  用getComponent获取当前节点上的"ShowMap"组件,调用"ShowMap"里的pub_beginShow方法
            this.getComponent("ShowMap").pub_beginShow()
        }
    },

设置物体移动方向技巧

    properties: {
    moveX:0,
    moveY:0,
    },

    updata: function (){
        this._player.x += this.moveX * 1
      this._player.y += this.moveY * 1
    }

对外公布一个X,Y方向,通过在属性检查器上设置1,0,-1来改变他的移动方向

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值