fix dashboard sidebar and responsive utils

This commit is contained in:
Godwin Asuquo 2023-01-30 23:23:42 +02:00
parent 94184d69d6
commit deadc93a76
5 changed files with 175 additions and 152 deletions

View file

@ -10,6 +10,7 @@ import 'package:cake_wallet/routes.dart';
import 'package:cake_wallet/src/screens/yat_emoji_id.dart';
import 'package:cake_wallet/src/widgets/alert_with_one_action.dart';
import 'package:cake_wallet/themes/theme_base.dart';
import 'package:cake_wallet/utils/responsive_layout_util.dart';
import 'package:cake_wallet/utils/show_pop_up.dart';
import 'package:flutter/material.dart';
import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
@ -42,8 +43,8 @@ class DashboardPage extends StatefulWidget {
}
class _DashboardPageState extends State<DashboardPage> {
PageController page = PageController();
SideMenuController sideMenu = SideMenuController();
final page = PageController();
final sideMenu = SideMenuController();
@override
void initState() {
sideMenu.addListener((p0) {
@ -54,16 +55,22 @@ class _DashboardPageState extends State<DashboardPage> {
@override
Widget build(BuildContext context) {
if (ResponsiveLayoutUtil.instance.isMobile(context)) {
return Scaffold(
body: LayoutBuilder(builder: (context, constraints) {
if (constraints.maxWidth > 900) {
return Container(
body: _DashboardPage(
balancePage: widget.balancePage,
walletViewModel: widget.walletViewModel,
addressListViewModel: widget.addressListViewModel,
),
);
}
return Scaffold(
body: Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Expanded(
flex: 1,
child: SideMenu(
SideMenu(
controller: sideMenu,
topItems: [
SideMenuItem(
@ -91,9 +98,7 @@ class _DashboardPageState extends State<DashboardPage> {
),
],
),
),
Expanded(
flex: 9,
child: PageView(
controller: page,
physics: NeverScrollableScrollPhysics(),
@ -107,11 +112,9 @@ class _DashboardPageState extends State<DashboardPage> {
child: Navigator(
initialRoute: Routes.support,
onGenerateRoute: (settings) => Router.createRoute(settings),
onGenerateInitialRoutes:
(NavigatorState navigator, String initialRouteName) {
onGenerateInitialRoutes: (NavigatorState navigator, String initialRouteName) {
return [
navigator
.widget.onGenerateRoute!(RouteSettings(name: initialRouteName))!
navigator.widget.onGenerateRoute!(RouteSettings(name: initialRouteName))!
];
},
),
@ -119,26 +122,18 @@ class _DashboardPageState extends State<DashboardPage> {
Navigator(
initialRoute: Routes.desktop_settings_page,
onGenerateRoute: (settings) => Router.createRoute(settings),
onGenerateInitialRoutes:
(NavigatorState navigator, String initialRouteName) {
onGenerateInitialRoutes: (NavigatorState navigator, String initialRouteName) {
return [
navigator
.widget.onGenerateRoute!(RouteSettings(name: initialRouteName))!
navigator.widget.onGenerateRoute!(RouteSettings(name: initialRouteName))!
];
},
),
]),
],
),
)
],
),
);
}
return _DashboardPage(
balancePage: widget.balancePage,
walletViewModel: widget.walletViewModel,
addressListViewModel: widget.addressListViewModel);
}),
),
);
}
}
@ -211,14 +206,13 @@ class _DashboardPage extends BasePage {
@override
Widget body(BuildContext context) {
_setEffects(context);
if (!ResponsiveLayoutUtil.instance.isMobile(context)) {
return DesktopDashboardView(balancePage);
}
return SafeArea(
minimum: EdgeInsets.only(bottom: 24),
child: LayoutBuilder(builder: (context, constraints) {
if (constraints.maxWidth > 900) {
return DesktopDashboardView(balancePage);
}
return Column(
child: Column(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Expanded(
@ -237,10 +231,8 @@ class _DashboardPage extends BasePage {
dotWidth: 6.0,
dotHeight: 6.0,
dotColor: Theme.of(context).indicatorColor,
activeDotColor: Theme.of(context)
.accentTextTheme!
.headline4!
.backgroundColor!),
activeDotColor:
Theme.of(context).accentTextTheme!.headline4!.backgroundColor!),
)),
Observer(builder: (_) {
return ClipRect(
@ -277,8 +269,7 @@ class _DashboardPage extends BasePage {
.headline3!
.backgroundColor!),
title: action.name(context),
onClick: () async =>
await action.onTap(context, walletViewModel),
onClick: () async => await action.onTap(context, walletViewModel),
textColor: action.isEnabled?.call(walletViewModel) ?? true
? null
: Theme.of(context)
@ -294,8 +285,7 @@ class _DashboardPage extends BasePage {
);
}),
],
);
}));
));
}
void _setEffects(BuildContext context) async {

View file

@ -19,7 +19,7 @@ class SideMenu extends StatelessWidget {
SideMenuGlobal.controller = controller;
return Container(
color: Colors.black.withOpacity(0.1),
width: double.infinity,
width: 76,
height: MediaQuery.of(context).size.height,
child: Column(
children: [

View file

@ -19,7 +19,7 @@ class DesktopSettingsPage extends StatefulWidget {
class _DesktopSettingsPageState extends State<DesktopSettingsPage> {
int itemCount = 0;
SideMenuController sideMenu = SideMenuController();
int currentPage = 0;
int? currentPage;
bool isTapped = false;
initState() {
@ -66,10 +66,12 @@ class _DesktopSettingsPageState extends State<DesktopSettingsPage> {
isSelected: currentPage == index,
isArrowVisible: true,
onTap: () {
if (currentPage != index) {
final settingContext =
_settingsNavigatorKey.currentState?.context ?? context;
sideMenu.changePage(index);
WalletMenu.action(index, settingContext);
}
},
image: image,
title: title,

View file

@ -35,8 +35,9 @@ class SettingActionButton extends StatelessWidget {
: selectionActive
? Palette.darkBlue
: Theme.of(context).textTheme.headline3!.color;
return GestureDetector(
return InkWell(
onTap: onTap,
hoverColor: Colors.transparent,
child: Container(
height: isLastTile ? headerHeight : tileHeight,
padding: isLastTile

View file

@ -0,0 +1,30 @@
import 'package:flutter/material.dart';
class ResponsiveLayoutUtil {
static const double _kMobileThreshold = 900;
const ResponsiveLayoutUtil._();
static final instance = ResponsiveLayoutUtil._();
bool isMobile(BuildContext context) {
final MediaQueryData mediaQueryData = MediaQuery.of(context);
return mediaQueryData.size.width < _kMobileThreshold;
}
/// Returns dynamic size.
///
/// If screen size is mobile, it returns 66% ([scale]) of the [originalValue].
double getDynamicSize(
BuildContext context,
double originalValue, {
double? mobileSize,
double? scale,
}) {
scale ??= 2 / 3;
mobileSize ??= originalValue * scale;
final value = isMobile(context) ? mobileSize : originalValue;
return value.roundToDouble();
}
}