Cocos Creator学习笔记

API文档地址：

    https://docs.cocos.com/creator/3.1/api/zh/

输出日志到控制台：

    cc.log("22222")

动态创建Sprite：

var node = new cc.Node('Sprite');
var sp = node.addComponent(cc.Sprite);
sp.spriteFrame = this.bk;
node.parent = this.node;

动态创建单色Sprite：

    addSprite: function(x, y, width, Height, R, G, B){
        // 函数体
        cc.log("addSprite")
        var node = new cc.Node('Sprite');
        var sp = node.addComponent(cc.Sprite);
        var spriteFrame = new cc.SpriteFrame();
        var texture = new cc.Texture2D();
        node.setPosition(x, y);

        texture.initWithData(new Uint8Array([R, G, B]), cc.Texture2D.PixelFormat.RGB888, 1, 1, cc.winSize);
        spriteFrame.setTexture(texture);
        spriteFrame.setRect(cc.rect(0, 0, width, Height));
        sp.spriteFrame = spriteFrame;
        node.parent = this.node;

        return node
    }

鼠标（触摸）响应：

    onLoad: function () {
        this.node.on(cc.Node.EventType.MOUSE_DOWN, this.onMouseDown, this);
        this.node.on(cc.Node.EventType.MOUSE_UP, this.onMouseUp, this);
        this.node.on(cc.Node.EventType.MOUSE_MOVE, this.onMouseMove, this);
    },

    onDestroy: function () {
        this.node.off(cc.Node.EventType.MOUSE_DOWN, this.onMouseDown, this);
        this.node.off(cc.Node.EventType.MOUSE_UP, this.onMouseUp, this);
        this.node.off(cc.Node.EventType.MOUSE_MOVE, this.onMouseMove, this);
    },

    onMouseDown: function (event) {
        cc.log("onMouseDown")
    },

    onMouseUp: function (event) {
        cc.log("onMouseUp")
    },

    onMouseMove: function (event) {
        cc.log("onMouseMove")
    },   

获取鼠标按键和坐标

        onMouseDown: function (event) {
            let mouseType = event.getButton();
            if (mouseType === cc.Event.EventMouse.BUTTON_LEFT) {
                // 鼠标左键按下
                cc.log("onMouseDown")
                let mousePoint = event.getLocation();
                this.oldPoint = mousePoint
                this.moveing = true
            } 
        },

抠图、截屏：

start: function () {

    let texture = new cc.RenderTexture(cc.visibleRect.width, cc.visibleRect.height, cc.Texture2D.PIXEL_FORMAT_RGBA8888);
    texture.initWithSize(cc.visibleRect.width, cc.visibleRect.height, cc.gfx.RB_FMT_D24S8);
    this.camera.targetTexture = texture;
    this.texture = texture;
},

capture () {
	let width = this.texture.width;
	let height = this.texture.height;

	let canvas = document.createElement('canvas');
	let ctx = canvas.getContext('2d');
	canvas.width = width;
	canvas.height = height;

	this.camera.render();
	let data = this.texture.readPixels();
	
	let rowBytes = width * 4;
	for (let row = 0; row < height; row++) {
		let srow = height - 1 - row;
		let imageData = ctx.createImageData(width, 4);
		let start = srow*width*4;
		for (let i = 0; i < rowBytes; i++) {
			imageData.data[i] = data[start+i];
		}
		ctx.putImageData(imageData, 0, row);
	}

	var dataURL = canvas.toDataURL("image/bmp");
	var img = document.createElement("img");
	img.src = dataURL;
	return img;
},

onBtn: function(send, xxx){    
	cc.log("onBtn")

	var img = this.capture();
	
	let texture = new cc.Texture2D();
	texture.initWithElement(img);
	
	let spriteFrame = new cc.SpriteFrame();
	spriteFrame.setTexture(texture);

	this.bk.spriteFrame = spriteFrame;
}

创建纹理：

    addPic: function(x,y,width, Height, R, G, B){
        // 函数体
        cc.log("addCell")
        var imgWidth = 200;
        var imgHeight = 200;
        var count = imgWidth * imgHeight * 4;
        var imgData =new Uint8Array(count);
        for (var j = 0; j < count; j += 4) {
            imgData[j] =  this.random(0, 255);
            imgData[j + 1] =  this.random(0, 255);
            imgData[j + 2] =  this.random(0, 255);
            imgData[j + 3] = 255;
        }
 
        var myTexture2D =new cc.Texture2D();
        myTexture2D.initWithData(imgData, cc.Texture2D.PixelFormat.RGBA8888, imgWidth, imgHeight);
 
        var node =new cc.Node('测试图片');
        node.width = imgWidth;
        node.height = imgHeight;
        //node.parent = Main.node;
         
        var sprite = node.addComponent(cc.Sprite);
        sprite.spriteFrame =new cc.SpriteFrame();
        sprite.spriteFrame.setTexture(myTexture2D)
        sprite.spriteFrame.setRect(cc.rect(0, 0, imgWidth, imgHeight));
        node.parent = this.rootCell;

        this.myTexture2D = myTexture2D;

        return node
    },

随机数：

    random : function (lower, upper) {
        return Math.floor(Math.random() * (upper - lower+1)) + lower;
        
        },