Cocos Creator/Cocos 3D组件注解自动注入实现

这篇博客介绍了在CocosCreator/Cocos3D开发中如何避免使用find和getComponent等方法导致的问题。作者受Android开发的自动注入启发,利用TypeScript的注解和反射功能,创建了一个组件自动注入的类。通过定义如@inChild、@inPath等注解,可以在组件的onLoad阶段自动获取和设置节点及组件,简化了代码并提高了可维护性。
摘要由CSDN通过智能技术生成

Cocos Creator / Cocos 3D开发中,有时会遇到不得不通过find(“path”),或getComponent(ClassName)加载组件或节点的情况。比如脚本所在的节点是预制体需要获得外部节点,或者你想动态把脚本挂在节点上,又或者需要拖拽的property太多了难以维护。这时你把这些加载外部组件的代码写在逻辑层很容易出现资源什么时候获取值、顺序不明、污染主逻辑等问题。(和当年Android开发的findViewById如出一辙)。受到Android开发一些自动注入视图的注解库的启发,在研究了TypeScript注解与反射的特性后,写了一个组件自动注入的类。
首先你需要从cc命名空间中导入__internal,通过内部类__internal.$cocos.$core.$scene_graph.$base_node.Constructor<any>定义你需要注入的组件类型。然后定义下列注解

  • @inChild 子节点
  • @inPath 场景查找节点
  • @nodeComp 当前节点的组件
  • @pathComp 场景查找组件
  • @childComp 子节点查找组件
    这里只举例一个,childComp:
export function childComp(path: string, cr: __internal.$cocos.$core.$scene_graph.$base_node.Constructor<any>) {
    return (target: Object, pKey: string) => {
        let comProp = {
            propertyName: pKey;
            cr: cr;
            path: path;
        }
        objList(target, 'childComp').push(comProp);
    }
}

objList是在taget中创建一个childComp数组存储所有带有该注解的变量
然后对于你想使用注解的组件,继承一个你自定义的组件类
onLoad里面读取this中的childComp属性列表,然后getChildByName(path).getComponent(cr)取出组件,通过反射Reflect.set() 赋值给this。

其他注解就不写出来了,和上面一样的原理。
如果你的组件使用了onLoad,记得super.onLoad就行了

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值