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