source/Component/HeaderBar/HeaderBar.tsx

@@ -4,7 +4,7 @@ import { useStatusWithEvent, useStatus, IMixinStatusProps } from "@Context/Statu
 import { useSettingWithEvent, IMixinSettingProps, Platform } from "@Context/Setting";
 import { Theme, BackgroundLevel, FontLevel } from "@Component/Theme/Theme";
 import { LocalizationTooltipHost } from "@Component/Localization/LocalizationTooltipHost";
-import { useElectron, IMixinElectronProps } from "@Context/Electron";
+import { useElectronWithEvent, IMixinElectronProps } from "@Context/Electron";
 import { I18N } from "@Component/Localization/Localization";
 import "./HeaderBar.scss";
 
@@ -79,22 +79,41 @@ class HeaderFpsView extends Component<IMixinStatusProps & IMixinSettingProps, IH
     }
 }
 
-@useElectron
+@useElectronWithEvent("windowsSizeStateChange")
 class HeaderWindowsAction extends Component<IMixinElectronProps> {
 
     public render() {
+
+        const isMaxSize = this.props.electron?.isMaximized();
+
         return <Theme className="header-windows-action">
-            <div className="action-button">
+            <div
-                <Icon iconName="ChromeMinimize"/>
+                className="action-button"
+                onClick={() => {
+                    this.props.electron?.minimize();
+                }}
+            >
+                <Icon iconName="Remove"/>
             </div>
-            <div className="action-button">
+            <div
-                <Icon iconName="ChromeRestore"/>
+                className="action-button"
+                onClick={() => {
+                    if (isMaxSize) {
+                        this.props.electron?.unMaximize();
+                    } else {
+                        this.props.electron?.maximize();
+                    }
+                }}
+            >
+                <Icon iconName={ isMaxSize ? "ArrangeSendBackward" : "Checkbox"}/>
             </div>
             <div
                 className="action-button close-button"
-                onClick={() => this.props.electron?.close()}
+                onClick={() => {
+                    this.props.electron?.close()
+                }}
             >
-                <Icon iconName="ChromeClose"/>
+                <Icon iconName="Clear"/>
             </div>
         </Theme>
     }

source/Context/Electron.ts

@@ -1,12 +1,12 @@
 import { createContext } from "react";
-import { superConnect } from "@Context/Context";
+import { superConnect, superConnectWithEvent } from "@Context/Context";
-import { ISimulatorAPI } from "@Electron/SimulatorAPI";
+import { ISimulatorAPI, IApiEmitterEvent } from "@Electron/SimulatorAPI";
 
 interface IMixinElectronProps {
     electron?: ISimulatorAPI;
 }
 
-const ElectronContext = createContext<ISimulatorAPI>({} as ISimulatorAPI);
+const ElectronContext = createContext<ISimulatorAPI>((window as any).API ?? {} as ISimulatorAPI);
 
 ElectronContext.displayName = "Electron";
 const ElectronProvider = ElectronContext.Provider;
@@ -17,4 +17,6 @@ const ElectronConsumer = ElectronContext.Consumer;
  */
 const useElectron = superConnect<ISimulatorAPI>(ElectronConsumer, "electron");
 
-export { useElectron, ElectronProvider, IMixinElectronProps, ISimulatorAPI };
+const useElectronWithEvent = superConnectWithEvent<ISimulatorAPI, IApiEmitterEvent>(ElectronConsumer, "electron");
+
+export { useElectron, ElectronProvider, IMixinElectronProps, ISimulatorAPI, useElectronWithEvent };

source/Electron/Electron.ts

@@ -63,9 +63,32 @@ class ElectronApp {
 
 	private handelSimulatorWindowBehavior() {
 
-		ipcMain.on("close", () => {
+		ipcMain.on("windows.close", () => {
 			this.simulatorWindow?.close();
 		});
+
+		ipcMain.on("windows.maximize", () => {
+			this.simulatorWindow?.maximize();
+		});
+
+		ipcMain.on("windows.unMaximize", () => {
+			this.simulatorWindow?.unmaximize();
+		});
+
+		ipcMain.on("windows.isMaximized", (event) => {
+			event.returnValue = this.simulatorWindow?.isMaximized();
+		});
+
+		ipcMain.on("windows.minimize", (event) => {
+			this.simulatorWindow?.minimize();
+		});
+
+		const sendWindowsChangeMessage = () => {
+			this.simulatorWindow?.webContents.send("windows.windowsSizeStateChange");
+		}
+
+		this.simulatorWindow?.on("maximize", sendWindowsChangeMessage);
+		this.simulatorWindow?.on("unmaximize", sendWindowsChangeMessage);
 	}
 }
 

source/Electron/SimulatorAPI.ts

@@ -1,5 +1,10 @@
+import { Emitter } from "@Model/Emitter";
 
-interface ISimulatorAPI {
+type IApiEmitterEvent = {
+	windowsSizeStateChange: void;
+}
+
+interface ISimulatorAPI extends Emitter<IApiEmitterEvent> {
 
 	/**
 	 * 关闭窗口
@@ -20,6 +25,11 @@ interface ISimulatorAPI {
 	 * 是否处于最大化状态
 	 */
 	isMaximized: () => boolean;
+
+	/**
+	 * 是否处于最大化状态
+	 */
+	minimize: () => void;
 }
 
-export { ISimulatorAPI }
+export { ISimulatorAPI, IApiEmitterEvent }

source/Electron/SimulatorWindow.ts

@@ -1,19 +1,64 @@
 import { contextBridge, ipcRenderer } from "electron";
 import { ISimulatorAPI } from "@Electron/SimulatorAPI"
 
-const API: ISimulatorAPI = {
+const emitterMap: Array<[key: string, value: Function[]]> = [];
+const queryEmitter = (key: string) => {
+	let res: (typeof emitterMap)[0] | undefined;
+	emitterMap.forEach((item) => {
+		if (item[0] === key) res = item;
+	});
 
-	close() {
+	if (res) {
-		ipcRenderer.send("close");
+		if (Array.isArray(res[1])) return res[1];
-	},
+		res[1] = [];
+		return res[1];
+	}
 
-	maximize(){},
+	else {
- 
+		res = [key, []];
-	unMaximize(){},
+		emitterMap.push(res);
- 
+		return res[1];
-	isMaximized(){
-		return false
 	}
 }
 
+const API: ISimulatorAPI = {
+	
+	close() {
+		ipcRenderer.send("windows.close");
+	},
+
+	maximize() {
+		ipcRenderer.send("windows.maximize");
+	},
+
+	unMaximize() {
+		ipcRenderer.send("windows.unMaximize");
+	},
+
+	isMaximized() {
+		return ipcRenderer.sendSync("windows.isMaximized");
+	},
+
+	minimize() {
+		ipcRenderer.send("windows.minimize");
+	},
+
+	all: new Map() as any,
+
+	resetAll: () => emitterMap.splice(0),
+	reset: (type) => queryEmitter(type).splice(0),
+	on: (type, handler) => queryEmitter(type).push(handler),
+	off: (type, handler) => {
+		const handlers = queryEmitter(type);
+		handlers.splice(handlers.indexOf(handler!) >>> 0, 1);
+	},
+	emit: ((type: string, evt: any) => {
+		queryEmitter(type).slice().map((handler: any) => { handler(evt) });
+	}) as any,
+}
+
+ipcRenderer.on("windows.windowsSizeStateChange", () => {
+	API.emit("windowsSizeStateChange");
+});
+
 contextBridge.exposeInMainWorld("API", API);