Electron 学习_BrowserWindow

BrowserWindow创建并控制浏览器窗口(主进程)
条件：在 app 模块 emitted ready 事件之前，您不能使用此模块。

1.在加载页面时，渲染进程第一次完成绘制时，如果窗口还没有被显示，渲染进程会发出 ready-to-show 事件 。 在此事件后显示窗口将没有视觉闪烁

  win.once('ready-to-show', () => {
    win.show()
  })

2.设置backgroundColor 属性

    //BrowserWindow  创建并控制浏览器窗口,设置窗口大小(在 app 模块 emitted ready 事件之前，不能使用此模块)
  const win = new BrowserWindow({
    width: width,
    height: height,
    backgroundColor: '#2e2c29',//窗口背景颜色
    webPreferences: {
      //nodeIntegration: true,
      defaultEncoding: 'utf-8',
      userAgent: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.182 Safari/537.36',
      preload: path.join(__dirname, 'preload.js')
    },
  });

3.设置父子窗口(通过使用 parent 选项，创建子窗口,子窗口总是位于父窗口上)

 const { width, height } = screen.getPrimaryDisplay().workAreaSize

  //BrowserWindow  创建并控制浏览器窗口,设置窗口大小(在 app 模块 emitted ready 事件之前，不能使用此模块)
  const win = new BrowserWindow({
    width: width,
    height: height,
    backgroundColor: '#2e2c29',//窗口背景颜色
    webPreferences: {
      //nodeIntegration: true,
      defaultEncoding: 'utf-8',
      userAgent: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.182 Safari/537.36',
      preload: path.join(__dirname, 'preload.js')
    },
  });
  const child = new BrowserWindow({ parent: win ,width:300,height:400}) //创建子窗口
  child.show()

  //在加载页面时，渲染进程第一次完成绘制时，如果窗口还没有被显示，渲染进程会发出 ready-to-show 事件 。 在此事件后显示窗口将没有视觉闪烁
  win.once('ready-to-show', () => {
    win.show()
  })

  win.loadFile('index.html');

4.new BrowserWindow 的 page-title-updated 事件：

  // 监听页面标题更新事件
  win.webContents.on('page-title-updated', (event, title) => {
    console.log(`页面标题更新为：${title}`);
  });