美文网首页
01.CocosCreator概述及cc.Component和c

01.CocosCreator概述及cc.Component和c

作者: LewisZhu | 来源:发表于2018-05-09 17:29 被阅读0次

1.cc.Component

1.所有的组件都继承自cc.Component(构造函数),即就是cc.Class({……})定义了新的类的构造函数,这个类继承于cc.Component.
2.每一个cc.Component组件实例都有个成员node,指向它关联的节点cc.Node
3.每一个cc.Component组件可以通过name属性获取到节点的名字
4.组件实例的入口函数:


image.png

2.cc.Node

1.creator是有一个个游戏场景组成,场景是一个树形结构,cc.Node就是树送的节点对象。
可以给每个节点添加组件,添加的时候,会new出一个组件实例。
2.cc.Node的属性


image.png

3.cc.Node常用方法


image.png

3.代理实例:js脚本组件

cc.Class({
    extends: cc.Component,
    properties: {
        // foo: {
        //    default: null,      // The default value will be used only when the component attaching
        //                           to a node for the first time
        //    url: cc.Texture2D,  // optional, default is typeof default
        //    serializable: true, // optional, default is true
        //    visible: true,      // optional, default is true
        //    displayName: 'Foo', // optional
        //    readonly: false,    // optional, default is false
        // },
        // ...
    },
    // use this for initialization
    // 组件实例在加载的时候运行
    // 组件实例.onLoad(), 组件实例.start;
    onLoad: function () {
        // this, --> 当前组件实例
        console.log(this);
        console.log("this.onLoad");

        // 代码里面怎么找到节点?
        // 指向这个组件实例所挂载的节点
        console.log("=======================");
        console.log(this.node);
        console.log(this.node.name);
        console.log(this.node.active);
        console.log(this.node.x, this.node.y, this.node.position);
        console.log(this.node.group, this.node.groupIndex);
        if (this.node.parent) {
            console.log(this.node.parent.name);
            console.log("go if @@@@@");
        }
        else {
            // console.log(this.node.parent);
            console.log("go else @@@@@");
        }
        console.log("========================");
        // end 
        // 孩子
        var children = this.node.children; // [cc.Node, cc.Node, cc.Node]
        for(var i = 0; i < children.length; i ++) {
            console.log(children[i].name);
        }
        // end 
        console.log("yes we have:", this.node.childrenCount,"chilren");
        // 添加
        /*var new_node = new cc.Node();
        this.node.addChild(new_node);
        new_node.removeFromParent();
        this.node.removeAllChildren();*/
        // end 
        // 查找,局部查找
        var item = this.node.getChildByName("item1");
        console.log("^^^^^^^", item.name);
        // end 
        // 全局, 时间消耗,对于编写通过用的模块
        item = cc.find("Canvas/parent/item1");
        console.log("#######", item.name);
        // end 
        var pos = item.getPosition(); // 相对位置
        console.log("pos = ", pos);
        pos = cc.p(100, 100); // cc.Vec,
        item.setPosition(pos);
        var item2 = this.node.getChildByName("item2");
        item2.setLocalZOrder(100);
        item2.active = false; //  
    },
    // 组件实例
    start: function() {
    },
    // called every frame, uncomment this function to activate update callback
    // 组件实例.update
    update: function (dt) {
    },
});

相关文章

网友评论

      本文标题:01.CocosCreator概述及cc.Component和c

      本文链接:https://www.haomeiwen.com/subject/cwkorftx.html