ウィンドウ位置・splitterの位置を記憶できるようにする

package.json

@@ -34,6 +34,7 @@
     "dayjs": "1.10.7",
     "electron-log": "4.4.1",
     "electron-store": "8.0.0",
+    "electron-window-state": "5.0.3",
     "encoding-japanese": "1.0.30",
     "immer": "9.0.2",
     "lodash.debounce": "4.0.8",

src/background.ts

@@ -35,10 +35,12 @@ import {
   ToolbarSetting,
   ActivePointScrollMode,
   EngineInfo,
+  SplitterPosition,
 } from "./type/preload";
 
 import log from "electron-log";
 import dayjs from "dayjs";
+import windowStateKeeper from "electron-window-state";
 
 // silly以上のログをコンソールに出力
 log.transports.console.format = "[{h}:{i}:{s}.{ms}] [{level}] {text}";
@@ -206,6 +208,7 @@ const store = new Store<{
   experimentalSetting: ExperimentalSetting;
   acceptRetrieveTelemetry: AcceptRetrieveTelemetryStatus;
   acceptTerms: AcceptTermsStatus;
+  splitterPosition: SplitterPosition;
 }>({
   schema: {
     useGpu: {
@@ -357,6 +360,15 @@ const store = new Store<{
       enum: ["Unconfirmed", "Accepted", "Rejected"],
       default: "Unconfirmed",
     },
+    splitterPosition: {
+      type: "object",
+      properties: {
+        portraitPaneWidth: { type: "number" },
+        audioInfoPaneWidth: { type: "number" },
+        audioDetailPaneHeight: { type: "number" },
+      },
+      default: {},
+    },
   },
   migrations: {},
 });
@@ -737,9 +749,16 @@ let willQuit = false;
 let filePathOnMac: string | null = null;
 // create window
 async function createWindow() {
+  const mainWindowState = windowStateKeeper({
+    defaultWidth: 800,
+    defaultHeight: 600,
+  });
+
   win = new BrowserWindow({
-    width: 800,
-    height: 600,
+    x: mainWindowState.x,
+    y: mainWindowState.y,
+    width: mainWindowState.width,
+    height: mainWindowState.height,
     frame: false,
     titleBarStyle: "hidden",
     trafficLightPosition: { x: 6, y: 4 },
@@ -811,6 +830,8 @@ async function createWindow() {
       }
     }
   });
+
+  mainWindowState.manage(win);
 }
 
 const menuTemplateForMac: Electron.MenuItemConstructorOptions[] = [
@@ -1162,6 +1183,14 @@ ipcMainHandle("SET_EXPERIMENTAL_SETTING", (_, experimentalSetting) => {
   store.set("experimentalSetting", experimentalSetting);
 });
 
+ipcMainHandle("GET_SPLITTER_POSITION", () => {
+  return store.get("splitterPosition");
+});
+
+ipcMainHandle("SET_SPLITTER_POSITION", (_, splitterPosition) => {
+  store.set("splitterPosition", splitterPosition);
+});
+
 // app callback
 app.on("web-contents-created", (e, contents) => {
   // リンククリック時はブラウザを開く

src/electron/preload.ts

@@ -263,6 +263,14 @@ const api: Sandbox = {
     return await ipcRendererInvoke("SET_EXPERIMENTAL_SETTING", setting);
   },
 
+  getSplitterPosition: async () => {
+    return await ipcRendererInvoke("GET_SPLITTER_POSITION");
+  },
+
+  setSplitterPosition: async (splitterPosition) => {
+    return await ipcRendererInvoke("SET_SPLITTER_POSITION", splitterPosition);
+  },
+
   getDefaultHotkeySettings: async () => {
     return await ipcRendererInvoke("GET_DEFAULT_HOTKEY_SETTINGS");
   },

src/store/index.ts

@@ -177,6 +177,7 @@ export const indexStore: VoiceVoxStoreOptions<
       promises.push(dispatch("GET_ACCEPT_RETRIEVE_TELEMETRY"));
       promises.push(dispatch("GET_ACCEPT_TERMS"));
       promises.push(dispatch("GET_EXPERIMENTAL_SETTING"));
+      promises.push(dispatch("GET_SPLITTER_POSITION"));
 
       await Promise.all(promises).then(() => {
         dispatch("ON_VUEX_READY");

src/store/setting.ts

@@ -46,6 +46,11 @@ export const settingStoreState: SettingStoreState = {
     enablePreset: false,
     enableInterrogativeUpspeak: false,
   },
+  splitterPosition: {
+    audioDetailPaneHeight: undefined,
+    audioInfoPaneWidth: undefined,
+    portraitPaneWidth: undefined,
+  },
 };
 
 export const settingStore: VoiceVoxStoreOptions<
@@ -102,6 +107,9 @@ export const settingStore: VoiceVoxStoreOptions<
     SET_ACCEPT_TERMS(state, { acceptTerms }) {
       state.acceptTerms = acceptTerms;
     },
+    SET_SPLITTER_POSITION(state, { splitterPosition }) {
+      state.splitterPosition = splitterPosition;
+    },
   },
   actions: {
     GET_SAVING_SETTING({ commit }) {
@@ -237,6 +245,15 @@ export const settingStore: VoiceVoxStoreOptions<
       window.electron.setExperimentalSetting(experimentalSetting);
       commit("SET_EXPERIMENTAL_SETTING", { experimentalSetting });
     },
+    GET_SPLITTER_POSITION({ dispatch }) {
+      window.electron.getSplitterPosition().then((splitterPosition) => {
+        dispatch("SET_SPLITTER_POSITION", { splitterPosition });
+      });
+    },
+    SET_SPLITTER_POSITION({ commit }, { splitterPosition }) {
+      window.electron.setSplitterPosition(splitterPosition);
+      commit("SET_SPLITTER_POSITION", { splitterPosition });
+    },
   },
 };
 

src/store/type.ts

@@ -25,6 +25,7 @@ import {
   Preset,
   ActivePointScrollMode,
   EngineInfo,
+  SplitterPosition,
 } from "@/type/preload";
 import { IEngineConnectorFactory } from "@/infrastructures/EngineConnector";
 import { QVueGlobals } from "quasar";
@@ -767,6 +768,7 @@ export type SettingStoreState = {
   themeSetting: ThemeSetting;
   acceptRetrieveTelemetry: AcceptRetrieveTelemetryStatus;
   experimentalSetting: ExperimentalSetting;
+  splitterPosition: SplitterPosition;
 };
 
 type SettingStoreTypes = {
@@ -835,6 +837,15 @@ type SettingStoreTypes = {
     mutation: { experimentalSetting: ExperimentalSetting };
     action(payload: { experimentalSetting: ExperimentalSetting }): void;
   };
+
+  GET_SPLITTER_POSITION: {
+    action(): void;
+  };
+
+  SET_SPLITTER_POSITION: {
+    mutation: { splitterPosition: SplitterPosition };
+    action(payload: { splitterPosition: SplitterPosition }): void;
+  };
 };
 
 export type SettingGetters = StoreType<SettingStoreTypes, "getter">;

src/type/ipc.d.ts

@@ -262,6 +262,16 @@ type IpcIHData = {
     return: void;
   };
 
+  GET_SPLITTER_POSITION: {
+    args: [];
+    return: import("@/type/preload").SplitterPosition;
+  };
+
+  SET_SPLITTER_POSITION: {
+    args: [splitterPosition: import("@/type/preload").SplitterPosition];
+    return: void;
+  };
+
   THEME: {
     args: [obj: { newData?: string }];
     return: import("@/type/preload").ThemeSetting | void;

src/type/preload.d.ts

@@ -82,6 +82,8 @@ export interface Sandbox {
   setAcceptTerms(acceptTerms: AcceptTermsStatus): Promise<void>;
   getExperimentalSetting(): Promise<ExperimentalSetting>;
   setExperimentalSetting(setting: ExperimentalSetting): Promise<void>;
+  getSplitterPosition(): Promise<SplitterPosition>;
+  setSplitterPosition(splitterPosition: SplitterPosition): Promise<void>;
   getDefaultHotkeySettings(): Promise<HotKeySetting[]>;
   getDefaultToolbarSetting(): Promise<ToolbarSetting>;
   theme(newData?: string): Promise<ThemeSetting | void>;
@@ -265,3 +267,9 @@ export type ExperimentalSetting = {
   enablePreset: boolean;
   enableInterrogativeUpspeak: boolean;
 };
+
+export type SplitterPosition = {
+  portraitPaneWidth: number | undefined;
+  audioInfoPaneWidth: number | undefined;
+  audioDetailPaneHeight: number | undefined;
+};