美文网首页
Cocos Creator之访问节点和组件

Cocos Creator之访问节点和组件

作者: Lee_5566 | 来源:发表于2021-04-26 11:36 被阅读0次
    image.png

    获取自身节点

    在组件方法里访问 this.node 变量就可以获取自身节点:

    start: function () {
        var node = this.node;
    }
    
    获得自身节点上的其它组件

    获得同一个节点上的其它组件。

    使用函数getComponent,实例:

    start: function () {
        var label = this.getComponent(cc.Label);
        var text = this.name + 'started';
    
        // Change the text in Label Component
        label.string = text;
    }
    

    函数可以直接传入一个类名(对用户定义的组件而言,类名就是脚本的文件名,并且区分大小写。):

    var rotate = this.getComponent("SinRotate");
    

    对于每个节点。也有一个 getComponent 方法:

    cc.log(this.node.getComponent(cc.Label) === this.getComponent(cc.Label));  // true
    
    查找异常

    如果节点上找不到想要的组件,getComponent 返回 null。
    所以使用时候需要添加对应的判断:

       start: function () {
            var label = this.getComponent(cc.Label);
            if (label) {
                label.string = "Hello";
            }
            else {
                cc.error("Something wrong?");
            }
        }
    

    获得其它节点及其组件

    接下来学习下,如何访问其他的节点以及其组件。

    例如,一门自动瞄准玩家的大炮,就需要不断获取玩家的最新位置。

    Cocos Creator 提供了一些不同的方法来获得其它节点或组件。

    1. 利用属性检查器设置节点

    属性检查器 中设置需要的对象。

    以节点为例,这只需要在脚本中声明一个 type 为 cc.Node 的属性:

    // Cannon.js
    
    cc.Class({
        extends: cc.Component,
        properties: {
            // 声明 player 属性
            player: {
                default: null,
                type: cc.Node
            }
        }
    });
    

    代码的意思就是在properties 里面声明了一个 player 属性,默认值为 null,并且指定它的对象类型为 cc.Node。

    脚本编译之后,这个组件在属性检查器中看起来是这样的:


    image.png

    然后可以将层级管理器中的任意一个节点拖到这个 Player 控件:

    image.png

    这样 player 属性就会被设置成功,可以直接在脚本里访问 player:

    // Cannon.js
    
    cc.Class({
        extends: cc.Component,
        properties: {
            // 声明 player 属性
            player: {
                default: null,
                type: cc.Node
            }
        },
    
        start: function () {
            cc.log("The player is " + this.player.name);
        },
    
        // ...
    });
    
    2. 利用属性检查器设置组件

    基本方式和节点一样:

    // Cannon.js
    
    // 通过模块化方式获取脚本 “Player”
    var Player = require("Player");
    
    cc.Class({
        extends: cc.Component,
        properties: {
            // 声明 player 属性,直接声明为组件类型
            player: {
                default: null,
                type: Player
            }
        },
    
        start: function () {
            cc.log("The player is " + this.player.name);
        },
    
        // ...
    });
    

    修改代码中的类型为组件的类。

    然后将挂载了 Player.js 的 Player Node 拖拽到这个组件的 player 属性框中:

    image.png

    这样 player属性就相当于是这个节点上的 Player 脚本组件了,就不需要再自己手动调用 getComponent 来获取组件了。

    查找子节点

    顾名思义,基本有三个方式.

    1. 直接获取列表
    // CannonManager.js
    
    cc.Class({
        extends: cc.Component,
    
        start: function () {
            var cannons = this.node.children;
            // ...
        }
    });
    
    1. 使用 getChildByName
    this.node.getChildByName("Cannon 01");
    
    1. 如果子节点的层次较深,可以使用cc.find
    cc.find("Cannon 01/Barrel/SFX", this.node);
    

    注意:当 cc.find 只传入第一个参数时,将从场景根节点开始逐级查找。也就是全局名字查找

    image.png

    相关文章

      网友评论

          本文标题:Cocos Creator之访问节点和组件

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