点击上方亿元程序员+关注和★星标
引言
哈喽大家好，最近笔者看到有小伙伴吐槽：
编辑器为什么没有快速隐藏显示组件的快捷键？？
好家伙，Creator都快4.0了，怎么能没有这样的功能？
于是笔者去文档翻了翻，还真没找到，小伙伴还提到隔壁Unity的就在菜单上：
功夫不负有心人，终于在菜单文件->快捷键->scene->toggle-active-selected-node中找到了快捷键h：
试了一下，的确可以用，但是好像有点小BUG，操作后，通过ctrl+z没办法撤回操作。
言归正传，本期带大家一起来看看，如何在Cocos游戏开发中，自定义快捷键实现显示/隐藏节点、调整节点的渲染层级。
如果对你或你的小伙伴有帮助，可以点赞和爱心和分享三连哦~
本文源工程可在文末获取，小伙伴们自行前往。
为什么要用快捷键？
在游戏开发中，我们拼UI的时候，经常由于大图片或者其他内容的遮挡，我们想要找到指定内容的时候比较困难。
所以我们需要先将部分内容隐藏，隐藏节点的常规操作就是通过鼠标选择节点，然后再移动鼠标到属性面板去反勾选那个小框框：
操作非常不流畅，调整节点的渲染层级也是如此，想要拖动到同级节点的上面/下面的时候，眼花很容易拖到子节点或者父节点那里去，让人抓狂。
所以啊，我们一起来看看实例。
上实例
1.创建插件
想要自定义快捷键，首先要创建我们的插件，通过菜单扩展->创建扩展打开扩展创建面板,选择一个空白模板进行创建。
2.定义快捷键
关于自定义快捷键，官方文档还是有比较详细的描述的：
我们在插件的package.json中定义下面三个消息以及三个快捷键：
- setActive(alt+shift+a):显示/隐藏节点。
- setSiblingIndex_up(alt+shift+=):节点向上移动一层。
- setSiblingIndex_down(alt+shift+-):节点向下移动一层。
3.实现setActive方法
首先我们在main.ts中，实现我们的setActive方法。
其中关键的步骤：
-
获取选择的节点： 通过
Editor.Selection.getSelected('node')获取当前选择的节点数组(可多选)。 -
查询节点信息： 通过
Editor.Message.request('scene', 'query-node', nodes[0])查询节点信息，注意这个不是我们开发时的cc.Node，获取是否隐藏可以通过node.active.value获取。 -
修改节点属性：通过
set-property消息修改。 -
记录undo数据：上面提到的官方的隐藏接口可能缺少这个，导致无法撤回。开始记录和结束记录要成对出现。
4.实现setSiblingIndex方法
我们把上移和下移的逻辑写到一起，通过offset传入上下移动的步数。
其中关键的步骤：
-
获取选择的节点： 同上。
-
查询节点信息： 同上上。
-
查询选择的节点的父节点信息： 通过
node.parent.value.uuid拿到父节点的uuid，再通过上面的方法获得父节点信息。 -
查询节点的层级：通过父节点信息
children数组找出节点的层级。 -
修改节点层级：
target是要调整位置的项的下标，offset是要调整的偏移。 -
记录undo数据：同上上上。
-
调用：上传
-1，下传1。
5.效果演示
隐藏/显示节点：
修改层级：
结语
以上就是今天的全部内容，小伙伴们可以自行扩展，如有不足还请指出。
我们常常说到不要重复造轮子，但是轮子都没有的话，只能拿起扳手了。
小伙伴们还有哪些想要实现的功能？
本文源工程可通过私信发送 Shortcut 获取。
我是"亿元程序员"，一位有着8年游戏行业经验的主程。在游戏开发中，希望能给到您帮助, 也希望通过您能帮助到大家。
AD:笔者线上的小游戏《打螺丝闯关》《贪吃蛇掌机经典》《重力迷宫球》《填色之旅》《方块掌机经典》大家可以自行点击搜索体验。
实不相瞒，想要个赞和爱心！请把该文章分享给你觉得有需要的其他小伙伴。谢谢！
推荐专栏：
点击下方灰色按钮+关注。
