electron 如何在电子应用程序中恢复默认窗口大小?

9fkzdhlc  于 2022-12-20  发布在  Electron
关注(0)|答案(3)|浏览(442)

有没有方法可以将电子应用程式的主 windows 还原至某个大小?为了解释我的目的,让我给予你一个例子:
当我打开Windows资源管理器时,它会以一定的大小和位置打开。然后我最大化该窗口并关闭资源管理器。下次当我重新启动资源管理器时,它会以与关闭时相同的状态打开,即最大化状态。但是,当我单击还原按钮时,资源管理器会还原到最大化之前的宽度/高度和位置。
我也想在我的电子应用程序中完成同样的任务。然而,这并没有发生。
我所做的是当我的应用程序关闭时,我使用(win.getBounds())捕获应用程序窗口的尺寸(宽度,高度)和位置(x,y坐标),并使用electron-config将它们保存在配置文件中。

const Config = require('electron-config')
  const config = new Config();

  mainWindow.on('close', () => {
    config.set('winBounds', mainWindow.getBounds())
  });

现在,当我启动应用程序时,我从配置文件中读取设置(实际上electron-config为我做了这件事),并使用它来设置窗口的初始尺寸/位置。

let opts = {
    show: false,
    icon: path.join(__dirname, 'app-window-icon.png')
  };
  Object.assign(opts, config.get('winBounds'));
  mainWindow = new BrowserWindow(opts);

这也很好用。但是我现在得到的唯一选项是最大化窗口。我找不到任何选项来将窗口恢复到最大化之前的大小。
例如,假设用户启动了一个尺寸为1024 x768像素的应用程序。然后用户最大化应用程序窗口,然后关闭它。当用户重新启动应用程序时,它会以关闭时的大小打开,我看到的唯一选项是最大化窗口。我正在寻找的是一个将窗口大小恢复为1024 x768像素的选项。
我在这里查阅了文档:https://github.com/electron/electron/blob/master/docs/api/browser-window.md,但很遗憾,在那里找不到任何内容。

nbewdwxp

nbewdwxp1#

我使用了solution here,它涉及到在electron-settings中保持窗口大小和位置,它工作得很完美。
在代码中包含windowStateKeeper函数,然后按如下方式调整createMainWindow函数:

function createMainWindow() {
    const mainWindowStateKeeper = windowStateKeeper('main');
    const win = new electron.BrowserWindow({
        title: 'main',
        x: mainWindowStateKeeper.x,
        y: mainWindowStateKeeper.y,
        width: mainWindowStateKeeper.width,
        height: mainWindowStateKeeper.height
    });
    mainWindowStateKeeper.track(win);

    win.loadURL(`file://${__dirname}/index.html`);
    win.on('closed', onClosed);

    return win;
}
olqngx59

olqngx592#

以下是完整的解决方案:
stateKeeper.ts:

import {screen} from 'electron';
import settings from 'electron-settings';

export const windowStateKeeper = async (windowName) => {
    let window, windowState;

    const setBounds = async () => {
        // Restore from appConfig
        if (await settings.has(`windowState.${windowName}`)) {
            windowState = await settings.get(`windowState.${windowName}`);
            return;
        }

        const size = screen.getPrimaryDisplay().workAreaSize;

        // Default
        windowState = {
            x: undefined,
            y: undefined,
            width: size.width / 2,
            height: size.height / 2,
        };
    };

    const saveState = async () => {
        // bug: lots of save state events are called. they should be debounced
        if (!windowState.isMaximized) {
            windowState = window.getBounds();
        }
        windowState.isMaximized = window.isMaximized();
        await settings.set(`windowState.${windowName}`, windowState);
    };

    const track = async (win) => {
        window = win;
        ['resize', 'move', 'close'].forEach((event) => {
            win.on(event, saveState);
        });
    };

    await setBounds();

    return {
        x: windowState.x,
        y: windowState.y,
        width: windowState.width,
        height: windowState.height,
        isMaximized: windowState.isMaximized,
        track,
    };
};

main.ts

import {windowStateKeeper} from './utils/windowStateKeeper';

const mainWindowStateKeeper = await windowStateKeeper('main');

    // Create the browser window.
    mainWin = new BrowserWindow({
        title: 'Desktop',
        x: mainWindowStateKeeper.x,
        y: mainWindowStateKeeper.y,
        width: mainWindowStateKeeper.width,
        height: mainWindowStateKeeper.height,
        webPreferences: {
            nodeIntegration: true,
            allowRunningInsecureContent: serve ? true : false,
            contextIsolation: false, // false if you want to run e2e test with Spectron
            enableRemoteModule: true, // true if you want to run e2e test with Spectron or use remote module in renderer context (ie. Angular)
        },
    });

    // Track window state
    mainWindowStateKeeper.track(mainWin);
fruv7luv

fruv7luv3#

我实现了这个经过大量的测试这是最准确和简单的解决方案来记住窗口属性。我用electron-store来存储值,你可以使用任何存储方法你喜欢。

主文件.js

let windowConfig = {
    width: 1280,
    height: 680,
}

function createWindow() {
    Object.assign(windowConfig, CONFIG.get("winBounds"))
    mainWindow = new BrowserWindow(windowConfig)
    if (windowConfig.isMaximized) {
        mainWindow.maximize()
    }
    mainWindow.on("close", () => {
        Object.assign(windowConfig, {
            isMaximized: mainWindow.isMaximized()
        }, mainWindow.getNormalBounds())
        CONFIG.set("winBounds", windowConfig) // saves window's properties using electron-store
    })
}

相关问题