Change desktop version to use the original style of navigation, keep using drawer for mobile devices. Flutter is so cool!! :)
This commit is contained in:
parent
cc33458457
commit
d77e732551
@ -1,5 +1,6 @@
|
|||||||
// Flutter
|
// Flutter
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'dart:io';
|
||||||
|
|
||||||
// Local
|
// Local
|
||||||
import '/pages/expense.dart';
|
import '/pages/expense.dart';
|
||||||
@ -67,51 +68,71 @@ class _HomePageState extends State<HomePage> {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Widget navigation = NavigationRail(
|
||||||
|
extended: true,
|
||||||
|
destinations: [
|
||||||
|
NavigationRailDestination(
|
||||||
|
icon: Icon(Icons.payment),
|
||||||
|
label: Text('Expenses'),
|
||||||
|
),
|
||||||
|
NavigationRailDestination(
|
||||||
|
icon: Icon(Icons.account_balance),
|
||||||
|
label: Text('Income'),
|
||||||
|
),
|
||||||
|
NavigationRailDestination(
|
||||||
|
icon: Icon(Icons.attach_money),
|
||||||
|
label: Text('Liquid Assets'),
|
||||||
|
),
|
||||||
|
NavigationRailDestination(
|
||||||
|
icon: Icon(Icons.bar_chart),
|
||||||
|
label: Text('Reports'),
|
||||||
|
),
|
||||||
|
NavigationRailDestination(
|
||||||
|
icon: Icon(Icons.settings),
|
||||||
|
label: Text('Settings'),
|
||||||
|
),
|
||||||
|
NavigationRailDestination(
|
||||||
|
icon: Icon(Icons.help),
|
||||||
|
label: Text('Help'),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
selectedIndex: pageSelected,
|
||||||
|
onDestinationSelected: (value) {
|
||||||
|
setState(() {
|
||||||
|
pageSelected = value;
|
||||||
|
if (Platform.isAndroid || Platform.isIOS) {
|
||||||
|
Navigator.pop(context);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
Widget main = Container(
|
||||||
|
color: Theme.of(context).colorScheme.primaryContainer,
|
||||||
|
child: Center(child: page),
|
||||||
|
);
|
||||||
|
|
||||||
|
Widget? drawer, body;
|
||||||
|
if (Platform.isAndroid || Platform.isIOS) {
|
||||||
|
drawer = navigation;
|
||||||
|
body = main;
|
||||||
|
} else {
|
||||||
|
drawer = null;
|
||||||
|
body = Row(
|
||||||
|
children: [
|
||||||
|
SafeArea(child: navigation),
|
||||||
|
Expanded(child: main),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
return LayoutBuilder(builder: (context, constraints) {
|
return LayoutBuilder(builder: (context, constraints) {
|
||||||
return Scaffold(
|
return Scaffold(
|
||||||
appBar: AppBar(
|
appBar: AppBar(
|
||||||
title: Text("Expense Tracker"),
|
title: Text("Expense Tracker"),
|
||||||
),
|
),
|
||||||
drawer: NavigationRail(
|
drawer: drawer,
|
||||||
extended: true,
|
body: body,
|
||||||
destinations: [
|
|
||||||
NavigationRailDestination(
|
|
||||||
icon: Icon(Icons.payment),
|
|
||||||
label: Text('Expenses'),
|
|
||||||
),
|
|
||||||
NavigationRailDestination(
|
|
||||||
icon: Icon(Icons.account_balance),
|
|
||||||
label: Text('Income'),
|
|
||||||
),
|
|
||||||
NavigationRailDestination(
|
|
||||||
icon: Icon(Icons.attach_money),
|
|
||||||
label: Text('Liquid Assets'),
|
|
||||||
),
|
|
||||||
NavigationRailDestination(
|
|
||||||
icon: Icon(Icons.bar_chart),
|
|
||||||
label: Text('Reports'),
|
|
||||||
),
|
|
||||||
NavigationRailDestination(
|
|
||||||
icon: Icon(Icons.settings),
|
|
||||||
label: Text('Settings'),
|
|
||||||
),
|
|
||||||
NavigationRailDestination(
|
|
||||||
icon: Icon(Icons.help),
|
|
||||||
label: Text('Help'),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
selectedIndex: pageSelected,
|
|
||||||
onDestinationSelected: (value) {
|
|
||||||
setState(() {
|
|
||||||
pageSelected = value;
|
|
||||||
Navigator.pop(context);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
),
|
|
||||||
body: Container(
|
|
||||||
color: Theme.of(context).colorScheme.primaryContainer,
|
|
||||||
child: Center(child: page),
|
|
||||||
),
|
|
||||||
floatingActionButton: floatingButton,
|
floatingActionButton: floatingButton,
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
Loading…
x
Reference in New Issue
Block a user