javascript - 在无框 Electron 窗口中使子窗口与父窗口一起移动

Question

我目前正在使用 ElectronJS 开发一个无框架应用程序，我试图让父窗口处理拖动、最小化、最大化和退出，以及子窗口的 Controller 来处理所有的内容。但是，当我在 main.js 中将父窗口设置为主窗口时，当我移动父窗口时，内容窗口将保持在原位。

下面是我的 main.js:

const electron = require('electron');
const url = require('url');
const path = require('path');

const {app, BrowserWindow, Menu} = electron;

let mainWindow;
let contentWindow;

app.on('ready', function createWindow(){
    //Create window
    mainWindow = new BrowserWindow({
        width: 1280,
        height: 720,
        frame: false
    })
    contentWindow = new BrowserWindow({
        width: 1280,
        height: 720,
        frame: false,
        parent: mainWindow
    })

    //load html for window
    mainWindow.loadURL(url.format({
        pathname: path.join(__dirname, 'assets/html/mainWindow.html'),
        protocol:'file:',
        slashes: true
    }));

    contentWindow.loadURL(url.format({
        pathname: path.join(__dirname, 'assets/html/contentWindow.html'),
        protocol:'file:',
        slashes: true
    }));
});

我的 mainWindow.html 中的一个 div 有 -webkit-app-region: Drag; 以允许它像普通窗口一样充当顶部栏。基本上我希望这可以移动两个窗口。

Answer 1

就像 @Dennis L也就是说，使用 docs 中提供的 move 事件。我虽然只支持mac，但我用的是windows。一旦我尝试它工作。

就我而言，我使用 getPosition 方法在移动或拖动过程中跟踪 mainWindow 位置。然后使用来自 mainWindow 本身的值对 secondWindow 进行 setPosition。

  mainWindow.on('move', function() {
    let position = mainWindow.getPosition();
    secondWindow.setPosition(position[0], position[1]);
  });