override navbar with desktopnavbar

This commit is contained in:
Godwin Asuquo 2023-02-23 16:03:20 +02:00
parent c41b6b7f89
commit d5e9982e91
4 changed files with 87 additions and 84 deletions

View file

@ -35,7 +35,7 @@ abstract class BasePage extends StatelessWidget {
Widget? get endDrawer => null;
bool get canUseDesktopAppBar => false;
PreferredSizeWidget? desktopAppBar(BuildContext context) => null;
AppBarStyle get appBarStyle => AppBarStyle.regular;
@ -99,7 +99,6 @@ abstract class BasePage extends StatelessWidget {
ObstructingPreferredSizeWidget appBar(BuildContext context) {
final appBarColor = currentTheme.type == ThemeType.dark
? backgroundDarkColor : backgroundLightColor;
final useDesktopAppbar = !ResponsiveLayoutUtil.instance.isMobile(context) && canUseDesktopAppBar;
switch (appBarStyle) {
case AppBarStyle.regular:
@ -109,7 +108,6 @@ abstract class BasePage extends StatelessWidget {
leading: leading(context),
middle: middle(context),
trailing: trailing(context),
useDesktopAppbar: useDesktopAppbar,
backgroundColor: appBarColor);
case AppBarStyle.withShadow:
@ -119,7 +117,6 @@ abstract class BasePage extends StatelessWidget {
leading: leading(context),
middle: middle(context),
trailing: trailing(context),
useDesktopAppbar: useDesktopAppbar,
backgroundColor: appBarColor);
case AppBarStyle.transparent:
@ -137,7 +134,6 @@ abstract class BasePage extends StatelessWidget {
// context: context,
leading: leading(context),
middle: middle(context),
useDesktopAppbar: useDesktopAppbar,
trailing: trailing(context),
backgroundColor: appBarColor);
}
@ -156,7 +152,7 @@ abstract class BasePage extends StatelessWidget {
resizeToAvoidBottomInset: resizeToAvoidBottomInset,
extendBodyBehindAppBar: extendBodyBehindAppBar,
endDrawer: endDrawer,
appBar: appBar(context),
appBar: desktopAppBar(context) ?? appBar(context),
body: body(context),
floatingActionButton: floatingActionButton(context));

View file

@ -6,7 +6,7 @@ import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_sideba
import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu_item.dart';
import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_wallet_selection_dropdown.dart';
import 'package:cake_wallet/src/screens/dashboard/widgets/sync_indicator.dart';
import 'package:cake_wallet/themes/theme_base.dart';
import 'package:cake_wallet/src/widgets/desktop_nav_bar.dart';
import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
import 'package:cake_wallet/view_model/dashboard/desktop_sidebar_view_model.dart';
import 'package:flutter/material.dart';
@ -26,14 +26,47 @@ class DesktopSidebarWrapper extends BasePage {
});
@override
bool get canUseDesktopAppBar => true;
PreferredSizeWidget desktopAppBar(BuildContext context) => DesktopNavbar(
leading: Padding(
padding: EdgeInsets.only(left: sideMenuWidth),
child: getIt<DesktopWalletSelectionDropDown>(),
),
middle: SyncIndicator(
dashboardViewModel: dashboardViewModel,
onTap: () => Navigator.of(context, rootNavigator: true).pushNamed(Routes.connectionSync),
),
trailing: InkWell(
onTap: () {
String? currentPath;
@override
Color get backgroundLightColor =>
currentTheme.type == ThemeType.bright ? Colors.transparent : Colors.white;
DesktopDashboardPage.desktopKey.currentState?.popUntil((route) {
currentPath = route.settings.name;
return true;
});
@override
Color get backgroundDarkColor => Colors.black.withOpacity(0.1);
switch (currentPath) {
case Routes.transactionsPage:
desktopSidebarViewModel.resetSidebar();
break;
default:
desktopSidebarViewModel.resetSidebar();
Future.delayed(Duration(milliseconds: 10), () {
desktopSidebarViewModel.onPageChange(SidebarItem.transactions);
DesktopDashboardPage.desktopKey.currentState?.pushNamed(Routes.transactionsPage);
});
}
},
child: Observer(
builder: (_) {
return Image.asset(
desktopSidebarViewModel.currentPage == SidebarItem.transactions
? selectedIconPath
: unselectedIconPath,
);
},
),
),
);
@override
bool get resizeToAvoidBottomInset => false;
@ -62,54 +95,6 @@ class DesktopSidebarWrapper extends BasePage {
child: scaffold,
);
@override
Widget? leading(BuildContext context) => Padding(
padding: EdgeInsets.only(left: sideMenuWidth),
child: getIt<DesktopWalletSelectionDropDown>(),
);
@override
Widget middle(BuildContext context) {
return SyncIndicator(
dashboardViewModel: dashboardViewModel,
onTap: () => Navigator.of(context, rootNavigator: true).pushNamed(Routes.connectionSync));
}
@override
Widget trailing(BuildContext context) {
return InkWell(
onTap: () {
String? currentPath;
DesktopDashboardPage.desktopKey.currentState?.popUntil((route) {
currentPath = route.settings.name;
return true;
});
switch (currentPath) {
case Routes.transactionsPage:
desktopSidebarViewModel.resetSidebar();
break;
default:
desktopSidebarViewModel.resetSidebar();
Future.delayed(Duration(milliseconds: 10), () {
desktopSidebarViewModel.onPageChange(SidebarItem.transactions);
DesktopDashboardPage.desktopKey.currentState?.pushNamed(Routes.transactionsPage);
});
}
},
child: Observer(
builder: (_) {
return Image.asset(
desktopSidebarViewModel.currentPage == SidebarItem.transactions
? selectedIconPath
: unselectedIconPath,
);
},
),
);
}
@override
Widget body(BuildContext context) {
reaction<SidebarItem>((_) => desktopSidebarViewModel.currentPage, (page) {

View file

@ -0,0 +1,44 @@
import 'package:cake_wallet/di.dart';
import 'package:cake_wallet/store/settings_store.dart';
import 'package:cake_wallet/themes/theme_base.dart';
import 'package:flutter/material.dart';
class DesktopNavbar extends StatelessWidget implements PreferredSizeWidget {
final Widget leading;
final Widget middle;
final Widget trailing;
DesktopNavbar({
super.key,
required this.leading,
required this.middle,
required this.trailing,
});
ThemeBase get currentTheme => getIt.get<SettingsStore>().currentTheme;
@override
Widget build(BuildContext context) {
final appBarColor =
currentTheme.type == ThemeType.dark ? Colors.black.withOpacity(0.1) : Colors.white;
return Container(
padding: const EdgeInsetsDirectional.only(end: 24),
color: appBarColor,
child: Center(
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Flexible(child: leading),
middle,
trailing,
],
),
),
);
}
@override
Size get preferredSize => Size.fromHeight(60);
}

View file

@ -7,7 +7,6 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget {
middle: middle,
trailing: trailing,
height: _height,
useDesktopAppbar: useDesktopAppbar,
backgroundColor: backgroundColor);
}
@ -18,7 +17,6 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget {
middle: middle,
trailing: trailing,
height: 80,
useDesktopAppbar: useDesktopAppbar,
backgroundColor: backgroundColor,
decoration: BoxDecoration(
color: backgroundColor,
@ -39,7 +37,6 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget {
this.trailing,
this.backgroundColor,
this.decoration,
this.useDesktopAppbar = false,
this.height = _height});
static const _originalHeight = 44.0; // iOS nav bar height
@ -51,7 +48,6 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget {
final Color? backgroundColor;
final BoxDecoration? decoration;
final double height;
final bool useDesktopAppbar;
@override
Widget build(BuildContext context) {
@ -63,24 +59,6 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget {
final paddingTop = pad / 2;
final _paddingBottom = (pad / 2);
if (useDesktopAppbar) {
return Container(
padding: const EdgeInsetsDirectional.only(end: 24),
color: backgroundColor,
child: Center(
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
if (leading != null) Flexible(child: leading!) else const SizedBox(),
if (middle != null) middle!,
trailing ?? const SizedBox(),
],
),
),
);
}
return Container(
decoration: decoration ?? BoxDecoration(color: backgroundColor),
padding: EdgeInsetsDirectional.only(bottom: _paddingBottom, top: paddingTop),