乐闻世界logo
搜索文章和话题

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

5 个月前提问
3 个月前修改
浏览次数54

1个答案

1

在Electron应用程序中,您可以通过监听窗口(BrowserWindow 实例)的 close 事件来捕捉用户点击关闭按钮的动作。这可以在应用程序的主进程中设置。下面是一个简单的实现例子:

步骤 1: 创建并设置 BrowserWindow

首先,确保您已经创建了一个 BrowserWindow 实例。这通常在应用的主进程文件中(通常是 main.jsindex.js)完成。

javascript
const { app, BrowserWindow } = require('electron'); function createWindow () { let win = new BrowserWindow({ width: 800, height: 600, webPreferences: { nodeIntegration: true } }); win.loadFile('index.html'); // 监听关闭事件 win.on('close', (e) => { console.log('窗口关闭前的处理'); // 这里可以插入你需要执行的代码,比如提示保存操作等 // 如果需要取消关闭,可以调用 e.preventDefault(); }); win.on('closed', () => { console.log('窗口已关闭'); // 在这里做一些清理操作,例如释放资源、保存数据等 }); return win; } app.whenReady().then(createWindow); app.on('window-all-closed', () => { if (process.platform !== 'darwin') { app.quit(); } }); app.on('activate', () => { if (BrowserWindow.getAllWindows().length === 0) { createWindow(); } });

步骤 2: 监听 close 事件

在上面的代码中,我们给创建的窗口添加了一个 close 事件监听器。当用户尝试关闭窗口时(例如点击窗口的关闭按钮),此事件会被触发。

javascript
win.on('close', (e) => { console.log('用户尝试关闭窗口'); // 这里可以执行一些逻辑判断,比如检查用户是否保存了修改内容 // 如果要阻止窗口关闭,可以使用 e.preventDefault(); });

示例:阻止窗口直接关闭并弹出提示

以下是一个实际的例子,当用户点击关闭按钮时,我们会弹出一个确认对话框询问用户是否真的想要关闭窗口:

javascript
const { dialog } = require('electron'); win.on('close', (e) => { e.preventDefault(); // 防止窗口立即关闭 dialog.showMessageBox({ type: 'question', buttons: ['Yes', 'No'], title: 'Confirm', message: '确定要关闭吗?' }).then(result => { if (result.response === 0) { // 用户点击 "Yes" win.destroy(); // 忽略 close 事件并强制关闭窗口 } }); });

这样,我们就可以在用户尝试关闭窗口时执行一些自定义的逻辑,并根据需要阻止或允许窗口关闭。

2024年7月2日 23:50 回复

你的答案