electron实现窗体最大化最小化

本文转载自：https://newsn.net/

本文中，苏南大叔讲述electron窗体的最大化及最小化控制，听起来应该是挺简单的，没有啥好说的。但是，事实上，这里electron的窗体变化，会隐藏着很多大坑。本文中，苏南大叔就描述一下，electron窗体最大化最小化的那些事儿。

注意：其中的状态最大化，并不是全屏状态（也不是简单全屏状态），最大化和全屏是两种不同的状态。

electron 如何实现窗体最大化最小化？状态如何检测及触发？

本文的测试环境是：mac。

electron窗体参数

electron窗体最大化及最小化的相关参数，如下显示：

mainWindow = new BrowserWindow({
width: 360,
height: 360,
// maxWidth:500,
// maxHeight:500,
// minWidth:250,
// minHeight:250,
maximizable: true,
minimizable: true,
resizable: true,
})

electron有关最大化和最小化的相关参数，就如上述所示了。在参数里面，并没有直接设置最大化或者最小化的参数。但是有个maximizable和minimizable，可以控制是否允许最大化或者最小化。其中resizable参数，看起来和最大化或者最小化没有太大关系，但实际上，却可以影响maximize()函数。

electron函数控制

最大化相关函数：

mainWindow.maximize();   //最大化函数
mainWindow.unmaximize(); //取消最大化函数

这里面，最有争议的就应该是maximize()函数，在标题栏里面的系统最大化按钮，是随时都可以最大化的。但是代码里面编写的maximize()函数，却要受到一系列参数的限制：比如：maximizable/resizable/maxWidth/maxHeight 这些参数的联合作用。所以，当您试图最大化maximize()却意外失败的时候，请检查上述参数。

最小化相关函数：

mainWindow.minimize();   //最小化函数
mainWindow.restore();    //取消最小化函数（从最小化窗口还原函数）

从maximize()和unmaximize()，推断出的unminimize()函数并不存在，而是要使用restore()函数。

electron窗体状态判断

是否最大化：

mainWindow.isMaximized();

值得注意的是：最大化、全屏、简单全屏后，这个isMaximized()返回值都为true。

是否最小化：

mainWindow.isMinimized();

值得注意的是：最小化之后，这个isMinimized()返回值都为true。但是hide()后，这个isMinimized()返回值都为false。

electron的on事件

mainWindow.on('maximize', () => {
})
mainWindow.on('minimize', () => {
})

这两个事件，就是简单的检测maximize()和minimize()的状态检测。全屏等其他事件不会触发，而交通灯区域的真实按钮，有一定的概率触发。所以，这两个状态的检测，和大家的想象的情况，可能有一些差距。

在渲染进程里面调用函数

renderer.js:

const electron = require('electron');
const remote = electron.remote;
remote.getCurrentWindow().maximize();
remote.getCurrentWindow().minimize();
remote.getCurrentWindow().unmaximize();
remote.getCurrentWindow().restore();

也就是说主进程中的mainWindow，就相当于渲染进程中的require('electron').remote.getCurrentWindow()。渲染进程里面使用这些函数的话，以后会单独成篇。这里仅作抛砖引玉作用。

总结

electron的最大化最小化相关函数就讲这么多，本文的electron是基于mac下最新版的4.0.1版本。对以往的低版本的electron来说，可能一些结论并不合适，仅供参考。

以上是 electron实现窗体最大化最小化 的全部内容， 来源链接： utcz.com/a/118966.html

回到顶部