如何在Github Electron Atom中禁用或生成非活动的浏览器窗口

Question

我的电子应用程序中有2个BrowserWindow（mainWindow，secondaryWindow）实例。第一个窗口（mainWindow）中有一个按钮，单击该按钮将打开另一个窗口（secondaryWindow）。

现在我的问题是，我不希望用户能够点击mainWindow上的任何内容，直到secondaryWindow关闭。

我最接近的是使用mainWindow.hide（）。这只是完全隐藏了mainWindow。我想要的是用户在secondaryWindow处于活动状态时仍然可以看到mainWindow。但是当secondaryWindow处于活动状态时，mainWindow应该被禁用/不活动。

有什么建议 ？？？

Answer 1

您可以使用父/子概念在子项打开时禁用父项：

let top = new BrowserWindow()
let child = new BrowserWindow({parent: top})

您还可以将概念扩展到完整模态窗口，如下所示：

let child = new BrowserWindow({parent: top, modal: true, show: false})
child.loadURL('https://github.com')
child.once('ready-to-show', () => {
  child.show()
})

Answer 2

无法在Electron中禁用窗口。 我所知道的唯一选择是从窗口内部禁用JS中的所有内容。 或者可能会在窗口中显示覆盖所有内容的叠加div。

Answer 3

无法让@Jens Habegger的解决方案为我工作。 由于我使用的是bootstrap + jquery样式应用程序，因此我希望显示背景以防止交互，但仍然可以看到内容。 这让用户在视觉上知道窗口被禁用输入。

...
mainWindow.webContents.executeJavaScript("$('<div class=\"modal-backdrop\" style=\"opacity:0.5 !important;\"></div>').appendTo(document.body);");

modal.on('close',function() {
  mainWindow.webContents.executeJavaScript("$(\".modal-backdrop\").remove();");
});

modal.show();