How to fix application-window resizing error for a BrowserView in electronjs?

Viewed 494

so I'm writing on a electron application at the moment. To make my application a bit smoother I created a BrowserWindow and loaded just the menubar and the background.

After that I added a BrowserView to show the acutal content.

Code for my BrowserWindow:

function createWindow() {
    win = new BrowserWindow({
        width: 800,
        height: 600,
        show: false,
        frame: false,
        webPreferences: {
            nodeIntegration: true
        }
    })

    win.loadFile(path.join(__dirname, 'views/index.pug'));

    win.on('closed', () => {
        win = null;
    })

    win.once('ready-to-show', () => {
        win.show();
    })
}

Code for my BrowserView:

function createViews() {
    contentView = new BrowserView({ webPreferences: { nodeIntegration: true } });

    win.addBrowserView(contentView);

    contentView.setBounds({ x: 0, y: 23, width: win.getBounds().width, height: win.getBounds().height - 23 });
    contentView.setAutoResize({ width: true, height: true });

    contentView.webContents.loadFile(path.join(__dirname, 'views/imageGallery.pug'));
}

(If there is a spoiler function to hide the code: I'm sorry, I didn't find any)


Once I create the window it works like intended, also the normal resize via mouse-drag works perfectly.

Now my problem is, as soon as I maximize or unmaximize my window with the functions win.maximize() and win.unmaximize() my BrowserView gets resized. But the resize doesn't fit the BrowserWindow anymore. The content of the BrowserView is being cutted on the right side.

Window after being maximized: Maximized Window

Window after being unmaximized: Unmaximized Window

1 Answers

    function createWindow() {
      // Create the browser window.
      const mainWindow = new BrowserWindow({ useContentSize: true });
      const view = new BrowserView();
      mainWindow.setBrowserView(view);
      view.setBounds({ x: 0, y: 0, width: 800, height: 600 });
      view.setAutoResize({ width: true, height: true });
      view.webContents.loadURL("https://youtube.com");
    }

Related