做了两个插件发现的焦点导航问题

Creator 2.x
#1

刚上手cocos creator插件一周左右,按照自己的工作流程,做了两个插件,一个用了codemirror做了一个自己编码习惯的内置IDE,就不用在vscode和creator之间来回切换,然后做了一个bmpfont的快捷编辑器,可以根据已有的fnt进行快速添加和调整

2019625-55321.jpg680×536 234 KB

2019625-55249.jpg678×537 99.2 KB

在这个过程中,发现了一个问题,就是creator中,比较暴力地监听了window的keydown事件,在我第一个插件中,需要用四个方向键进行位置微调,结果上下按键直接变成了页面上按钮的焦点跟踪,而且发现在页面上没有任何可以获取焦点的ui-kit组件时,控制台直接报错了.原因是代码中出现了null错误, 那么我就用document.keydown事件来覆盖了window.keydown的事件(阻止冒泡),那么问题就解决了.

在我写代码编辑器的时候发现,同样的问题出现了, window.keydown事件,在针对 keyCode == 9 时,直接阻止了冒泡,那么我编辑器的tab键完全没办法用来缩进了,我只好非常暴力地,在Editor的私有变量上进行注入才解决了:

 let o1 =  Editor.UI._FocusMgr._focusNext;
 let o2 =  Editor.UI._FocusMgr._focusPrev;
 Editor.UI._FocusMgr._focusNext = (...args)=>{ // 强行覆盖了tab
     if(!this.codeMirrorFocused) {o1(...args);return}
     CodeMirror.commands.indentMore(myCodeMirror);
  }
  Editor.UI._FocusMgr._focusPrev = (...args)=>{ // 强行覆盖了ctrl+tab
     if(!this.codeMirrorFocused) {o2(...args);return}
     CodeMirror.commands.indentLess(myCodeMirror)
  }

建议插件组的童鞋,可以给出一个灵活控制 keydown的方式,比如说 Editor.UI.foucsNavSwitch(true|false);让插件开发过程中可以自行处理.

另请问一下, 因为文档比较少,使用外部应用打开文件的方法是什么(相当于在asset列表中对一个js文件进行双击)? 在浏览器可以搜索出来的代码中找不到,你们的asar加密过了,解不开…

1赞
#2

对双击文件进行自定义,目前没有开放自定义操作,不过你这个需求也挺频繁的,我帮你@下 @jare @visualsj

至于keydown这个问题 @visualsj 可能有考虑,这个的确是细节上的体验操作

#3

我觉得,如果不是特别有洁癖的话,能不能考虑把每个IPC触发的上下文都通过IPC的参数传过来,比如双击这个动作,把event传过来就行了,因为毕竟在electron下,也没办法真的隐藏任何东西,用hack手段都能做.比如现在这个双击的需求,我直接
在html中找到asset的节点树,然后遍历一遍,拼出路径,然后放到一个map中,然后随时出发这个节点的事件.

如果能传上下文,其实很多隐藏的需求都可以预先覆盖到了,也可以实现很多自定义的骚操作.

1赞
#4

在控制台sources中分析找到 /app.asar/editor/builtin/assets/panel/component/node.js 中的一个方法,解决了问题
直接使用了 Editor.Ipc.sendToMain(“assets:open-text-file”, {{uuid}}); 用外部工具打开了文本文件

 onOpenAsset(e) {
                Editor.assetdb.queryInfoByUuid(e, (t, n) => {
                    switch (n.type) {
                        case "javascript":
                        case "coffeescript":
                        case "typescript":
                        case "markdown":
                        case "bitmap-font":
                        case "text":
                            Editor.Ipc.sendToMain("assets:open-text-file", e);
                            break;
                        case "scene":
                            Editor.Ipc.sendToMain("scene:open-by-uuid", e);
                            break;
                        case "sprite-frame":
                            Editor.Panel.open("sprite-editor", {
                                uuid: e
                            });
                            break;
                        case "texture":
                            Editor.Ipc.sendToMain("assets:open-texture-file", e);
                            break;
                        case "prefab":
                            Editor.Ipc.sendToAll("scene:enter-prefab-edit-mode", e);
                            break;
                        case "folder":
                            let t = i.queryNode(e);
                            o.fold(t.id, !t.fold)
                    }
                })
            }
        }
1赞