如何防止我的应用程序窗口转到另一个监视器(电子+ macOS)

Question

​

​

我有一个应用程序，以编程方式将其窗口移动到用户的屏幕上。我的问题是：

1. 用户有两个物理监视器
2. 用户在主监视器中启动应用程序
3. App移动窗口，导致更多的窗口“溢出”到辅助监视器上，而不是主监视器上。
4. 这将导致应用程序的窗口完全跳转到辅助监视器，并从主监视器中消失。

我希望窗口留在主监视器中，除非我希望它转到辅助监视器，或者某个定义的点(例如中心)进入辅助监视器，或者如果窗口被分割并显示在这两个监视器上，那么它甚至都是可以的。当窗口与辅助监视器更多地相交时，有什么方法可以防止这种跳转发生吗？

重申一下，我正在以编程的方式移动窗口，并在macOS上使用电子。

而且，当我手动移动窗口时，这种情况似乎不会发生，但我认为这是因为它没有使用它的百分比规则，而是继续运行鼠标的点是否已进入辅助监视器。

而且，我对任何一种解决方案都是开放的，包括C/C++或Swift。

编辑:下面是我当前移动窗口的方式：

win.setPosition(x, y);

其中win是电子的BrowserWindow的一个实例。

所需的行为是将窗口移到显示器上的任何位置。目前，如果某些窗口离开当前显示的边缘足够，它跳到另一个显示。这是因为苹果的默认行为是自动将窗口移动到与其重叠最多的显示器上，并将其隐藏在所有其他显示器上。值得注意的是，这不是手动拖动窗口时的行为，而是以编程方式移动窗口时的行为。

Answer 1

我不知道你是如何移动这个窗口的，也不知道当它到达边缘的时候，你希望这个窗口如何行动，但我会尽我所能给你一些解决方案。

我的第一个想法是在程序启动时创建屏幕的边界。因此，也许可以使用GetSystemMetrics()、screen.getPrimaryDisplay()，或者这些伪代码可以帮助：

var canvas = GetWindowSize()
var canvasWidth = canvas.width
var canvasHeight = canvas.height
if myWindow.x  + mywindow.width > canvasWidth
//if you want it to bounce off the edge
then myWindow.direction = oppositeDirection 
//if you want it to wrap to the other side of the screen
then myWindow.X -= canvasWidth

您应该检查一下弹跳DVD标志的代码。或者看看我的小行星游戏，看看飞船和小行星是如何在屏幕上移动的。

此外，您可以使用距离公式让窗口在中心靠近时对边缘做出反应。(尽管如此，这也需要您获得屏幕边界x和y。)

希望这能帮上忙！

编辑:我认为如果你以某种方式使用整个屏幕，(两个显示器)你的窗口甚至都认不出有一个边缘。话虽如此，我还是不知道你的代码到底是做什么的。

Answer 2

因为mac的行为，当你做win.setPosition(x, y);时，它就不能工作了。

(我还尝试了电子快速启动项目https://github.com/electron/electron-quick-start，甚至使用了相同的电子版本6.0.5)

我所做的就是以编程的方式模拟鼠标拖动你的应用程序到屏幕的右边。要做到这一点，您可以使用罗博兹。您将不会看到拖放效果，它非常接近于执行setPosition(x，y)

当你安装它时，你可能会有一个问题启动你的应用程序。然后你必须重建你的电子版本的rebotJS。https://github.com/octalmage/robotjs/wiki/Electron

因此，您将尝试以编程方式执行以下操作：

​

​

工作代码

      // get your app bounds and screen bounds
      const windowBounds = mainWindow.getBounds()                         
      const displayBounds = electron.screen.getPrimaryDisplay().bounds   

      setTimeout(() => {                                                  
        // 1. move mouse upon the top left corner your app
        robot.moveMouse(windowBounds.x + 100, windowBounds.y + 5);        
        // 2. mouse left key, 'down'
        robot.mouseToggle("down", "left");                               
        // 3. drag window to (100, 100) from default 
        robot.dragMouse(displayBounds.width, 0);                         
        // 4. mouse left key toggle 'up'
        robot.mouseToggle("up", "left");                                 
      }, 100);

Main.js中的示例：https://playcode.io/electron

我使用这些版本：

  "devDependencies": {
    "electron": "^6.0.5"
  },
  "dependencies": {
    "robotjs": "^0.6.0"
  }

我的nodejs的版本是10.20.0

Answer 3

也许这不是你想要的，但有一个想法:为什么不调整窗口的大小，而不是让它“溢出”到其他屏幕上呢？

当您预测该窗口将超出当前显示的范围时，只需缩小其大小即可。

这样做是可以做到的：

const winWidth = 800;
const winHeight = 600;

const SAFETY_MARGINS = 10;

let mainWindow;

// setPosition //////////////////////////////////////////////////////////////////////////

function setPosition(x, y) {
  const displayBounds = screen.getPrimaryDisplay().bounds
  const fixedX = Math.min(
    displayBounds.x + displayBounds.width,
    Math.max(x, displayBounds.x)
  );
  const fixedY = Math.min(
    displayBounds.y + displayBounds.height,
    Math.max(y, displayBounds.y)
  );
  mainWindow.setPosition(fixedX, fixedY);

  const fixedWidth = Math.max(SAFETY_MARGINS, Math.min(winWidth, displayBounds.width + displayBounds.x - x, winWidth - displayBounds.x + x));
  const fixedHeight = Math.max(SAFETY_MARGINS, Math.min(winHeight, displayBounds.height + displayBounds.y - y, winHeight - displayBounds.y + y));
  mainWindow.setSize(fixedWidth, fixedHeight);
}

这个版本的setPosition总是调整窗口的大小，这样它就不会超出显示范围。

您可以修改/扩展它，允许窗口稍微超出界限，并滚动窗口的内容(如果需要的话)。

我相信，对大多数用户来说，只要稍微调整一下屏幕，调整和移动窗口就会看起来有点像把窗口从屏幕上移开。

下面是一个使用以下代码随机移动窗口的演示：https://github.com/yoava/so-61092503

(我没有用双屏幕进行测试，因为我现在只使用笔记本电脑。)