4. Electron.js – Основы. Electron API – BrowserWindow.

Продолжим изучение методов и параметров Electron API. В данной заметке рассмотрим BrowserWindow, а также рассмотрим применение полезного модуля  electron-window-state, который позволяет сохранять размеры и положение окна приложения после его  закрытия. Ниже приведены примеры настройки BrowserWindow и показана возможность создания нескольких окон у приложения.

Кроме размеров окна в BrowserWindow  можно задавать и другие параметры при инициализации приложения, для примера показаны наиболее популярные свойства.

Более правильный вариант загрузки окна, пользователь увидит содержимое окна только после полной его загрузки.

Можно создавать приложение состоящее из нескольких окон для этого достаточно создать дополнительно экземпляры объекта BrowserWindow.

Для того чтобы окна имели взаимоотношение родитель-ребенок при создании дочернего окна
нужно указать его родителя. Функционал хорошо работает в MacOS, в Windows к сожалению нет.

Создание дочернего окна в виде модального окна внутри родительского окна. Функционал работает в MacOS, в Windows к сожалению нет.

Существует возможность выключить стандартную рамку и топбар у окна, но такое окно нельзя будет перемещать для этого добавляем к разметке специальные свойства CSS.

Для того чтобы после закрытия окна сохранялось его положение после закрытия, лучше всего воспользоватся дополнительным модулем – electron-window-state.

Подключаем модуль запоминающий положение и размер окна на экране перед закрытием.

Устанавливаем в windowStateKeeper размеры окна по умолчанию

Добавляем параметры в BrowserWindow.

Инициализируем слежение за положением и размером окна.

Методов и параметров значительно больше чем рассмотрено здесь, для поиска необходимого решения по манипуляциям с окнами лучше всего обратиться к документации – BrowserWindow и webContents

Здесь можно более детально рассмотреть проект на GitHub с установленными настройкам и дополнениями – https://github.com/NetWorkRoom/electron-start/tree/browserwindow.