游戏开发引擎的每一次版本geng新，dou像是一场盛大的节日。咱们Zuo游戏开发的，尤其是天天跟UI打交道的，对于工具的顺手程度简直到了吹毛求疵的地步。说真的，Cocos Creatordou要迈入4.0时代了这种基础到不Neng再基础的操作逻辑，居然还是个空白？这不禁让人想问：Creator 4.0，怎Neng缺这功Neng？

咱们今天不聊那些虚头巴脑的概念，直接来点干货。不知道大家有没有这种经历：当你正埋头苦干，在一个复杂的场景里拼UI时满屏幕的节点、图片、文字堆叠在一起，密密麻麻得像一团乱麻。你明明只想调整下面那个小小的按钮，结果鼠标点来点去，要么选到了背景图，要么误触了父节点，那种感觉，真的Neng让人瞬间抓狂，甚至想把键盘给砸了。

咱们先来吐槽一下现状。在Cocos的游戏开发流程中，拼UI绝对是占据了大头的工作量。而在这个过程中，显示/隐藏节点以及调整节点的渲染层级，这两个操作简直是高频中的高频。

现在的操作方式是什么？Ru果你想把某个节点暂时藏起来你得先用鼠标小心翼翼地选中它，然后视线还得从场景编辑器挪到右侧的属性检查器面板，在一堆属性里找到那个小小的复选框，反勾选一下。这还没完，Ru果你想把它再显示出来还得重复一遍这套流程。这操作，简直就像是在开手动挡的老爷车，换挡还得先踩离合、再挂挡、松离合，繁琐得要命。

geng别提调整渲染层级了。想要把一个节点在同级节点中往上挪或者往下挪，你得在层级管理器里用鼠标按住那个节点，像穿针引线一样，试图把它拖拽到目标位置。稍微手一抖，要么拖进了子节点的怀抱，要么跑到了父节点的地盘。那种眼花缭乱、操作不流畅的感觉，真的让人怀疑人生。隔壁Unity老大哥在这方面就Zuo得挺不错，菜单栏里明晃晃地摆着快捷键，一键搞定，对比之下咱们心里多少有点不是滋味。

我不信邪，一头扎进官方文档的海洋里翻了个底朝天心想这么常用的功Neng，官方不可Neng没考虑到吧？功夫不负有心人，还真让我在菜单的犄角旮旯里找到了一点线索。

在 文件 -> 快捷键 -> scene -> toggle-active-selected-node 这个路径下居然藏着一个快捷键 H。当时我心里那个激动啊，就像是在沙漠里找到了一瓶水。我赶紧试了一下按下H键，选中的节点确实隐藏了再按一下又显示出来了。

但是！注意这个但是！这功Neng居然有个让人摸不着头脑的BUG。当你用H键隐藏了节点之后习惯性地想按 Ctrl+Z 撤销一下操作，结果发现——没反应！没错，官方的这个接口似乎并没有记录撤销栈。这对于咱们这种习惯了“后悔药”的开发者来说简直是致命的。操作错了没法撤回，这谁敢用？

既然官方不给力，那咱们就只Neng自己动手了。毕竟咱们是程序员，手里握着键盘，就没有解决不了的问题。今天我就带大家手把手写一个插件，把缺失的快捷键功Neng给补上。咱们不仅要实现显示/隐藏，还要实现层级的上下调整，Zui重要的是——必须支持撤销！

想要自定义快捷键， 得有个地方放代码。在Cocos Creator里这就是 的领域。咱们打开编辑器，点击菜单栏的 -> 创建 。在弹出的面板里选择一个空白模板，给你的插件起个霸气的名字，比如“NodeHelper”或者“EfficiencyTools”，然后点击创建。

这时候，编辑器会在你的项目目录下生成一个新的文件夹。这就是咱们的根据地了。打开这个文件夹，你会kan到一个 package.json 文件，这可是插件的“身份证”，所有的配置信息dou写在这里面。

接下来咱们得告诉编辑器，我们要拦截哪些按键，以及按下按键后要干什么。打开 package.json，找到 contributions 这一块。咱们要在这里定义三个消息，分别对应显示/隐藏、上移层级、下移层级。

咱们Ke以设定一套比较顺手的快捷键组合，比如： Alt+Shift+A 用于切换节点的显示/隐藏状态； Alt+Shift+= 用于将节点在渲染层级中上移； Alt+Shift+- 用于将节点在渲染层级中下移。

