Appearance
electron-window-state
一个用于保存和恢复 Electron 窗口状态的工具
安装
bash
pnpm add electron-window-state基础配置
主进程配置
ts
import { app, BrowserWindow } from 'electron'
import windowStateKeeper from 'electron-window-state'
app.whenReady().then(() => {
// 加载上次窗口状态
const mainWindowState = windowStateKeeper({
defaultWidth: 900,
defaultHeight: 670,
})
// 创建窗口并应用状态
const mainWindow = new BrowserWindow({
x: mainWindowState.x,
y: mainWindowState.y,
width: mainWindowState.width,
height: mainWindowState.height,
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
},
})
// 监听窗口状态变化
mainWindowState.manage(mainWindow)
})使用示例
自定义存储配置
ts
import windowStateKeeper from 'electron-window-state'
app.whenReady().then(() => {
const mainWindowState = windowStateKeeper({
defaultWidth: 900,
defaultHeight: 670,
// 自定义存储文件名
file: 'window-state.json',
// 自定义存储路径
path: app.getPath('userData'),
// 最大/最小尺寸限制
maximize: true,
fullScreen: true,
})
const mainWindow = new BrowserWindow({
...mainWindowState,
minWidth: 400,
minHeight: 300,
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
},
})
mainWindowState.manage(mainWindow)
})多窗口状态管理
ts
import windowStateKeeper from 'electron-window-state'
app.whenReady().then(() => {
// 主窗口状态
const mainWindowState = windowStateKeeper({
defaultWidth: 900,
defaultHeight: 670,
file: 'main-window-state.json',
})
// 子窗口状态
const childWindowState = windowStateKeeper({
defaultWidth: 600,
defaultHeight: 400,
file: 'child-window-state.json',
})
// 创建并管理多个窗口
const mainWindow = new BrowserWindow({
...mainWindowState,
})
const childWindow = new BrowserWindow({
...childWindowState,
parent: mainWindow,
})
// 分别管理窗口状态
mainWindowState.manage(mainWindow)
childWindowState.manage(childWindow)
})高级配置
ts
import { app, BrowserWindow } from 'electron'
import windowStateKeeper from 'electron-window-state'
app.whenReady().then(() => {
const mainWindowState = windowStateKeeper({
defaultWidth: 900,
defaultHeight: 670,
// 自定义存储配置
file: 'window-state.json',
path: app.getPath('userData'),
// 窗口尺寸限制
maximize: true,
fullScreen: true,
// 事件处理
beforeSave: (win) => {
// 保存前的处理
console.log('即将保存窗口状态')
},
afterRestore: (win) => {
// 恢复后的处理
console.log('已恢复窗口状态')
},
// 自定义序列化
serialize: (data) => {
// 添加额外数据
return {
...data,
timestamp: Date.now(),
}
},
// 自定义反序列化
deserialize: (data) => {
// 处理额外数据
console.log('上次保存时间:', new Date(data.timestamp))
return data
},
})
const mainWindow = new BrowserWindow({
...mainWindowState,
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
},
})
mainWindowState.manage(mainWindow)
})