feature: Cleaned up app bar

This commit is contained in:
PartyDonut 2025-07-30 18:54:54 +02:00
parent 79310c7bf4
commit a9cdd5c506
7 changed files with 59 additions and 69 deletions

View file

@ -107,15 +107,12 @@ class _DashboardScreenState extends ConsumerState<DashboardScreen> {
), ),
if (homeBanner && homeCarouselItems.isNotEmpty) ...{ if (homeBanner && homeCarouselItems.isNotEmpty) ...{
SliverToBoxAdapter( SliverToBoxAdapter(
child: Transform.translate( child: Padding(
offset: Offset(0, AdaptiveLayout.layoutOf(context) == ViewSize.phone ? -14 : 0), padding: AdaptiveLayout.adaptivePadding(
child: Padding( context,
padding: AdaptiveLayout.adaptivePadding( horizontalPadding: 0,
context,
horizontalPadding: 0,
),
child: HomeBannerWidget(posters: homeCarouselItems),
), ),
child: HomeBannerWidget(posters: homeCarouselItems),
), ),
), ),
}, },

View file

@ -38,7 +38,6 @@ class FavouritesScreen extends ConsumerWidget {
slivers: [ slivers: [
if (AdaptiveLayout.viewSizeOf(context) == ViewSize.phone) if (AdaptiveLayout.viewSizeOf(context) == ViewSize.phone)
NestedSliverAppBar( NestedSliverAppBar(
searchTitle: "${context.localized.search} ${context.localized.favorites.toLowerCase()}...",
parent: context, parent: context,
route: LibrarySearchRoute(favourites: true), route: LibrarySearchRoute(favourites: true),
) )

View file

@ -108,6 +108,13 @@ class HomeScreen extends ConsumerWidget {
selectedIcon: Icon(e.selectedIcon), selectedIcon: Icon(e.selectedIcon),
route: const LibraryRoute(), route: const LibraryRoute(),
action: () => e.navigate(context), action: () => e.navigate(context),
floatingActionButton: AdaptiveFab(
context: context,
title: context.localized.search,
key: Key(e.name.capitalize()),
onPressed: () => context.router.navigate(LibrarySearchRoute()),
child: const Icon(IconsaxPlusLinear.search_status),
),
); );
} }
}) })

View file

