electron vue 根据不同的电脑分辨率改窗口大小和让页面适配各种屏幕问题
根据不同的电脑分辨率改窗口大小在electron里面的一个main.js改段代码本项目是开发时候按照1920*1080大小做的,fullscreenable是确定窗口是否全屏的,在低于1920*1080的大小,不同分辨率宽高比例不同,为了页面正常显示,小于1920*1080的,给它设置宽高function createWindow () {let size = requir...
·
根据不同的电脑分辨率改窗口大小
在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了解不深,有些不对了地方,请提出,谢谢,这只是开发项目时候遇见的问题,处理方法
更多推荐
已为社区贡献6条内容
所有评论(0)