mirror of
https://github.com/gabehf/Fladder.git
synced 2026-03-07 21:48:14 -08:00
fix(Desktop): Small improvement to padding and titlebar
This commit is contained in:
PartyDonut
parent
3b4b8a9101
commit
4371368fda
3 changed files with 125 additions and 109 deletions
|
|
@ -16,6 +16,8 @@ class DefaultTitleBar extends ConsumerStatefulWidget {
|
|||
}
|
||||
|
||||
class _DefaultTitleBarState extends ConsumerState<DefaultTitleBar> with WindowListener {
|
||||
bool hovering = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
windowManager.addListener(this);
|
||||
|
|
@ -40,135 +42,149 @@ class _DefaultTitleBarState extends ConsumerState<DefaultTitleBar> with WindowLi
|
|||
]
|
||||
: <BoxShadow>[];
|
||||
final iconColor = Theme.of(context).colorScheme.onSurface.withValues(alpha: 0.65);
|
||||
return SizedBox(
|
||||
height: widget.height,
|
||||
child: switch (AdaptiveLayout.of(context).platform) {
|
||||
TargetPlatform.android || TargetPlatform.iOS => SizedBox(height: MediaQuery.paddingOf(context).top),
|
||||
TargetPlatform.windows || TargetPlatform.linux => Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Container(
|
||||
color: Colors.black.withValues(alpha: 0),
|
||||
child: DragToMoveArea(
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.only(left: 16),
|
||||
child: DefaultTextStyle(
|
||||
style: TextStyle(
|
||||
color: iconColor,
|
||||
fontSize: 14,
|
||||
return MouseRegion(
|
||||
onEnter: (event) => setState(() => hovering = true),
|
||||
onExit: (event) => setState(() => hovering = false),
|
||||
child: AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 250),
|
||||
decoration: BoxDecoration(
|
||||
color: hovering ? Colors.black.withValues(alpha: 0.15) : Colors.transparent,
|
||||
),
|
||||
height: widget.height,
|
||||
child: switch (AdaptiveLayout.of(context).platform) {
|
||||
TargetPlatform.android || TargetPlatform.iOS => SizedBox(height: MediaQuery.paddingOf(context).top),
|
||||
TargetPlatform.windows || TargetPlatform.linux => Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Container(
|
||||
color: Colors.black.withValues(alpha: 0),
|
||||
child: DragToMoveArea(
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
mainAxisSize: MainAxisSize.max,
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.only(left: 16),
|
||||
child: DefaultTextStyle(
|
||||
style: TextStyle(
|
||||
color: iconColor,
|
||||
fontSize: 14,
|
||||
),
|
||||
child: Text(widget.label ?? ""),
|
||||
),
|
||||
child: Text(widget.label ?? ""),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Row(
|
||||
children: [
|
||||
FutureBuilder(
|
||||
future: windowManager.isMinimizable(),
|
||||
builder: (context, data) {
|
||||
final isMinimized = !(data.data ?? false);
|
||||
return IconButton(
|
||||
style: IconButton.styleFrom(
|
||||
hoverColor: brightness == Brightness.light
|
||||
? Colors.black.withValues(alpha: 0.1)
|
||||
: Colors.white.withValues(alpha: 0.2),
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(2))),
|
||||
onPressed: () async {
|
||||
if (isMinimized) {
|
||||
windowManager.restore();
|
||||
} else {
|
||||
windowManager.minimize();
|
||||
}
|
||||
},
|
||||
icon: Transform.translate(
|
||||
offset: const Offset(0, -2),
|
||||
child: Icon(
|
||||
Icons.minimize_rounded,
|
||||
color: iconColor,
|
||||
size: 20,
|
||||
shadows: shadows,
|
||||
),
|
||||
),
|
||||
);
|
||||
}),
|
||||
FutureBuilder<List<bool>>(
|
||||
future: Future.microtask(() async {
|
||||
final isMaximized = await windowManager.isMaximized();
|
||||
Row(
|
||||
children: [
|
||||
FutureBuilder<List<bool>>(future: Future.microtask(() async {
|
||||
final isMinimized = await windowManager.isMinimized();
|
||||
final isFullScreen = await windowManager.isFullScreen();
|
||||
return [isMaximized, isFullScreen];
|
||||
}),
|
||||
builder: (BuildContext context, AsyncSnapshot<List<bool>> snapshot) {
|
||||
final maximized = snapshot.data?.firstOrNull ?? false;
|
||||
return [isMinimized, isFullScreen];
|
||||
}), builder: (context, snapshot) {
|
||||
final isMinimized = snapshot.data?.firstOrNull ?? false;
|
||||
final fullScreen = snapshot.data?.lastOrNull ?? false;
|
||||
return IconButton(
|
||||
style: IconButton.styleFrom(
|
||||
hoverColor: brightness == Brightness.light
|
||||
? Colors.black.withValues(alpha: 0.1)
|
||||
: Colors.white.withValues(alpha: 0.2),
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(2)),
|
||||
),
|
||||
hoverColor: brightness == Brightness.light
|
||||
? Colors.black.withValues(alpha: 0.1)
|
||||
: Colors.white.withValues(alpha: 0.2),
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(2))),
|
||||
onPressed: () async {
|
||||
if (fullScreen && maximized) {
|
||||
await windowManager.setFullScreen(false);
|
||||
await windowManager.unmaximize();
|
||||
return;
|
||||
}
|
||||
|
||||
if (fullScreen) {
|
||||
await windowManager.setFullScreen(false);
|
||||
} else if (!maximized) {
|
||||
await windowManager.maximize();
|
||||
}
|
||||
if (isMinimized) {
|
||||
windowManager.restore();
|
||||
} else {
|
||||
await windowManager.unmaximize();
|
||||
windowManager.minimize();
|
||||
}
|
||||
},
|
||||
icon: Transform.translate(
|
||||
offset: const Offset(0, 0),
|
||||
offset: const Offset(0, -2),
|
||||
child: Icon(
|
||||
maximized ? Icons.maximize_rounded : Icons.crop_square_rounded,
|
||||
Icons.minimize_rounded,
|
||||
color: iconColor,
|
||||
size: 19,
|
||||
size: 20,
|
||||
shadows: shadows,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
IconButton(
|
||||
style: IconButton.styleFrom(
|
||||
hoverColor: Colors.red,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(2),
|
||||
}),
|
||||
FutureBuilder<List<bool>>(
|
||||
future: Future.microtask(() async {
|
||||
final isMaximized = await windowManager.isMaximized();
|
||||
final isFullScreen = await windowManager.isFullScreen();
|
||||
return [isMaximized, isFullScreen];
|
||||
}),
|
||||
builder: (BuildContext context, AsyncSnapshot<List<bool>> snapshot) {
|
||||
final maximized = snapshot.data?.firstOrNull ?? false;
|
||||
final fullScreen = snapshot.data?.lastOrNull ?? false;
|
||||
return IconButton(
|
||||
style: IconButton.styleFrom(
|
||||
hoverColor: brightness == Brightness.light
|
||||
? Colors.black.withValues(alpha: 0.1)
|
||||
: Colors.white.withValues(alpha: 0.2),
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(2)),
|
||||
),
|
||||
onPressed: () async {
|
||||
if (fullScreen && maximized) {
|
||||
await windowManager.setFullScreen(false);
|
||||
await windowManager.unmaximize();
|
||||
return;
|
||||
}
|
||||
|
||||
if (fullScreen) {
|
||||
await windowManager.setFullScreen(false);
|
||||
} else if (!maximized) {
|
||||
await windowManager.maximize();
|
||||
} else {
|
||||
await windowManager.unmaximize();
|
||||
}
|
||||
},
|
||||
icon: Transform.translate(
|
||||
offset: const Offset(0, 0),
|
||||
child: Icon(
|
||||
maximized ? Icons.maximize_rounded : Icons.crop_square_rounded,
|
||||
color: iconColor,
|
||||
size: 19,
|
||||
shadows: shadows,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
IconButton(
|
||||
style: IconButton.styleFrom(
|
||||
hoverColor: Colors.red,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(2),
|
||||
),
|
||||
),
|
||||
onPressed: () async {
|
||||
windowManager.close();
|
||||
},
|
||||
icon: Transform.translate(
|
||||
offset: const Offset(0, -2),
|
||||
child: Icon(
|
||||
Icons.close_rounded,
|
||||
color: iconColor,
|
||||
size: 23,
|
||||
shadows: shadows,
|
||||
),
|
||||
),
|
||||
),
|
||||
onPressed: () async {
|
||||
windowManager.close();
|
||||
},
|
||||
icon: Transform.translate(
|
||||
offset: const Offset(0, -2),
|
||||
child: Icon(
|
||||
Icons.close_rounded,
|
||||
color: iconColor,
|
||||
size: 23,
|
||||
shadows: shadows,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
TargetPlatform.macOS => const SizedBox.shrink(),
|
||||
_ => Text(widget.label ?? "Fladder"),
|
||||
},
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
TargetPlatform.macOS => const SizedBox.shrink(),
|
||||
_ => Text(widget.label ?? "Fladder"),
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue