鸿蒙 PC Markdown 编辑器桌面效率:查找面板焦点与快捷键路由

📅 2026/7/19 15:24:06 ✍️ 编辑团队 👁️ 阅读次数
鸿蒙 PC Markdown 编辑器桌面效率:查找面板焦点与快捷键路由
鸿蒙 PC Markdown 编辑器桌面效率查找面板焦点与快捷键路由PC适配不是把手机页面拉宽。用户按 CtrlF后会立即输入查询按 CtrlS期待保存当前标签按 CtrlO期待系统选择器如果焦点仍在 CodeMirror字母会写进正文。混合 ArkUI与 ArkWeb应用还可能两边同时处理快捷键导致一次按键触发两次命令。本文基于 OhMarkdown分析 Web键盘监听、原生命令路由、搜索面板挂载后聚焦、默认行为阻止和跨平台 Ctrl/Command兼容。代码位于 https://gitcode.com/VON-/codex_md_oh对应提交3a9146e。快捷键入口靠近编辑焦点用户大部分时间焦点在 ArkWeb CodeMirror因此 Web层监听window.addEventListener(keydown,(event){if(!(event.ctrlKey||event.metaKey)||event.altKey){return;}constkeyevent.key.toLowerCase();if(keys||keyo||keyf){event.preventDefault();window.OhMarkdownEditor?.requestCommand(keys?save:keyo?open:find);}});Ctrl适配常规 PC键盘meta为将来平台键位兼容Alt组合直接排除避免与系统/输入法快捷键冲突。key转小写兼容 Shift状态。只拦截已实现的 S、O、F。其他 Ctrl组合继续交给 CodeMirror如复制、粘贴、撤销。全局监听不能无条件 preventDefault否则会破坏编辑器内建键盘能力。preventDefault 是数据安全浏览器默认 CtrlF可能打开 ArkWeb自身查找CtrlS可能触发网页保存CtrlO可能打开浏览器文件行为。应用有原生面板和 Core File Kit流程必须阻止默认动作。阻止发生在确认 key属于白名单之后。调用 requestCommand前完成避免异步 Bridge期间浏览器默认行为仍执行。若编辑器 API未初始化可选链不会抛错但默认已被阻止页面 ready测试应保证正常入口存在。Web 命令先刷新状态requestCommand:(command){flushToNative();if(commandsave){flushRecoverySnapshot();pendingSaveDocumenteditor.state.doc;}constcontentcommandsave?editor.state.sliceDoc():;window.ohMarkdownBridge?.onCommand(command,content);}快捷键不是只发送字符串。先刷新延迟的 dirty与字数保存还立即写恢复快照并固定保存基线 Text向原生携带当前全文。这样 CtrlS不会因为 Bridge防抖遗漏最后几个字符。Open和 Find不传正文减少跨边界数据。新建命令同理。命令协议限制为联合类型Web不能请求任意原生方法。原生层统一分发privateonEditorCommand(command:string,content:string):void{if(commandsave){if(this.documentDirty||this.documentUri.length0){this.documentContentcontent;}this.syncActiveDocumentSession(this.documentContent);this.saveDocument(this.documentRevision);}elseif(commandopen){this.requestOpenDocument();}elseif(commandnew){this.requestCreateDocument();}elseif(commandfind){this.openSearchPanel();}}文件选择器、保存和 ArkUI面板都留在原生层。Web不直接调用系统 API。工具栏按钮也走相同 request方法鼠标和键盘共享业务路径避免两个保存实现。未知 command没有动作。更严格版本可用枚举和运行时白名单记录协议错误但不能动态执行方法名。CtrlF 的关键是下一个按键打开搜索面板privateopenSearchPanel():void{this.activePanelsearch;this.sidebarOpentrue;setTimeout((){focusControl.requestFocus(search-query-input);},100);}设置状态后 ArkUI需要一轮渲染输入框才挂载。同步 requestFocus可能找不到目标因此短延迟后聚焦。真正验收不是“面板出现”而是按 CtrlF后直接输入alpha文字进入查询框而非正文。固定100毫秒是务实方案仍有设备调度差异。更稳定方式是输入组件 onAppear后请求焦点或用框架布局完成回调后续应减少时间猜测。输入框声明稳定 idTextInput({placeholder:$r(app.string.search_query_placeholder),text:this.searchQuery}).id(search-query-input).onChange((value:string){this.searchQueryvalue;this.searchMatchCount0;}).onSubmit(()this.executeSearch())id是 focusControl目标。onSubmit让回车执行下一个匹配查询改变后清零旧计数避免面板显示与新字符串不符。向前、向后按钮保留独立命令。键盘 Enter/ShiftEnter的完整语义仍可增强当前回车为正向查找。面板已经打开时也要重新聚焦活动栏点击 search或 CtrlF可能在面板已显示时发生。选择面板逻辑再次延迟聚焦if(panelsearch){setTimeout((){focusControl.requestFocus(search-query-input);},100);}用户在编辑器继续输入后再次 CtrlF焦点应回到现有查询框不需要先关闭面板。面板可见状态与焦点状态是两个维度。文件操作期间的快捷键saveDocument和openDocument检查operationInProgress。系统选择器打开或保存进行中再按快捷键不会启动第二笔操作。防止两个选择器叠加和活动会话被异步返回覆盖。当前被拒命令没有声音或显式提示状态栏保持进行中。后续可对重复保存合并最新 revision而不是简单忽略但要确保保存完成后新输入仍脏。焦点返回编辑器查找选中匹配后editor.dispatch({selection:{anchor:match.from,head:match.to},effects:EditorView.scrollIntoView(match.from,{y:center})});editor.focus();用户执行查找后编辑器获得焦点可复制或替换当前结果。与此同时若用户继续在查询框输入ArkUI仍持有焦点。当前面板按钮调用 Web后会把焦点转到编辑器这是一项明确交互选择成熟产品可让 F3定位但查询框保持输入焦点需用户测试决定。切换源码/分栏后也在下一动画帧 focus编辑器避免布局变化时聚焦失败。纯预览模式没有可编辑焦点。中文输入法不能被快捷键干扰输入法组合期间event.isComposing可用于避免把组合键误识别为命令。当前监听只处理带 Ctrl/meta的 S/O/F正常中文候选输入不会带控制键仍应在真实中文输入法下测试 Ctrl组合是否先提交候选。不要监听普通字母作为单键命令编辑器核心场景就是文本输入。全局快捷键还应避开 AltGr和系统输入法切换所以显式排除 altKey。鸿蒙 PC 搜索焦点界面下图来自 MateBook Pro 2in1模拟器左侧搜索面板与 CodeMirror同屏。CtrlF打开后查询框可直接输入匹配计数与编辑器选区联动。模拟器验证还包括 CtrlS、CtrlO和中文输入法。自动化通过键盘事件触发 Ctrl/MetaF应该断言document.activeElement或 ArkUI焦点目标跨 ArkUI/ArkWeb焦点最终仍需设备行为。快捷键映射的扩展下一批桌面命令包括新建、关闭标签、切换标签、撤销重做、源码/分栏/预览模式和命令面板。应建立中央命令注册表包含 id、默认快捷键、可用条件和执行函数ArkUI菜单、工具栏、Web事件都调用同一命令。但不要过早引入大型命令框架。当前四个命令用联合类型和分发函数足够。出现用户自定义快捷键、菜单展示和冲突检测需求时再提取抽象。可访问性与状态搜索箭头、活动栏图标和关闭按钮使用系统 symbol并提供 accessibilityText。焦点必须有可见样式键盘用户能判断当前在查询框、按钮还是正文。Toggle使用真实开关语义不用文字颜色假装状态。快捷键不应只写在界面说明文字中菜单项可在系统支持时显示组合键。用户要求文章技术型应用界面本身不需要堆叠教程。当前边界标签切换与关闭快捷键未完成固定100毫秒聚焦仍有时序假设没有快捷键自定义和冲突管理ArkUI侧焦点时的 CtrlS/O/F全局路由需要更全面覆盖输入法组合状态尚未显式判断。核心路径已经保证编辑焦点下 CtrlS/O/F进入原生命令并且 CtrlF后可立即输入。后续扩展应保持单一命令语义不让 Web和原生各自执行一遍。结语桌面快捷键是跨运行时焦点系统。OhMarkdown在最接近 CodeMirror焦点的 Web层识别组合键阻止浏览器默认行为刷新编辑状态后通过窄 Bridge交给 ArkTS原生负责文件和面板ArkUI挂载后再把焦点送到查询框。PC体验的衡量标准不是有没有 CtrlF图标而是用户按键后下一串字符是否到达正确位置、命令是否只执行一次、失败是否保留正文。把这些细节做实鸿蒙 PC编辑器才真正适合键盘主导的持续工作。