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()  // 窗口最大化
        }
    })
})
相关推荐
一颗松鼠3 分钟前
JavaScript 闭包是什么?简单到看完就理解!
开发语言·前端·javascript·ecmascript
小远yyds23 分钟前
前端Web用户 token 持久化
开发语言·前端·javascript·vue.js
阿伟来咯~1 小时前
记录学习react的一些内容
javascript·学习·react.js
吕彬-前端1 小时前
使用vite+react+ts+Ant Design开发后台管理项目(五)
前端·javascript·react.js
学前端的小朱1 小时前
Redux的简介及其在React中的应用
前端·javascript·react.js·redux·store
guai_guai_guai1 小时前
uniapp
前端·javascript·vue.js·uni-app
也无晴也无风雨2 小时前
在JS中, 0 == [0] 吗
开发语言·javascript
bysking2 小时前
【前端-组件】定义行分组的表格表单实现-bysking
前端·react.js
王哲晓3 小时前
第三十章 章节练习商品列表组件封装
前端·javascript·vue.js
fg_4113 小时前
无网络安装ionic和运行
前端·npm