Skip to content

构建主进程代码

在 Electron 中,主进程负责管理应用的生命周期和创建渲染进程。下面是一个简单的主进程(main process)代码示例,使用了 Electron 的 app, BrowserWindowMenu 模块:

javascript
// 引入 Electron 模块
const { app, BrowserWindow, Menu } = require('electron')

function createWindow () {
  // 创建浏览器窗口
  let win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true,
      contextIsolation: false,
      enableRemoteModule: true
    }
  })

  // 加载 index.html 文件
  win.loadFile('index.html')

  // 打开开发者工具
  win.webContents.openDevTools()

  // 设置菜单栏
  const template = [
    {
      label: '应用',
      submenu: [
        { role: 'quit' }
      ]
    }
  ];

  const menu = Menu.buildFromTemplate(template);
  Menu.setApplicationMenu(menu);
}

// 当 Electron 完成初始化后执行
app.whenReady().then(createWindow)

// 当所有窗口关闭时退出程序
app.on('window-all-closed', function () {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', function () {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow()
  }
})

代码解释

  1. 模块引入:从 Electron 中导入 app, BrowserWindowMenu 模块。

  2. 创建窗口:定义一个函数 createWindow 来创建一个新的 BrowserWindow 实例,并加载你的 HTML 页面。

  3. 设置窗口参数:配置窗口大小、启用 Node.js 集成等。

  4. 加载文件:使用 win.loadFile() 方法来加载 HTML 文件。

  5. 打开开发者工具:通过 win.webContents.openDevTools() 开启开发者工具。

  6. 设置菜单:使用 MenuMenu.buildFromTemplate 方法来创建并设置菜单栏。

  7. 监听事件

    • whenReady:当 Electron 初始化完成时调用 createWindow 函数。
    • window-all-closed:如果所有窗口都被关闭,则根据平台决定是否退出应用。
    • activate:在 macOS 上,当 Dock 图标被点击且没有其他窗口打开时,重新创建窗口。

以上代码是 Electron 应用主进程的一个基本框架,你可以在此基础上添加更多功能,如菜单操作、拖拽支持、自动更新等。