Question

如何捕捉在 Electron 应用程序中单击应用程序窗口关闭按钮的事件

2015-10-01

49789

javascript electron

我希望在电子应用中单击应用程序窗口的关闭按钮的事件。

我正在尝试为Mac OSX开发电子应用。我想隐藏应用程序窗口，而不是像其他Mac应用一样单击窗口的关闭按钮时终止应用程序。

但是，我无法检测到该系统是否应终止或应该隐藏，因为无论如何，当单击关闭按钮时， browser-window 的 关闭 事件被称为 CMD+Q 。

是否有任何方法可以捕获单击Electron App中的App Window的关闭按钮的事件？

谢谢您的帮助。

Postscript

要检测单击关闭按钮的事件，我尝试了此代码

633172009

当单击应用程序窗口的关闭按钮时，代码，该应用程序被隐藏，并且当键入 cmd+q 时终止应用程序。但是，当我尝试关闭操作系统时，会阻止关闭事件。

Answer 1

您可以使用 browser-window api 的 close 事件来捕获它。您可以尝试以下操作来验证这一点...

var app = require('app');

var force_quit = false;

app.on('ready', function () {        
    mainWindow = new BrowserWindow({ width: 800, height: 600 });

    mainWindow.on('close', function() { //   <---- Catch close event

        // The dialog box below will open, instead of your app closing.
        require('dialog').showMessageBox({
            message: "Close button has been pressed!",
            buttons: ["OK"]
        });
    });
});

更新：

要分离功能，您可以执行以下操作...

var app = require('app');
var BrowserWindow = require('browser-window');
var Menu = require('menu');

var force_quit = false;
var menu = Menu.buildFromTemplate([
{
    label: 'Sample',
    submenu: [
        {label: 'About App', selector: 'orderFrontStandardAboutPanel:'},
        {
            label: 'Quit', 
            accelerator: 'CmdOrCtrl+Q', 
            click: function() { 
                force_quit=true; app.quit();
            }
        }
    ]
}]);

app.on('window-all-closed', function(){
    if(process.platform != 'darwin')
        app.quit();
});

app.on('ready', function(){

    Menu.setApplicationMenu(menu);

    mainWindow = new BrowserWindow({width:800, height:600});

    // Continue to handle mainWindow "close" event here
    mainWindow.on('close', function(e){
        if(!force_quit){
            e.preventDefault();
            mainWindow.hide();
        }
    });

    // You can use 'before-quit' instead of (or with) the close event
    app.on('before-quit', function (e) {
        // Handle menu-item or keyboard shortcut quit here
        if(!force_quit){
            e.preventDefault();
            mainWindow.hide();
        }
    });

    // Remove mainWindow.on('closed'), as it is redundant

    app.on('activate-with-no-open-windows', function(){
        mainWindow.show();
    });
});

// This is another place to handle events after all windows are closed
app.on('will-quit', function () {
    // This is a good place to add tests insuring the app is still
    // responsive and all windows are closed.
    console.log("will-quit");
    mainWindow = null;
});

上面的代码使用 before-quit 事件处理程序来处理应用程序 api 上的应用程序“关闭”事件。浏览器窗口“关闭”事件仍由浏览器窗口 API 上的 mainWindow.on('close') 处理。

此外， will-quit 事件是在应用完全关闭之前测试问题的更好位置。

Answer 2

app.on('ready', ()=> {
let win = new BrowserWindow({width:800, height:600}) 
win.loadURL('file://'+__dirname+'/index.html')
win.on('closed', () => {
    console.log(' ---- Bye Bye Electron ---- ')
  });
})

因此你可以捕捉到 Close 事件