feat: support drag and remove title bar on KDE

This commit is contained in:
Kevin Yue 2023-06-25 13:36:48 +08:00 committed by Kevin Yue
parent 5bc3da99ac
commit 4191e9a19f
8 changed files with 36 additions and 9 deletions

View File

@ -3,10 +3,15 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0" />
<title>Vite + React + TS</title> <title>Vite + React + TS</title>
</head> </head>
<body> <body data-tauri-drag-region>
<script>
var htmlFontSize = getComputedStyle(document.documentElement).fontSize;
var ratio = parseInt(htmlFontSize) / 16;
document.documentElement.style.fontSize = (16 / ratio) + 'px';
</script>
<div id="root"></div> <div id="root"></div>
<script type="module" src="/src/main.tsx"></script> <script type="module" src="/src/main.tsx"></script>
</body> </body>

View File

@ -44,6 +44,18 @@ fn setup(app: &mut tauri::App) -> Result<(), Box<dyn std::error::Error>> {
}); });
app.manage(client); app.manage(client);
match std::env::var("XDG_CURRENT_DESKTOP") {
Ok(desktop) => {
if desktop == "KDE" {
if let Some(main_window) = app.get_window("main") {
let _ = main_window.set_decorations(false);
}
}
}
Err(_) => (),
}
Ok(()) Ok(())
} }

View File

@ -68,11 +68,13 @@
}, },
"windows": [ "windows": [
{ {
"title": "GlobalProtect",
"label": "main",
"fullscreen": false, "fullscreen": false,
"width": 260,
"height": 360, "height": 360,
"resizable": false, "resizable": false,
"title": "GlobalProtect", "fileDropEnabled": false
"width": 260
} }
] ]
} }

View File

@ -41,7 +41,7 @@ export default function App() {
const ready = useAtomValue(statusReadyAtom); const ready = useAtomValue(statusReadyAtom);
return ( return (
<Box padding={2} paddingBottom={0}> <Box data-tauri-drag-region padding={2} paddingBottom={0}>
{ready ? <MainContent /> : <Loading />} {ready ? <MainContent /> : <Loading />}
<Notification /> <Notification />
</Box> </Box>

View File

@ -93,11 +93,17 @@ function InnerStatusIcon() {
return <DisconnectedIcon />; return <DisconnectedIcon />;
} }
const DragRegion = styled(Box)(({ theme }) => ({
position: "absolute",
inset: 0,
}));
export default function StatusIcon() { export default function StatusIcon() {
return ( return (
<IconContainer> <IconContainer>
<BackgroundIcon /> <BackgroundIcon />
<InnerStatusIcon /> <InnerStatusIcon />
<DragRegion data-tauri-drag-region />
</IconContainer> </IconContainer>
); );
} }

View File

@ -7,6 +7,7 @@ export default function StatusText() {
return ( return (
<Typography <Typography
data-tauri-drag-region
textAlign="center" textAlign="center"
mt={1.5} mt={1.5}
variant="subtitle1" variant="subtitle1"

View File

@ -4,7 +4,7 @@ import StatusText from "./StatusText";
export default function ConnectionStatus() { export default function ConnectionStatus() {
return ( return (
<Box> <Box data-tauri-drag-region>
<StatusIcon /> <StatusIcon />
<StatusText /> <StatusText />
</Box> </Box>

View File

@ -1,4 +1,4 @@
import { Alert, AlertTitle, Slide, SlideProps, Snackbar } from "@mui/material"; import { Alert, AlertTitle, Box, Slide, SlideProps, Snackbar } from "@mui/material";
import { useAtom, useAtomValue } from "jotai"; import { useAtom, useAtomValue } from "jotai";
import { import {
closeNotificationAtom, closeNotificationAtom,
@ -35,6 +35,7 @@ export default function Notification() {
}} }}
> >
<Alert <Alert
data-tauri-drag-region
severity={severity} severity={severity}
icon={false} icon={false}
sx={{ sx={{
@ -42,8 +43,8 @@ export default function Notification() {
borderRadius: 0, borderRadius: 0,
}} }}
> >
{title && <AlertTitle>{title}</AlertTitle>} {title && <AlertTitle data-tauri-drag-region>{title}</AlertTitle>}
{message} {message && <Box data-tauri-drag-region>{message}</Box>}
</Alert> </Alert>
</Snackbar> </Snackbar>
); );