天天看點

微信小遊戲-CocosCreator 基礎(六)

var my_item = require("my_item");

// 傳回了一個構造函數,然後繼承了cc.Component

// 代碼元件也有cc.Component元件的方法;

// cc.Component, 固定的入口函數

cc.Class({

    extends: cc.Component,

    // 屬性清單

    properties: {

        // 基本資料類型, 數,bool, 字元串, color, pos, size

        speed: 100,

        is_debug: false,

        url_str: "",

        color: cc.color(0, 0, 0, 255),

        pos: cc.p(0, 0),

        size: cc.size(100, 100),

        // end 

        // 系統的元件, cc.Sprite, cc.Button, cc.Label, ..

        sprite_item: {

            type: cc.Sprite,//傳入的類型

            default: null, // null/[]

        }, 

        sprite_array: {

            type: cc.Sprite,

            default: [],

        },

        // end 

        // 元件的代碼元件

        custom_comp: {

            type: my_item,   //構造函數==類型 //傳入的是場景中節點的元件

            default: null, // null /[]

        },

        // end 

         //其他類型設定:

        //打開engine=》cclabel.js

    },

    // end 

    // use this for initialization

    // 元件在加載的時候運作

    // 你可以在onLoad裡面通路場景的節點和資料,這個時候場景的節點和資料都已經準備好了

    // 不會發生在調用onLoad的時候,還會出現場景節點沒有出來的情況

    onLoad: function () {

        console.log("onLoad");

        // this, 指的是目前的元件執行個體

        // this.node --> cc.Node, 這個元件所挂的節點對象

        // 元件執行個體找對應的節點   元件.node來擷取;

        console.log(this.node);

        // Canvas<game_scene> Canvas

        console.log(this.name, this.node.name); // 元件執行個體所挂載的節點的名稱<元件名稱>, 節點.name 直接為名稱;

    },

    // 元件在第一次update調用之前調用

    start: function() {

        console.log("start");

        // 添加元件,系統元件cc.Sprite, cc.Label等, "元件代碼的名字"

        // 傳回,傳回挂上的元件執行個體

        var com_inst = this.addComponent("my_item");

        com_inst = this.node.addComponent("my_item");

        // end 

        // 查找元件執行個體

        com_inst = this.node.getComponent("my_item");

        com_inst = this.getComponent("my_item"); // 傳回的是第一個找到的元件

        var com_array = this.getComponents("my_item"); // 傳回的是元件數組[執行個體1,執行個體2, 執行個體3]

        console.log(com_inst, com_array);

        // end 

        //查詢孩子節點元件執行個體

        //getComponentInChildren(元件類型)

        //getComponentsInChildren(元件類型)

        // 删除元件

        // this.destroy(); // 删除目前的元件執行個體,觸發onDisable, onDestroy的調用

        // end 

        // 啟動定時器, 節點或元件必須是激活狀态,  例如被隐藏的節點,都是無法啟動定時器的;

        // 這裡隻會觸發一次調用

        this.scheduleOnce(function() {

            console.log("scheduleOnce called");

        }.bind(this), 5);

        // end 

        // schedule(函數, 多長時間掉一次, 次數(永遠), 隔多少秒以後開始執行shedule)

        // 5秒鐘以後,每隔1秒,我們調用6 + 1次函數;

        this.schedule(function() {

            console.log("schedule called");

        }.bind(this), 1, 6, 5); // 次數 6 + 1 = 7;

        // end 

        this.schedule(function() {

            console.log("schedule forerver called");

        }.bind(this), 1, cc.macro.REPEAT_FOREVER, 5); // 次數 6 + 1 = 7;  cc.macro.REPEAT_FOREVER 永遠

        // end 

        // 取消所有的shedule

        this.scheduleOnce(function() {

            console.log("cancel all schedules");

            this.unscheduleAllCallbacks();  

        }.bind(this), 30);

        // 隻取消一個, unschedule(函數對象)

        var callback = function() {

            console.log("======================");

        }.bind(this);

        this.schedule(callback, 0.5); // 預設值為永遠執行,馬上開始

        this.scheduleOnce(function() {

            // 取消了一個定時器

            this.unschedule(callback);

        }.bind(this), 5);

    },

    // called every frame, uncomment this function to activate update callback

    // 每次遊戲重新整理的時候調用, dt距離閃一次重新整理的實踐   畫面更新前

    update: function (dt) {

        // console.log("update called", dt);

    },

// 不是特别常用,update之後   畫面更新後

    lateUpdate: function(dt) {

        // console.log("lateUpdate");

    },

    // 元件被激活的時候調用

    onEnable: function() {

        console.log("onEnable");

    },

    // 元件被禁用的時候調用

    onDisable: function() {

        console.log("onDisable");

    }, 

    // 元件執行個體銷毀的時候調用

    onDestroy: function() {

        console.log("onDestroy");

    },

    //順序:

    OnLoad=》OnEnable=》OnStart=》Update

});

繼續閱讀