Linux下Electron窗口视口偏小1px，如何实现1920x1080视口？

在1920x1080分辨率的Linux系统中，创建无边框Electron窗口时，设置1920x1080尺寸后实际视口为1919x1079，这是因为部分Linux窗口管理器会对无边框窗口添加1px的隐形布局调整，导致视口尺寸被压缩。以下是可行的解决配置：

核心配置：启用useContentSize选项 #

在BrowserWindow构造函数中添加useContentSize: true，该选项会让窗口的尺寸直接对应网页内容的视口尺寸，而非包含窗口框架（即使frame: false也生效），绕开窗口管理器的额外调整。

修改后的代码示例：

const { app, BrowserWindow } = require('electron')
const path = require('node:path')

function createWindow () {
  const mainWindow = new BrowserWindow({
    frame: false,
    show: false,
    width: 1920,
    height: 1080,
    useContentSize: true,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js')
    }
  })

  mainWindow.loadFile('index.html')

  mainWindow.show()
}

app.whenReady().then(() => {
  createWindow()

  app.on('activate', function () {
    if (BrowserWindow.getAllWindows().length === 0) createWindow()
  })
})

app.on('window-all-closed', function () {
  if (process.platform !== 'darwin') app.quit()
})

备选方案：延迟设置窗口尺寸 #

如果上述配置仍有问题，可以在窗口ready-to-show事件触发后再设置尺寸，确保窗口初始化完成后再调整：

function createWindow () {
  const mainWindow = new BrowserWindow({
    frame: false,
    show: false,
    useContentSize: true,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js')
    }
  })

  mainWindow.loadFile('index.html')

  mainWindow.on('ready-to-show', () => {
    mainWindow.setBounds({ x: 0, y: 0, width: 1920, height: 1080 })
    mainWindow.show()
  })
}

极端情况补充 #

若窗口管理器限制严格，可尝试添加enableLargerThanScreen: true选项，允许窗口尺寸超过屏幕边界，强制达到设置的尺寸：

const mainWindow = new BrowserWindow({
  frame: false,
  show: false,
  width: 1920,
  height: 1080,
  useContentSize: true,
  enableLargerThanScreen: true,
  webPreferences: {
    preload: path.join(__dirname, 'preload.js')
  }
})

内容的提问来源于stack exchange，提问作者Žilvinas Rudžionis