开发工具桌面应用【免费下载链接】desktopFork of GitHub Desktop to support various Linux distributions项目地址https://gitcode.com/gh_mirrors/des/desktop点击查看免费下载导读GitHub Desktop本仓库为面向各 Linux 发行版的 fork在弹出式对话框Dialog中大量使用确定/取消型按钮组。由于 Windows 与 macOS 对标准操作按钮的排列约定截然相反且危险操作对默认按钮的安全要求极高本项目在 docs/technical/button-order.md 中明确了自身的平台适配策略并通过OkCancelButtonGroup组件在源码层面落地。阅读本文后你将理解 GitHub Desktop 如何在 Windows 与 macOS 上分别排列确定/取消按钮、如何让破坏性对话框的默认按钮始终指向最安全的操作以及键盘焦点Tab 导航、回车提交与按钮顺序之间的耦合关系——这些经验可直接迁移到任意跨平台桌面应用的对话框设计中。平台差异Windows 与 macOS 的按钮顺序约定对话框按钮的排列顺序是桌面平台肌肉记忆的一部分。Windows 与 macOS 对此采用了完全相反的约定Windows肯定动作Affirmative如 Ok位于左侧取消按钮位于右侧典型顺序为Ok, CancelmacOS恰好相反取消按钮在左、肯定动作在右典型顺序为Cancel, Ok。这两种顺序分别对应微软 Windows UX 指南与苹果 macOS 人机界面指南HIG中关于对话框提交按钮的规定。项目认为用户在快速应对对话框时往往依赖肌肉记忆因此在绝大多数情况下严格遵循平台惯例是 GitHub Desktop 的明确设计立场。文档同时给出了一个通俗的总结用户期望按键位置符合自己所在平台的习惯而不是让应用自行发挥。破坏性操作的默认按钮原则无论是 Windows 还是 macOS 的指南都特别强调一点当对话框对应的动作是危险或破坏性的如删除分支、移除仓库时默认按钮Default Button必须是最安全的选择。具体来说在 GitHub Desktop 中默认且初始选中的按钮永远不应是执行破坏性动作的那个按钮唯一例外是用户已经显式地用 Tab 把焦点移动到破坏性按钮上然后按下Return/Enter。此时大多数用户的预期是回车执行焦点所在按钮的动作因此项目允许回车触发破坏性动作以避免混淆。这套逻辑在源码中有完整实现见下一节。源码实现OkCancelButtonGroup组件按钮顺序与默认按钮的决策被封装在独立的组件中路径为 app/src/ui/dialog/ok-cancel-button-group.tsx。该组件的设计目标正如其注释所述消除开发者在不同平台该把按钮放哪边的决策过程同时负责根据用户回答是否为破坏性动作来选择正确的默认按钮。平台判断与按钮渲染顺序组件在渲染按钮时使用编译期常量__DARWIN__判断当前平台这与 Electron 主进程/渲染进程的构建注入机制配合见 app/src/ui/install-globals.ts 相关的全局定义private renderButtons() { // See https://www.nngroup.com/articles/ok-cancel-or-cancel-ok/ if (__DARWIN__) { return ( {this.renderCancelButton()} {this.renderOkButton()} / ) } else { return ( {this.renderOkButton()} {this.renderCancelButton()} / ) } }即macOS 上先渲染 Cancel 再渲染 Ok视觉顺序Cancel, Ok其余平台Windows、Linux先渲染 Ok 再渲染 Cancel视觉顺序Ok, Cancel。本仓库作为面向 Linux 发行版的 fork在 Linux 上遵循的是与 Windows 一致的Ok, Cancel顺序。destructive属性与默认按钮的翻转OkCancelButtonGroup的核心接口属性是destructive默认为false。文档对破坏性对话框给出的定义是如果用户以肯定方式Ok作答后续动作将是危险且/或难以恢复的。关键在于Web/Electron 环境中默认按钮由表单的submit类型按钮决定——按回车会触发表单提交。为了让默认按钮指向最安全的选择组件在destructive true时做了两件对称的事private renderOkButton() { return ( Button type{this.props.destructive true ? button : submit} ... ) } private renderCancelButton() { return ( Button type{this.props.destructive true ? submit : reset} ... ) }非破坏性对话框Ok 是submit按钮默认按钮回车触发 OkCancel 是reset按钮破坏性对话框翻转——Cancel 变成submit按钮成为默认按钮回车触发的是取消Ok 降级为普通button类型。事件翻转submit/reset 与 Ok/Cancel 的语义映射翻转按钮类型后还有一个关键细节Dialog组件始终把表单的submit事件理解为肯定/Ok动作把表单的reset事件理解为取消动作见 app/src/ui/dialog/dialog.tsx 中的form onSubmit{this.onSubmit} onReset{this.onDismiss}。因此按钮组在破坏性模式下必须手动把点 Cancel重映射为提交事件、把点 Ok重映射为重置事件private onOkButtonClick (event: React.MouseEventHTMLButtonElement) { if (this.props.onOkButtonClick ! undefined) { this.props.onOkButtonClick(event) } if (event.defaultPrevented) { return } // 破坏性模式下Ok 是普通按钮点击时手动触发表单 submit // 让 Dialog 仍然把它当作肯定动作处理 if (this.props.destructive true) { event.preventDefault() if (event.currentTarget.form) { event.currentTarget.form.dispatchEvent(new Event(submit)) } } }onCancelButtonClick的逻辑与之对称破坏性模式下点击 Cancel 时preventDefault()并手动dispatchEvent(new Event(reset))从而触发 Dialog 的onDismissed。这样设计的好处是无论按钮类型如何翻转Dialog 层的事件语义始终不变把非破坏性对话框改造为破坏性对话框只需要在按钮组上设置destructive属性即可这正是文档中所说的converting a previously non-destructive dialog to a destructive one is as simple as setting the prop。其余可定制接口IOkCancelButtonGroupProps还提供了丰富的定制点便于在不同对话框复用属性作用默认值okButtonText/cancelButtonText自定义按钮文本字符串或 JSXOk/CancelokButtonTitle/cancelButtonTitle按钮 tooltip无okButtonDisabled/cancelButtonDisabled按钮禁用状态falseonOkButtonClick/onCancelButtonClick覆盖按钮点击事件需自行阻止默认行为无cancelButtonVisible是否渲染 Cancel 按钮供DefaultDialogFooter复用布局trueokButtonAriaDescribedByOk 按钮的无障碍描述引用无其中cancelButtonVisible{false}被单按钮页脚组件 app/src/ui/dialog/default-dialog-footer.tsx 使用——它将 Ok 按钮文本替换为Close并隐藏 Cancel从而复用整套按钮组布局。焦点管理初始焦点永远不会落在破坏性按钮上按钮顺序只是布局层面真正保障回车不会误触破坏性动作的是Dialog组件的focusFirstSuitableChild()方法app/src/ui/dialog/dialog.tsx。该方法的动机注释直接引用了 macOS HIG 的原文用户有时只是为了关掉对话框而按 Return根本没读内容所以默认按钮必须触发无害动作……当对话框可能导致破坏性动作时应把 Cancel 设为默认按钮。该方法的焦点候选优先级依次是带DialogPreferredFocusClassName类名的元素显式指定首选聚焦目标最小的正tabIndex元素模拟第一次按 Tab 会先到哪的顺序第一个可键盘聚焦隐式可聚焦或tabIndex0的元素如文本输入框、TabBar第一个submit按钮——组件用它作为 macOS HIG 中默认按钮的代理实现其余任意按钮对话框关闭按钮。由于破坏性对话框中submit类型按钮是 Cancel见上文翻转逻辑这条优先级链保证了打开对话框时焦点默认落在最安全的选择上而当用户显式按 Tab 遍历到破坏性按钮后回车表单提交又会按上文的事件翻转规则正确触发对应动作——这正是文档中唯一例外的实现基础。实战示例GitHub Desktop 中的破坏性对话框仓库中有大量destructive{true}的实际用例以下是两个典型代表。丢弃更改确认Discard Changesapp/src/ui/discard-changes/discard-changes-dialog.tsx 使用typewarning、rolealertdialog的 Dialog页脚为DialogFooter OkCancelButtonGroup destructive{true} okButtonText{this.getOkButtonLabel()} // Discard changes / Discard all changes okButtonDisabled{isDiscardingChanges} cancelButtonDisabled{isDiscardingChanges} / /DialogFooter在该对话框中OkDiscard Changes是破坏性动作因此它不会成为默认按钮初始焦点与回车触发都指向 Cancel只有用户显式选择后才执行丢弃。删除分支确认Delete Branchapp/src/ui/delete-branch/delete-branch-dialog.tsx 同样使用警告型alertdialog页脚为DialogFooter OkCancelButtonGroup destructive{true} okButtonTextDelete / /DialogFooter对话框正文明确提示 This action cannot be undone.该操作无法撤销按钮组则将默认按钮交给 Cancel防止用户回车误删分支。同一模式还广泛出现在删除远程分支、删除标签、移除仓库app/src/ui/remove-repository/confirm-remove-repository.tsx、重置前警告、强制推送确认等场景中可搜索app/src/ui下所有使用destructive属性的对话框。布局与样式按钮组的视觉布局由 SCSS 控制。在 app/styles/ui/_dialog.scss 中.dialog-footer内的.button-group使用flex-direction: row并靠右对齐justify-content: flex-end每个按钮min-width: 120px、按钮之间以--spacing-half间隔末按钮去除右边距。渲染顺序由组件按平台决定样式层不区分平台保持了逻辑与表现分离的整洁结构。与 Dialog 体系的关系按钮顺序只是 GitHub Desktop 对话框体系的一个环节。整体结构在 docs/technical/dialogs.md 中有系统阐述Dialog组件基于原生dialog元素构建模态框典型布局为标题DialogHeader、内容DialogContent与页脚DialogFooter或单按钮的DefaultDialogFooter页脚中放置OkCancelButtonGroup。关于OkCancelButtonGroup的按钮顺序与破坏性默认按钮的进一步讨论正是本文docs/technical/button-order.md所承载的内容二者配合阅读可以完整理解 GitHub Desktop 从平台惯例到组件实现再到具体对话框的全链路设计。小结总结 GitHub Desktop 的按钮设计要点顺序跟随平台macOS 为Cancel, OkWindows 与 Linux 为Ok, Cancel由OkCancelButtonGroup统一封装安全优先破坏性对话框中默认按钮回车触发必须是 Cancel 等安全选项初始焦点也绝不落在破坏性按钮上事件语义解耦通过submit/reset类型翻转与手动事件分发Dialog 层始终把 submit 当肯定、reset 当取消使对话框的破坏性改造成本降到最低仅设一个属性唯一例外用户显式 Tab 到破坏性按钮后回车尊重回车执行焦点按钮的用户预期。这套兼顾平台惯例、操作安全与键盘可达性的模式为跨平台桌面应用的对话框设计提供了可复制的参考范式。赞分享开发工具桌面应用【免费下载链接】desktopFork of GitHub Desktop to support various Linux distributions项目地址https://gitcode.com/gh_mirrors/des/desktop点击查看免费下载相关推荐GitHub Desktop 对话框按钮顺序规范跨平台按钮排序与破坏性操作安全设计指南GitHub Desktop 对话框按钮顺序规范跨平台按钮排序与破坏性操作安全设计指南 导读 GitHub Desktop 在跨 Windows 与 macO桌面应用版本控制开发工具FXLabel性能优化指南如何避免常见的渲染效率问题FXLabel性能优化指南如何避免常见的渲染效率问题 FXLabel作为一款功能丰富的iOS标签组件在提供多样化文本效果的同时也面临着渲染性能的挑战。本文UI库/组件移动开发高级配置指南深度解析开源Switch模拟器yuzu的核心优化技巧高级配置指南深度解析开源Switch模拟器yuzu的核心优化技巧 作为目前最先进的开源任天堂Switch模拟器yuzu让技术爱好者在Windows、Linu虚拟化桌面应用图形学上一篇RPCS3 2025 版从源码到跑通 PS3 游戏30 分钟手把手配置指南下一篇Cordova Android构建系统完全手册Gradle配置与自定义构建创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
企业数字化 ERP 产品动态
相关推荐
8万张图245类垃圾分类数据集:TensorFlow图像分类完整实战 简介:面向垃圾分类图像识别任务,这套资料包含八万张图片、二百四十五个类别的数据集,同时提供可直接运行的深度学习训练代码,下载后即可用于模型训练与评估,适合深度学习初学者、参加算法竞赛的学生,以及需… · 2026/9/27 23:38:08
新手入门gzip压缩网站:3个配置坑让加载快50% 新手入门gzip压缩网站:3个配置坑让加载快50% 改个需求建站公司拖一周,这种经历在行业里太常见了。很多刚入行的前端或运营新手,面对这种低效沟通往往感到无力。其实,除了沟通技巧,技术层面的优化才是硬道理。今天咱们聊的 gzip压缩网站… · 2026/9/28 0:19:04
3步搞定wordpress中文博客模板下载,告别等待的完整流程 3步搞定wordpress中文博客模板下载,告别等待的完整流程 改个需求建站公司拖一周,这种憋屈感谁懂?我做过10年建站,见过太多老板花几万块定制,结果改个颜色都要排队。其实想要个漂亮的中文博客,根本不用找外包。WordPress中文博客模… · 2026/9/28 0:18:10
2026最新网站查询访问域名避坑指南 2026最新网站查询访问域名避坑指南 备案流程一头雾水?别慌。很多新手刚接手网站项目,对着工信部备案系统发呆,分不清域名解析、服务器绑定和访问验证的区别,更不知道2026最新政策对“网站查询访问域名”有哪些硬性要求。… · 2026/9/28 0:17:58
娱乐彩票网站建设制作避坑指南:模板vs定制实战对比 娱乐彩票网站建设制作避坑指南:模板vs定制实战对比 别信那些“一键生成”的鬼话。上周一个客户拿着某知名模板站找我改,首页加载慢了8秒,后台数据全乱,看着就廉价。做娱乐彩票这类高敏感、高并发站点, 模板网站太丑不够用… · 2026/9/28 0:17:46
拒绝拖稿!《奖励自己的网站》性能优化报价单揭秘 拒绝拖稿!《奖励自己的网站》性能优化报价单揭秘 改个需求建站公司拖一周,这大概是无数甲方和开发者最崩溃的瞬间。你只是想把首页那张图换个颜色,或者加个“立即购买”按钮,结果对方让你等,一等就是7天。等你急了去催,得到的回复往往是“测试环境还在… · 2026/9/28 0:17:33
网站管理建设的总结:源码下载后如何搞定服务器与证书 网站管理建设的总结:源码下载后如何搞定服务器与证书 域名服务器搞不懂,是不是让你建站时心里没底?很多新手拿到【源码下载】包,解压后一脸茫然:这代码往哪放?服务器怎么连?HTTPS证书怎么搞?别慌,这就是典型的“有代码无环境”困境。… · 2026/9/28 0:17:33
MATLAB雷达信号脉冲压缩仿真:LFM线性调频、匹配滤波与距离分辨率实现 简介:这套Matlab仿真工具完整呈现雷达信号脉冲压缩过程,从线性调频(LFM)信号生成、目标回波仿真到匹配滤波压缩处理均有可运行代码支撑,面向电子信息工程、计算机、数学等专业学生,适用于课程设计、期末大作… · 2026/9/27 0:00:01
汕头网站建设制作厂家避坑指南:5大注意事项救急 汕头网站建设制作厂家避坑指南:5大注意事项救急 改个需求建站公司拖一周,这种憋屈事我见得太多了。 很多汕头老板找本地建站团队,签合同前看着方案挺美,一上线就变脸。 今天不聊虚的,直接拆解找 汕头网站建设制作厂家 时的5个核心 注意事项… · 2026/9/27 0:00:01
多模态虚假新闻检测实战:BERT+ResNet双塔与对比学习 简介:基于PyTorch的多模态虚假新闻检测项目完整代码包,面向自然语言处理与计算机视觉交叉方向的开发者、科研人员及毕业设计选题者,解决社交媒体中文本与图像联合识别虚假新闻的问题。系统以BERT预训练模型提取文本语义特征,以Res… · 2026/9/27 0:00:01
制作网页比较方便的软件怎么选?一文搞懂避坑指南 制作网页比较方便的软件怎么选?一文搞懂避坑指南 很多老板一上来就问:做个网站多少钱?但我反问他:你的域名买了吗?服务器租了吗?他一脸懵。这就是典型的“域名服务器搞不懂”。别急,今天咱们不聊虚的,直接 一文搞懂 那些让你头秃的技术名词。… · 2026/9/28 0:00:06
婚恋网站实战案例:避开3个高价坑,省钱50%还能跑赢流量 婚恋网站实战案例:避开3个高价坑,省钱50%还能跑赢流量 找婚恋网站建站公司,最怕的就是被坑高价。很多同行跟我吐槽,报价单上写得模棱两可,功能栏里全是“高级定制”、“专属UI”,结果落地全是套壳。今天不聊虚的,直接甩几个我经手的 实战案例… · 2026/9/28 0:00:19
济南做网站多少钱:3个案例拆解,防黑源码下载全攻略 济南做网站多少钱:3个案例拆解,防黑源码下载全攻略 上周济南一个做建材的老板找我,脸都绿了。他的官网首页弹出了赌博广告,后台被植入了挖矿脚本。他慌得问我:“网站被黑挂马不知道怎么办?能不能直接找之前的外包公司要源码下载,看看哪里被动了手脚?… · 2026/9/28 0:00:25