electron 最大化

### Electron 实现窗口最大化方法

在 Electron 应用程序中，实现窗口最大化的功能可以通过主进程中的 `BrowserWindow` 模块来完成。如果应用程序使用了自定义标题栏（即设置了 `frame: false`），则需要手动处理窗口的最大化逻辑。

对于已经处于最大化状态的窗口，尝试调整其尺寸可能会失败，因为此时窗口大小由操作系统控制[^1]。因此，在更改窗口大小之前应先检查并取消当前的最大化状态。

#### 主进程中定义事件监听器

为了响应来自前端页面发出的操作请求，可以在主进程中设置相应的 IPC (Inter-Process Communication) 通信机制：

const { ipcMain, BrowserWindow } = require('electron');

// 假设 mainWindow 是已创建好的浏览器窗口实例
let mainWindow;

ipcMain.on('window-maximize', () => {
    const win = BrowserWindow.fromWebContents(mainWindow.webContents);
    
    if (!win.isMaximized()) {
        win.maximize();
    }
});

这段代码展示了如何接收名为 `'window-maximize'` 的消息，并据此判断当前窗口是否已被最大化；如果不是，则调用 `maximize()` 方法使窗口进入全屏模式[^2]。

另外，还需要考虑恢复原始大小的功能：

ipcMain.on('window-unmaximize', () => {
    const win = BrowserWindow.fromWebContents(mainWindow.webContents);

    if (win.isMaximized()) {
        win.unmaximize();
    }
});

此部分实现了相反的过程——当接收到 `'window-unmaximize'` 请求时，会检测窗口是否处在最大化状态，如果是的话就将其恢复正常显示比例[^3]。

#### 渲染端触发相应动作

为了让用户能够交互式地控制窗口的状态变化，可以利用 Vue.js 或其他框架编写前端界面组件，向主进程发送信号以启动上述过程。例如：

<button @click="handleMaximize">最大化</button>
<button @click="handleUnmaximize">还原</button>

<script>
import { remote } from 'electron';

export default {
  methods: {
    handleMaximize() {
      remote.ipcRenderer.send('window-maximize');
    },
    handleUnmaximize() {
      remote.ipcRenderer.send('window-unmaximize');
    }
  }
}
</script>

这里展示了一个简单的 HTML 结构以及对应的 JavaScript 函数用于发送指令给主进程，从而达到切换窗口大小的效果。