正文 3143字数 227,302阅读

electron开发问题记录

1. 如何开启debugger
win.webContents.openDevTools()
Run code
Cut to clipboard


    2. 如何加载网页
    win.loadURL("http://www.baidu.com")
    Run code
    Cut to clipboard


      3. 报错：ERROR:gpu_init.cc(481)] Passthrough is not supported, GL is disabled, ANGLE is
      在main.js中禁用
      const { app, BrowserWindow, ipcMain } = require('electron') // 禁用当前应用程序的硬件加速 app.disableHardwareAcceleration()
      Run code
      Cut to clipboard


        4. 隐藏标题栏后，如何实现窗口拖动
        在要拖动html元素上，加上样式：
        -webkit-app-region: drag
        Run code
        Cut to clipboard
          即可，通过样式：
          -webkit-app-region: no-drag
          Run code
          Cut to clipboard
            来控制哪些元素不拖动

            <div style="-webkit-app-region: drag"> <div style="-webkit-app-region: no-drag"></div> </div>
            Run code
            Cut to clipboard


              4. Electron官方中文文档地址
              快速入门|Electron

              实现全屏fullscreen

              mainWindow = new BrowserWindow({ //... fullscreenable:true, fullscreen: true, simpleFullscreen:true, });
              Run code
              Cut to clipboard

                simpleFullscreen是fullscreen的一个特殊形态，简单全屏是不按套路出牌的
                fullscreen是按套路出牌的
                那么fullscreenable属性，可以控制fullscreen: true属性，
                还可以控制setFullScreen(true)函数
                electron实现全屏fullscreen

                菜单栏隐藏

                1.Windows隐藏方法
                const {electron,Menu,debug} = require('electron'); Menu.setApplicationMenu(null)
                Run code
                Cut to clipboard

                  2.macOs的菜单隐藏方法
                  app.dock.hide();到目前为止 只发现这一种处理方式
                  Run code
                  Cut to clipboard

                    it's an os x only method (documentation)

                    关闭最小化

                    问题描述 我想开发一个类似win7自带的桌面挂件，例如雨滴桌面的那种，但是win+D(或者右下角的返回桌面)会导致其最小化。 问题出现的环境背景及自己尝试过哪些方法 我试过官方的文档里minimizable 只是没有最小化按钮，我试了下右下角的返回桌面或者win+D，都会导致程序最小化。之后有人提醒我，如果检测到最小化再自动还原窗口效果如何？我自己也试了一下 mainWindow.on('minimize', () => { console.log('最小化') mainWindow.restore() mainWindow.moveTop() }) 结果却很有趣，，如果点击最小化按钮，会消失立刻又弹出来，有过程动画，勉强算是达到效果。但是如果通过返回桌面或win+D的话，会导致最小化，不再显示。但是发现了有趣的事，如果我点击任务栏的其他窗口，想让其显示，比如win+D后我点qq聊点窗口，这时候聊天窗口和electron程序一起出现了，控制台报了两次最小化.......... 之后我又进行尝试，发现窗口属性如果minimizable: false,alwaysOnTop: true同时存在的话(只存在其中一个达不到效果)，达到了预期效果，并且没有过程动画，很满意。但是，这东西肯定不能一直置顶啊，要类似于嵌在壁纸里的效果，所以还是不行。 我实在是没思路了，要不可不可以像c++一样，设定父窗口为系统桌面呢？
                    Run code
                    Cut to clipboard


                      保持单实例启动
                      Run code
                      Cut to clipboard


                        electron应用是如何保持单实例启动的
                        最近在解决一个同一工程发布为多个客户端的问题时，涉及到了electron单实例启动的原理，抛开electron启动的一系列生命周期，那么electron应用是靠什么来确定启动时始终只有一个单实例的

                        首先在主进程app.ready事件之前调用app.requestSingleInstanceLock()方法
                        electron会自动检测是否启动了多个实例，返回一个布尔值；
                        如果为true，则调用app.quit()，应用退出。

                        electron 如何实现单实例？两种方案解决单实例问题

                        限制electron应用只能启动一次
                        const gotTheLock = app.requestSingleInstanceLock() if (!gotTheLock) { app.quit() }
                        Run code
                        Cut to clipboard


                          禁用Windows键

                          node.js - 在Electron中禁用Windows键
                          我正在制作一个 Electron 桌面应用程序。我想在应用程序打开时禁用Windows键和功能键

                          我尝试使用以下代码...它注册了事件，但Windows菜单仍然打开
                          $(document).keydown(function(e){ if (e.keyCode == 37) { alert( "windows key pressed" ); return false; } });
                          Run code
                          Cut to clipboard


                            您可以尝试这样做，但不幸的是，它将成为全局快捷方式，这意味着当窗口没有焦点时，
                            它仍会被注册。尝试放入console.log()看看它何时触发。 win是 Electron 窗口变量

                            const {app, globalShortcut} = require('electron'); win = new BrowserWindow(); globalShortcut.register('Super', () => { if (win.isFocused()) { // do something } });
                            Run code
                            Cut to clipboard


                              可以在此处查看文档:docs

                              或尝试在此处使用此模块:electron-localshortcut
                              electronLocalshortcut.register(win, 'Super', () => { console.log('Windows Button pressed'); return false; });
                              Run code
                              Cut to clipboard