electron vue 根据不同的电脑分辨率改窗口大小和让页面适配各种屏幕问题

根据不同的电脑分辨率改窗口大小

在electron里面的一个main.js改段代码

本项目是开发时候按照1920*1080大小做的,fullscreenable是确定窗口是否全屏的,在低于1920*1080的大小,不同分辨率宽高比例不同,为了页面正常显示,小于1920*1080的,给它设置宽高

function createWindow () {
  let size = require('electron').screen.getPrimaryDisplay().workAreaSize
  let width = parseInt(size.width)
  console.log(width)
  if(width>=1920){
      mainWindow = new BrowserWindow({
      fullscreenable: true,
      fullscreen: true,
      autoHideMenuBar: true
    })
  }else{
    let height = parseInt(1080*size.width/1920+30)
    mainWindow = new BrowserWindow({
      width: width,
      height: height,
      fullscreenable: false,
      fullscreen: true,
      autoHideMenuBar: true
    })
  }

  mainWindow.loadURL(winURL)
}
app.on('ready', function () {
  createWindow();
})

页面适配各种屏幕问题

在vue项目里面的main.js写代码

   var devInnerWidth= 1920.0 // 开发时的InnerWidth
   var scaleFactor = require('electron').screen.getPrimaryDisplay().scaleFactor;
   var zoomFactor =  window.innerWidth/devInnerWidth;
   require('electron').webFrame.setZoomFactor(zoomFactor);

对electron了解不深,有些不对了地方,请提出,谢谢,这只是开发项目时候遇见的问题,处理方法