当 Electron 应用程序停靠在屏幕右侧时，如何向左调整窗口大小？

Question

我正在创建一个 Electron 应用程序，我们希望将导航工具栏停靠在屏幕右侧。 它需要在右侧，因为我们的大多数用户都在 Windows 上，将它停靠在左侧意味着它与大量图标重叠，并且它会被开始菜单覆盖。

当用户单击一个图标时，我需要窗口向左打开/调整大小。

在应用程序启动时，我创建了一个新窗口

mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    center: true,
    backgroundColor: '#18A4FC'
  })

然后在用户通过身份验证后，我使用 ipcRender 向 main.js 文件发送成功消息。 目前，这使用 setBounds 方法和屏幕尺寸将窗口“停靠”在屏幕右侧。

ipcMain.on('login-success', () => {
  let display = electron.screen.getPrimaryDisplay()
  const { width, height } = display.bounds
  mainWindow.setBounds({
    x: width - 40,
    y: 0,
    width: 40,
    height: height
  })
})

然后，当用户单击一个图标时，我使用 setSize 来“打开”停靠栏。 这意味着我将窗口的宽度从 40px 更改为 480px。 但它向右打开，屏幕外。 我需要它向左打开。

ipcMain.on('resize-open', () => {
  let display = electron.screen.getPrimaryDisplay()
  const { height } = display.bounds
  mainWindow.setSize(480, height)
})

任何想法如何做到这一点？ 我知道宽度，高度是从左上角设置为 0,0。 有什么办法可以重置吗？

Answer 1

我最终使用了 setBounds，而是将它向左移动到打开它所需的数量。

  let display = electron.screen.getPrimaryDisplay()
  const { width, height } = display.bounds
  mainWindow.setBounds({
    x: width - 320 ,
    y: height,
    width: 320,
    height: height
  })
})```

Answer 2

也许你可以尝试这样的事情：

mainWindow.setBounds({
  x: 0,
  y: 0,
  width: 480,
  height: height
})

代替：

mainWindow.setSize(480, height)

因为setBounds函数会重置窗口位置（在本例中为 0,0）并设置宽度和高度。