Electron窗口最小化时监听事件唤起窗口

文章一共分为四部分

  • 需求分析

  • 实现过程

一、需求分析

昨天领导突然在群里发了一条消息@我,提了一个这样的需求

领导的需求:需要在最小化时监听用户扫码枪扫码唤起窗口

我看到这个消息后第一反应脑袋空空,因为以前没有做过这个功能,就暂时没有回复,想稍微先研究一下再回复

稍微想了一下,觉得是有可能实现的,其实就是首先在主进程监听扫码枪事件,如果有扫码枪事件就执行窗口最大化的事件就行了。

核心就两件事:

  • 监听扫码枪事件

  • 窗口最大化

二、实现过程

1、监听扫码枪事件

扫码枪原理其实就是模拟键盘输入的事件,就相当于我们用键盘输入一串这个数字,最后按了一个回车。

监听键盘事件的话会先输出一个一个的数字,最后会输出一个enter,这里需要监听的就是键盘的数字键和Enter键。

我记得Electron是支持注册快捷键的,然后查询了Electron文档快捷键部分,可以通过 globalShortcut.register进行注册快捷键的监听。

只需要监听这两个键就可以了

有一个问题就是:不确定窗口最小化后是否还可以监听到

所以先注册监听试试,看能不能窗口隐藏时仍然可以监听到

javascript 复制代码
// 注册Enter 快捷键监听器
globalShortcut.register('Return', () => {
     console.log('Enter键被按下')
})

经过测试是可以监听到的,但是有一个很严重的问题: 当注册快捷键以后在其他应用按了没有反应,在电脑中其他任何地方按都没有反应,相当于是Electron拦截了注册的快捷键,只能在你当前的应用中生效。这样肯定是不行的,得想办法处理一下。

其实只需要在隐藏窗口时快捷键生效,窗口打开后再取消注册快捷键,这样就不会影响其他应用了。

javascript 复制代码
// 取消注册所有快捷键
function unregister() {
    globalShortcut.unregisterAll()
}
// 窗口最大化时触发(取消注册所有快捷键)
win.on('maximize', () => {
    unregister()
})
// 窗口最小化时触发(注册监听快捷键)
win.on('minimize', () => {
    // 注册Enter 快捷键监听器
    globalShortcut.register('Return', () => {
        console.log('Enter键被按下')
    })
})
�

但是这样也会有一个问题,就是要想不影响其他应用就必须打开Electron窗口,最小化后还是会影响其他应用。关于这个解决办法暂时还没有想到,如何大家有什么好的办法请评论区回复一下,谢谢。

就先这样回复领导吧

2.窗口最大化

最后一步就比较简单了,既然快捷键已经生效了,那就直接在监听到对应快捷键的时候将窗口最大化就行了

Electron窗口最大化的方法是

scss 复制代码
win.maximize()

完整代码

javascript 复制代码
// 取消注册所有快捷键
function unregister() {
    globalShortcut.unregisterAll()
}
// 窗口最大化时触发(取消注册所有快捷键)
win.on('maximize', () => {
    unregister()
})
// 窗口最小化时触发(注册监听快捷键)
win.on('minimize', () => {
    // 注册Enter 快捷键监听器
    globalShortcut.register('Return', () => {
        // 判断当前窗口是否最小化
        if(win.isMinimized()) {
            win.maximize()  // 窗口最大化
        }
    })
})
相关推荐
MessiGo10 分钟前
Javascript 编程基础(5)面向对象 | 5.1、构造函数实例化对象
开发语言·javascript·原型模式
前端小白从0开始25 分钟前
Vue3项目实现WPS文件预览和内容回填功能
前端·javascript·vue.js·html5·wps·文档回填·文档在线预览
JohnYan44 分钟前
Bun技术评估 - 03 HTTP Server
javascript·后端·bun
开开心心就好1 小时前
高效Excel合并拆分软件
开发语言·javascript·c#·ocr·排序算法·excel·最小二乘法
難釋懷1 小时前
Vue解决开发环境 Ajax 跨域问题
前端·vue.js·ajax
特立独行的猫a1 小时前
Nuxt.js 中的路由配置详解
开发语言·前端·javascript·路由·nuxt·nuxtjs
中微子1 小时前
小白也能懂:JavaScript 原型链和隐藏类的奇妙世界
javascript
咸虾米1 小时前
在uniCloud云对象中定义dbJQL的便捷方法
前端·javascript
梨子同志1 小时前
JavaScript Proxy 和 Reflect
前端·javascript
海的诗篇_1 小时前
移除元素-JavaScript【算法学习day.04】
javascript·学习·算法