四 cocos create UI系统

基础渲染组件-精灵组件

sprite组件

基础渲染组件-Lable组件

Overflow文字排版

Button-按钮组件

Button-点击事件

属性检查器添加

脚本代码click.js

// Learn cc.Class:
//  - [Chinese] http://docs.cocos.com/creator/manual/zh/scripting/class.html
//  - [English] http://www.cocos2d-x.org/docs/creator/en/scripting/class.html
// Learn Attribute:
//  - [Chinese] http://docs.cocos.com/creator/manual/zh/scripting/reference/attributes.html
//  - [English] http://www.cocos2d-x.org/docs/creator/en/scripting/reference/attributes.html
// Learn life-cycle callbacks:
//  - [Chinese] http://docs.cocos.com/creator/manual/zh/scripting/life-cycle-callbacks.html
//  - [English] http://www.cocos2d-x.org/docs/creator/en/scripting/life-cycle-callbacks.html

cc.Class({
    extends: cc.Component,

    properties: {
        // foo: {
        //     // ATTRIBUTES:
        //     default: null,        // The default value will be used only when the component attaching
        //                           // to a node for the first time
        //     type: cc.SpriteFrame, // optional, default is typeof default
        //     serializable: true,   // optional, default is true
        // },
        // bar: {
        //     get () {
        //         return this._bar;
        //     },
        //     set (value) {
        //         this._bar = value;
        //     }
        // },
    },

    // LIFE-CYCLE CALLBACKS:

    // onLoad () {},

    start () {

    },

    btnClick(event,customEventData){
        let node= event.target;
        cc.log("通过属性检查器设置点击事件：",customEventData);

    }

    // update (dt) {},
});

customEventData 传参

脚本添加添加回调

game.js

cc.Class({
    extends: cc.Component,

    properties: {
        button: cc.Button

    },

    // LIFE-CYCLE CALLBACKS:

    // onLoad () {},

    start () {
        this.button.node.on('click',this.callback,this);

    },

    callback: function(button){
        cc.log("登录。。。。。。");
    }

    // update (dt) {},
});

运行结果