首页 > 解决方案 > 不同大小的电子不同浏览器窗口

问题描述

我的电子应用程序有多个带有闪屏的浏览器窗口,由于某种原因,它们总是在单个显示器上全屏显示,如果我想更改 1 个窗口的大小,我需要将所有其他窗口更改为相同大小,以便发生的变化。

这就是我初始化我的方式browserwindow

 const Third_Window = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            nodeIntegration: true,
            contextIsolation: false,
            devTools: true,
            enableRemoteModule: false
        },
        frame: false,
        show: false,
        resizable: false,
        fullscreen: true,
        enableLargerThanScreen: true,
        kiosk: true,
        movable: false,
        alwaysOnTop: true,
        icon: "assets/icon.png"
    });

即使 fullscreen 属性为 false,应用程序仍会全屏运行。我改变窗口大小的方式如下:

Third_Window.setMaximumSize(width, height);
Third_Window.setMinimumSize(width, height);

现在,如果我只更改Third_Window大小而不更改大小,则仅当我将minandmax应用于包括启动屏幕在内的所有其他内容时,它才会更改。

此外,窗口显示为第一台监视器的全屏,我的目标是只显示一个窗口,即Third_Window两个监视器的全屏。我可以设法在两台显示器上将它们全部设置为全屏,但不能同时设置一个。

我得到两个显示器的大小如下:

    let displays = screen.getAllDisplays()
    let externalDisplay = displays.find((display) => {
        return display.bounds.x !== 0 || display.bounds.y !== 0
    })
    var { width, height } = screen.getPrimaryDisplay().workAreaSize
    if (externalDisplay) {
        width += externalDisplay.bounds.x + 50;
        height += externalDisplay.bounds.y + 50;
    }

我还尝试使用以下方法更改加载窗口的大小ipc

    //in the render process of the Third_Window
    ipcRenderer.send('resize');


    //in the main process
    ipcMain.on('resize', () => {
        console.log("resize" + width + ", " + height)
        display_Window.setMaximumSize(width, height);
        display_Window.setMinimumSize(width, height);
        display_Window.setSize(width, height);
    });

如果有人知道为什么我的窗口总是全屏,即使我禁用fullscreen或将其设置为 false,以及为什么我不能只更改 1 个窗口而不更改其他窗口,请提供任何帮助。

标签: electron

解决方案


推荐阅读