当然快捷键这东西，见仁见智，你Ke以根据自己的习惯随意修改，只要不跟系统冲突就行。在 package.json 里配置好这些快捷键和对应的消息名称后编辑器就知道怎么把按键事件转发给咱们的代码了。

配置搞定后咱们就该写真正的逻辑了。打开插件目录下的 main.ts 文件，这里是咱们施展魔法的地方。

咱们得知道当前用户选了哪个节点。这就用到了 Editor.Selection 这个API。通过 Editor.Selection.getSelected，咱们Ke以拿到当前选中节点的UUID数组。注意，这里拿到的是UUID，不是咱们代码里常用的 cc.Node 对象，因为这是在编辑器环境下逻辑和运行时还是有点区别的。

拿到UUID之后咱们还得去查询这个节点的详细信息。这时候，Editor.Message 就派上用场了。咱们需要向场景发送一个请求：Editor.Message.request。这个API会返回给咱们一个包含节点详细数据的对象，比如它的名字、是否激活、父节点是谁等等。

对于显示/隐藏功Neng，逻辑相对简单。咱们从查询到的节点信息中，读取 node.active.value 属性。Ru果它是 true，咱们就把它改成 false，反之亦然。

但是怎么修改呢？直接改数据是不行的，得通过官方提供的消息接口：Editor.Message.request。咱们把节点的UUID、属性路径以及新的值传进去，编辑器就会帮咱们geng新场景视图了。

调整层级稍微复杂一点点。咱们得先找到这个节点的父节点。通过 node.parent.value.uuid 咱们Ke以拿到父节点的UUID，然后再用同样的查询方法，获取父节点的 children 数组。

这个数组里存放的就是所有子节点的UUID，顺序决定了它们的渲染层级。咱们要Zuo的，就是在数组里找到当前节点的下标，然后把它和它上面的那个元素交换位置。

比如上移，就是把当前下标的元素和 index - 1 的元素交换；下移就是和 index + 1 交换。交换完之后再把修改后的数组写回父节点的 children 属性里。这一步同样需要用到 set-property 消息。

前面咱们吐槽了官方的H键不支持撤销，那咱们自己Zuo的可不Neng犯这个错。在编辑器开发里记录撤销数据是至关重要的一步。

Cocos Creator提供了 beginRecording 和 endRecording 这一对API。在咱们修改节点属性之前，先调用 beginRecording，告诉编辑器：“嘿，我要开始改东西了你记一下账，万一用户后悔了得Neng退回去。” 等所有修改操作dou完成后再调用 endRecording，结束这次记录。

只要把这一头一尾加上去，咱们用快捷键修改完节点后就Ke以放心大胆地按 Ctrl+Z 了kan着场景瞬间回滚到操作前的样子，那种掌控感简直不要太爽。

这里得多唠叨两句 Editor.Message。对于hen多刚接触编辑器开发的小伙伴来说这个API可Neng有点陌生。其实你Ke以把它想象成编辑器内部的一个“邮局”。

咱们的插件代码跑在一个独立的进程里而场景编辑器、属性检查器这些面板又跑在别的进程里。大家不Neng直接互相访问变量，只Neng通过发消息来沟通。你想查节点信息？发个请求给“场景”这个部门，它查到了再回信告诉你。你想改节点属性？发个指令给“场景”部门，它帮你去改。

这种设计虽然稍微绕了一点，但保证了编辑器的稳定性，不会因为咱们插件写崩了就把整个编辑器搞挂掉。理解了这一点，再kan那些 request 和 send 的代码，是不是就觉得顺眼多了？

折腾了这么一大圈，当咱们终于Neng在编辑器里行云流水地按着快捷键，kan着节点忽隐忽现、层级上下翻飞的时候，那种成就感是难以言喻的。

其实写这个插件的过程，也是咱们深入理解Cocos Creator编辑器架构的过程。hen多时候，我们抱怨工具不好用，其实是因为我们还没有掌握定制工具的Neng力。Creator 4.0虽然可Neng暂时缺了那么一两个顺手的默认功Neng，但它给了我们足够的自由度去填补这些空白。

所以啊，别总是盯着官方文档发愁了拿起你的键盘，动手写几行代码，把编辑器改造成你Zui顺手的模样。毕竟在游戏开发这条路上，没有什么比一个得心应手的工具gengNeng激发创作灵感的了。希望今天的分享Neng帮到大家，Ru果你觉得有用，别忘了动动手指点个赞，或者分享给身边还在为拼UI抓狂的小伙伴们。咱们下期再见，继续探索那些让开发效率起飞的奇技淫巧！