fix: incorrect maximize status on custom windows controller (#5033)

* fix: windows controller

* chore: update style

* chore: update style
This commit is contained in:
oomeow
2025-10-12 20:51:25 +08:00
committed by GitHub
parent 8e5c150a4f
commit 1875e1b513
3 changed files with 58 additions and 27 deletions

View File

@@ -1,5 +1,5 @@
import { Close, CropSquare, FilterNone, Minimize } from "@mui/icons-material";
import { IconButton } from "@mui/material";
import { Box, IconButton } from "@mui/material";
import { forwardRef, useImperativeHandle } from "react";
import { useWindowControls } from "@/hooks/use-window";
@@ -40,7 +40,16 @@ export const WindowControls = forwardRef(function WindowControls(props, ref) {
// 这可能是上游缺陷,保险起见跨平台以窗口的最大化翻转为准
return (
<div style={{ display: "flex", gap: 4 }}>
<Box
sx={{
display: "flex",
gap: 1,
alignItems: "center",
"> button": {
cursor: "default",
},
}}
>
{OS === "macos" && (
<>
{/* macOS 风格:关闭 → 最小化 → 全屏 */}
@@ -67,22 +76,26 @@ export const WindowControls = forwardRef(function WindowControls(props, ref) {
{OS === "windows" && (
<>
{/* Windows 风格:最小化 → 最大化 → 关闭 */}
<IconButton size="small" sx={{ fontSize: 14 }} onClick={minimize}>
<Minimize fontSize="small" color="inherit" />
<IconButton size="small" sx={{ fontSize: 16 }} onClick={minimize}>
<Minimize fontSize="inherit" color="inherit" />
</IconButton>
<IconButton
size="small"
sx={{ fontSize: 14 }}
sx={{ fontSize: 16 }}
onClick={toggleMaximize}
>
{maximized ? (
<FilterNone fontSize="small" color="inherit" />
<FilterNone fontSize="inherit" color="inherit" />
) : (
<CropSquare fontSize="small" color="inherit" />
<CropSquare fontSize="inherit" color="inherit" />
)}
</IconButton>
<IconButton size="small" sx={{ fontSize: 14 }} onClick={close}>
<Close fontSize="small" color="inherit" />
<IconButton
size="small"
sx={{ fontSize: 16, ":hover": { bgcolor: "red", color: "white" } }}
onClick={close}
>
<Close fontSize="inherit" color="inherit" />
</IconButton>
</>
)}
@@ -90,25 +103,29 @@ export const WindowControls = forwardRef(function WindowControls(props, ref) {
{OS === "linux" && (
<>
{/* Linux 桌面常见布局GNOME/KDE 多为:最小化 → 最大化 → 关闭) */}
<IconButton size="small" sx={{ fontSize: 14 }} onClick={minimize}>
<Minimize fontSize="small" color="inherit" />
<IconButton size="small" sx={{ fontSize: 16 }} onClick={minimize}>
<Minimize fontSize="inherit" color="inherit" />
</IconButton>
<IconButton
size="small"
sx={{ fontSize: 14 }}
sx={{ fontSize: 16 }}
onClick={toggleMaximize}
>
{maximized ? (
<FilterNone fontSize="small" color="inherit" />
<FilterNone fontSize="inherit" color="inherit" />
) : (
<CropSquare fontSize="small" color="inherit" />
<CropSquare fontSize="inherit" color="inherit" />
)}
</IconButton>
<IconButton size="small" sx={{ fontSize: 14 }} onClick={close}>
<Close fontSize="small" color="inherit" />
<IconButton
size="small"
sx={{ fontSize: 16, ":hover": { bgcolor: "red", color: "white" } }}
onClick={close}
>
<Close fontSize="inherit" color="inherit" />
</IconButton>
</>
)}
</div>
</Box>
);
});