@ -38,14 +38,13 @@ class _DefaultTitleBarState extends ConsumerState<DefaultTitleBar> with WindowLi
if (ref.watch(argumentsStateProvider.select((value) => value.htpcMode))) return const SizedBox.shrink(); if (ref.watch(argumentsStateProvider.select((value) => value.htpcMode))) return const SizedBox.shrink();
final brightness = widget.brightness ?? Theme.of(context).brightness; final brightness = widget.brightness ?? Theme.of(context).brightness;
final iconColor = Theme.of(context).colorScheme.onSurface.withValues(alpha: 0.65); final iconColor = Theme.of(context).colorScheme.onSurface.withValues(alpha: 0.65);
final surfaceColor = Theme.of(context).colorScheme.surface;
return MouseRegion( return MouseRegion(
onEnter: (event) => setState(() => hovering = true), onEnter: (event) => setState(() => hovering = true),
onExit: (event) => setState(() => hovering = false), onExit: (event) => setState(() => hovering = false),
child: AnimatedContainer( child: AnimatedContainer(
duration: const Duration(milliseconds: 250), duration: const Duration(milliseconds: 250),
decoration: BoxDecoration( color: surfaceColor.withValues(alpha: hovering ? 0.15 : 0),
color: hovering ? Colors.black.withValues(alpha: 0.15) : Colors.transparent,
),
height: widget.height, height: widget.height,
child: kIsWeb child: kIsWeb
? const SizedBox.shrink() ? const SizedBox.shrink()

View file

@ -4,77 +4,62 @@ import 'package:auto_route/auto_route.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:iconsax_plus/iconsax_plus.dart'; import 'package:iconsax_plus/iconsax_plus.dart';
import 'package:fladder/util/localization_helper.dart';
import 'package:fladder/widgets/navigation_scaffold/components/settings_user_icon.dart'; import 'package:fladder/widgets/navigation_scaffold/components/settings_user_icon.dart';
import 'package:fladder/widgets/shared/shapes.dart';
class NestedSliverAppBar extends ConsumerWidget { class NestedSliverAppBar extends ConsumerWidget {
final BuildContext parent; final BuildContext parent;
final String? searchTitle;
final PageRouteInfo? route; final PageRouteInfo? route;
const NestedSliverAppBar({required this.parent, this.route, this.searchTitle, super.key}); const NestedSliverAppBar({required this.parent, this.route, super.key});
@override @override
Widget build(BuildContext context, WidgetRef ref) { Widget build(BuildContext context, WidgetRef ref) {
final surfaceColor = Theme.of(context).colorScheme.surface;
final buttonStyle = Theme.of(context).filledButtonTheme.style?.copyWith(
backgroundColor: WidgetStatePropertyAll(
surfaceColor.withValues(alpha: 0.8),
),
);
return SliverAppBar( return SliverAppBar(
automaticallyImplyLeading: false, automaticallyImplyLeading: false,
elevation: 16, elevation: 0,
forceElevated: true, forceElevated: false,
surfaceTintColor: Colors.transparent, surfaceTintColor: Colors.transparent,
shadowColor: Colors.transparent, shadowColor: Colors.transparent,
backgroundColor: Theme.of(context).colorScheme.surface, backgroundColor: Colors.transparent,
shape: AppBarShape(), flexibleSpace: Container(
title: SizedBox( decoration: BoxDecoration(
height: 65, gradient: LinearGradient(
colors: [
surfaceColor.withValues(alpha: 0.7),
surfaceColor.withValues(alpha: 0),
],
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
)),
child: Padding( child: Padding(
padding: const EdgeInsets.only(bottom: 24), padding: MediaQuery.paddingOf(context).copyWith(bottom: 0),
child: Row( child: Padding(
crossAxisAlignment: CrossAxisAlignment.stretch, padding: const EdgeInsets.all(14),
spacing: 10, child: SizedBox(
children: [ height: 50,
SizedBox( child: Row(
width: 30, crossAxisAlignment: CrossAxisAlignment.stretch,
child: IconButton( spacing: 12,
onPressed: () => Scaffold.of(parent).openDrawer(), children: [
icon: const Icon(IconsaxPlusLinear.menu), AspectRatio(
padding: EdgeInsets.zero, aspectRatio: 1.0,
), child: IconButton.filledTonal(
), style: buttonStyle,
Expanded( onPressed: () => Scaffold.of(parent).openDrawer(),
child: Hero( icon: const Icon(IconsaxPlusLinear.menu),
tag: "PrimarySearch", padding: EdgeInsets.zero,
child: Card(
elevation: 3,
shadowColor: Colors.transparent,
child: InkWell(
onTap: route != null
? () {
route?.push(context);
}
: null,
child: Padding(
padding: const EdgeInsets.all(10),
child: Opacity(
opacity: 0.65,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
const Icon(IconsaxPlusLinear.search_normal),
const SizedBox(width: 16),
Transform.translate(
offset: const Offset(0, 1.5),
child: Text(searchTitle ?? "${context.localized.search}..."),
),
],
),
),
),
), ),
), ),
), const Spacer(),
const SettingsUserIcon()
],
), ),
const SettingsUserIcon() ),
],
), ),
), ),
), ),

View file

@ -47,7 +47,6 @@ class _SyncedScreenState extends ConsumerState<SyncedScreen> {
slivers: [ slivers: [
if (AdaptiveLayout.viewSizeOf(context) == ViewSize.phone) if (AdaptiveLayout.viewSizeOf(context) == ViewSize.phone)
NestedSliverAppBar( NestedSliverAppBar(
searchTitle: "${context.localized.search} ...",
parent: context, parent: context,
route: LibrarySearchRoute(), route: LibrarySearchRoute(),
) )

View file

@ -85,7 +85,11 @@ class _SideNavigationBarState extends ConsumerState<SideNavigationBar> {
child: (context) => widget.child, child: (context) => widget.child,
), ),
Container( Container(
color: Theme.of(context).colorScheme.surface.withValues(alpha: shouldExpand ? 0.95 : 0.85), decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12)
.copyWith(topLeft: const Radius.circular(0), bottomLeft: const Radius.circular(0)),
color: Theme.of(context).colorScheme.surface.withValues(alpha: shouldExpand ? 0.95 : 0.85),
),
width: shouldExpand ? expandedWidth : collapsedWidth, width: shouldExpand ? expandedWidth : collapsedWidth,
child: MouseRegion( child: MouseRegion(
onEnter: (value) => startTimer(), onEnter: (value) => startTimer(),