electron控制BrowserWindow的新开窗口尺寸

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留链接信息。

在前面的文章中，苏南大叔讲述了如何控制webview的新开窗口问题，链接见末尾。今天讲述的是BrowserWindow的新开窗口问题: webview是不能打开_blank页面，而BrowserWindow打开_blank或者window.open页面是可以的，但是尺寸是固定的，无法控制size。

• 殊途同归，webview和BrowserWindow都是通过拦截“new-window”事件来解决问题的。
• 本文的基础代码，还是以前文章提到过的改造版的quick-start。

代码片段

main主进程：

function createWindow()
{
  mainWindow = new BrowserWindow({
      height:600,
      width:600,
      webPreferences: {nodeIntegration: false}
  });
  //mainWindow.maximize();
  mainWindow.loadURL(config.url);
  win_event(mainWindow);
  mainWindow.on('closed', function ()
  {
    mainWindow = null;
  });
}

function win_event(win){
  win.webContents.on( 'new-window', function (event,url,fname,disposition,options) {
    let childWindow;
    childWindow = new BrowserWindow({
      height:360,
      width:360,
      webPreferences: {nodeIntegration: false}
    });
    win_event(childWindow);
    childWindow.loadURL(url);
    event.preventDefault();
  });
}

electron控制BrowserWindow的新开窗口尺寸（图3-1）

苏南大叔自定义了一个win_event函数，在这里拦截了new-window事件。同时，使用event.preventDefault()，来阻止默认行为（打开固定尺寸的窗口）。然后新建了一个BrowserWindow，利用它来控制新开窗口的尺寸，同时再次调用该函数，使得新开窗口中的新开窗口，也能够在控制拦截范围内。

electron控制BrowserWindow的新开窗口尺寸（图3-2）

效果截图

electron控制BrowserWindow的新开窗口尺寸（图3-3）

相关链接

webview的类似问题，请见这里：https://newsn.net/say/electron-webview-window-open.html

小结

在苏南大叔这边理解着，对比普通的网页，browserwindow就是我们平时看到的正常网页窗口，而webview则相当于iframe。当然了，electron中，把好多网页概念都进行了重写。

更多苏南大叔带来的electron的精彩文章，请点击这里查看：https://newsn.net/tag/electron/ 。

  【electron】秘籍文章入口，仅传授于有缘之人  electron

欢迎转载传播本篇原创文章，转载请保留链接及作者信息。

苏南大叔需要你的支持

• 《前端视频教程大礼包》一套
• 《wordpress精选皮肤》一套
• 《dedecms织梦精选模板》一套

岁月静好

关注互联网发展，关注苏南大叔的《程序如此灵动~》博客
本文章来自：程序如此灵动~
博客地址为：https://newsn.net/
原文地址为：https://newsn.net/say/electron-browserwindow-size.html
上一篇好文：cmd下，electron的console.log中文乱码问题的解决方案
下一篇好文：electron-packager命令常用参数大全（含换图标方案）