Cocos creator 学习笔记（）

1.一般重复出现的节点  会生成预制体动态添加进场景中

        0.制作预制体  https://blog.csdn.net/u012987441/article/details/100637797

        1.绑定预制体预制体绑定教程

        2.将预制体添加到场景中

                

 this.blockNodeArr=[];//更好的管理预制体才声明的变量
        for(var a=0;a<10;a++){
            console.log("生成第一个预制体");
            // 生成第一块节点用预制体
            let blockNode=cc.instantiate(this.blockPrefa);
            blockNode.x=this.lastBlockPosX+50;
            blockNode.y=0; 
            if(a==0){
                var suijish=100;
            }else{
                var suijish=this.randomNum(30,60);
            }
           
            blockNode.getComponent("block").init(suijish);

            
            //放入场景中去
            this.blockAreaNode.addChild(blockNode);
            this.blockNodeArr.push(blockNode);
        
        }

2访问其他js脚本的方法以及变量

场景中新建一个js脚本

节点中再绑定js脚本

blockNode.getComponent("block").init(suijish);

//blockNode游戏节点
//节点名称  block
//节点绑定的js脚本   init()方法是js里面新建的

3.获取屏幕的宽

cc.winSize.width

4.绑定页面滑动事件

 this.node.on("touchstart",this.boost,this);

5.解绑页面滑动事件

this.node.off("touchstart",this.boost,this);

6.widget  UI组件  四个方向都设置0

7.物理组件

RigidBody  Box（碰撞组件）

8.打开物理引擎

  let memmget=cc.director.getPhysicsManager();

        memmget.enabled=true;

        memmget.gravity=cc.v2(0,-2200);

 9切换场景

 cc.director.loadScene("game");//回到初始场景（重新进入场景） 

10监听场景中的点击事件  以及销毁事件

 //这是界面事件

input.on(Input.EventType.TOUCH_START, this.onTouchStart, this);
        input.on(Input.EventType.TOUCH_MOVE, this.onTouchMove, this);
        input.on(Input.EventType.TOUCH_END, this.onTouchEnd, this);


销毁
 input.off(Input.EventType.TOUCH_START, this.onTouchStart, this);
        input.off(Input.EventType.TOUCH_MOVE, this.onTouchMove, this);
        input.off(Input.EventType.TOUCH_END, this.onTouchEnd, this);

这是节点事件
  this.node.on(Node.EventType.TOUCH_MOVE, this.onTouchMove, this);

11开启碰撞管理器  使用了物理碰撞组件  BOX的

     cc.director.getPhysicsManager().debugDrawFlags=true;
        // 开启物理碰撞管理器
        cc.director.getCollisionManager().enabled=true;
       cc.director.getCollisionManager().debugDrawFlags=true;

12刚体动态静态切换

  let rightbody=this.box.getComponent(cc.RigidBody);
   rightbody.type='static';

13获取节点下的

children[a].getComponent(UITransform)

UITransform这是组件  然后就可以点出来组件的属性了

 children[a]//获取到的是节点

14.判断是否点击到了此节点上

children[a].getComponent(UITransform).contains(new Vec2(v3_onTouchStart.x,v3_onTouchStart.y))

15获取节点的组件的属性

节点.getComponent(组件名).属性名

   childs[a].getComponent(Sprite).color

16获取节点的js里面的方法

节点.getComponent(js文件)

17给button绑定点击事件

第一个箭头是节点：绑定了js的一个节点

第二个箭头是     第一个节点绑定的js

第三个箭头是    js里面的按钮的点击事件的方法

下面customeventData  是给方法传的参数

btnClick(event:Event,custom:string){

        console.log("调整卷");

    }

18  删除父元素底下所有的节点

this.parentBlocks.removeAllChildren();

19如果一个节点下绑定两个js脚本，哪个脚本先在前面，就先执行谁

20js引入另一个js脚本，执行其中的方法以及变量

 三个箭头的名字必须一致

引入js文件

import { gameData } from './gameData';

拿到js类

 this.gameData=this.node.getComponent(gameData);

21定时器

 this.scheduleOnce(res=>{
                this.init();
            },1);

意思是一秒后执行

22

.getUILocation()  获取节点相对于左下角的位置

getLocation()  获取触点位置对象

23 给节点加上动画

  tween(list[a])
                    .delay(0.05)
                    .to(0.1, { scale: new Vec3(0, 0,0) })
                    .removeSelf()
                    .start();//给节点加上动画

//list[a]为子节点  node下的

24清空父节点下的所有子节点

this.parentBlocks.removeAllChildren();

25坐标转换

从节点坐标转成世界坐标，再转成节点坐标

let v3_world = this.parentBlocks.getComponent(UITransform).convertToWorldSpaceAR(v3_block_start)
        let v3_node_di = this.parentBlockBottom.getComponent(UITransform).convertToNodeSpaceAR(v3_world)

26播放音频以及引入音频     

  1.获取播放音频的类

       // 获取音频组件

        this.audioSource=this.node.getComponent(AudioSource);

2.播放音频

this.audioSource.playOneShot(this.arrMusic[1],1);//播放短的音频

3.this.arrMusic[1]  这是通过音频资源组件（AudioClip）

    @property({type:[AudioClip]})

    arrMusic=[];//存的音频资源，手动关联  这是数组

27修改图片资源

28添加动画播放动画

TypeScript

1.

 init(mainGame:MainGame){
        
    }
//形参  是一个ts文件名，讲ts的上下文传入这个方法，就可以实现从这个ts文件调用MainGame   ts文件的方法

2.监听碰撞体碰撞事件

onLoad里

let collider:Collider2D=this.getComponent(Collider2D);
        if(collider){
            collider.on(Contact2DType.BEGIN_CONTACT,this.onBeginConcat,this)
        }

实现方法

 // 监听碰撞事件
    onBeginConcat(selt:Collider2D,other:Collider2D,contact:IPhysics2DContact|null){

    }

可以再项目-->物理设置里面添加碰撞组

3.找到不是同一个父节点的节点下的组件并修改其属性

find("/Canvas/Score").getComponent(Label).string="分数："+globle.score;

this.node.getChildByName("Score").getComponent(Label).string="得分"+globle.score;

4.播放音效

首先给节点绑定AudioClip组件，然后关联音频文件，js中声明接收AudioClip组件的变量

  this.node.getComponent(AudioSource).play(音频组件变量);//播放音效

5添加贞动画  （小人动作）

动画编辑界面  有一个属性编辑列表  点击加号  选择 cc.sprite  然后再选择spriteFrame  图片资源

6.公共的TS文件，其他ts问价 都可访问

import { _decorator, Component, Node, view } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('globle')
export class globle extends Component {

    public static width:number=view.getDesignResolutionSize().width;//得到项目设计的高度
    public static height:number=view.getDesignResolutionSize().height;//得到项目设计的宽度

    public static score:number=0;

    start() {

    }

    update(deltaTime: number) {
        
    }
}