电子窗口尺寸与屏幕分辨率

Question

我刚刚开始玩电子，我不太确定我了解BrowserWindow物体的尺寸。我当前的屏幕分辨率是 2880x1800，但如果我创建BrowserWindow1024x768 的分辨率，它几乎填满了整个屏幕（见下文），而内容显然被放大了。

作为参考，顶部的蓝色条由 CSS 设置为只有 150 像素...

mainWindow = new BrowserWindow({
  width: 1024,
  height: 768
});

到底发生了什么，我怎样才能有匹配的分辨率？

Answer 1

感谢@pery 的评论指出 Retina 显示器具有不同的像素比例因子并且 Electron 在其计算中使用它，我设法通过获取该因子并将其用于决定窗口的尺寸以及Web 视图的缩放系数。

这是我的解决方案：

  let factor = screen.getPrimaryDisplay().scaleFactor;

  // Create the browser window.
  mainWindow = new BrowserWindow({
    width: 1024 / factor,
    height: 768 / factor,
    webPreferences: {
      zoomFactor: 1.0 / factor
    }
  });