me/flutter-expense-tracker
me/flutter-expense-tracker
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases3 Wiki Activity

Finished drawer and also now showing expenses as they are added!

Browse Source
This commit is contained in:
Hyperling 2025-02-05 14:04:35 -07:00
parent 87392cc73c
commit ecbac615e9
2 changed files with 159 additions and 190 deletions

83
lib/main.dart

@ -41,6 +41,10 @@ class HomePage extends StatefulWidget {
class _HomePageState extends State<HomePage> { class _HomePageState extends State<HomePage> {
var pageSelected = 0; var pageSelected = 0;
refresh() {
setState(() {});
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
Widget page; Widget page;
@ -48,7 +52,9 @@ class _HomePageState extends State<HomePage> {
switch (pageSelected) { switch (pageSelected) {
case 0: case 0:
page = ExpensePage(); page = ExpensePage();
dialog = ExpenseInputDialog(); dialog = ExpenseInputDialog(
notifyParent: refresh,
);
case 1: case 1:
page = IncomePage(); page = IncomePage();
case 2: case 2:
@ -79,49 +85,44 @@ class _HomePageState extends State<HomePage> {
return LayoutBuilder(builder: (context, constraints) { return LayoutBuilder(builder: (context, constraints) {
return Scaffold( return Scaffold(
// TODO: Add a drawer instead of nav rail. appBar: AppBar(title: Text("Expense Tracker")),
body: Row( drawer: NavigationRail(
children: [ extended: constraints.maxWidth >= 800,
SafeArea( destinations: [
child: NavigationRail( NavigationRailDestination(
extended: constraints.maxWidth >= 800, icon: Icon(Icons.payment),
destinations: [ label: Text('Expenses'),
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('Projections'),
),
NavigationRailDestination(
icon: Icon(Icons.settings),
label: Text('Settings'),
),
],
selectedIndex: pageSelected,
onDestinationSelected: (value) {
setState(() {
pageSelected = value;
});
},
),
), ),
Expanded( NavigationRailDestination(
child: Container( icon: Icon(Icons.account_balance),
color: Theme.of(context).colorScheme.primaryContainer, label: Text('Income'),
child: page, ),
), 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'),
), ),
], ],
selectedIndex: pageSelected,
onDestinationSelected: (value) {
setState(() {
pageSelected = value;
Navigator.pop(context);
});
},
),
body: Center(
child: Container(
color: Theme.of(context).colorScheme.primaryContainer,
child: page,
),
), ),
floatingActionButton: floatingButton, floatingActionButton: floatingButton,
); );

266
lib/pages/expense.dart

@ -13,47 +13,36 @@ class ExpensePage extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return ListView.builder( return ListView.builder(
itemCount: expenses.length, itemCount: expenses.length,
itemBuilder: (_, index) { itemBuilder: (_, index) {
final Expense curr = expenses[index]; final Expense curr = expenses[index];
return Center( return Center(
child: Padding( child: Padding(
padding: const EdgeInsets.all(4.0), padding: const EdgeInsets.all(4.0),
child: Container( child: Container(
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(4), borderRadius: BorderRadius.circular(4),
color: Colors.greenAccent, color: Colors.greenAccent,
), ),
child: Column( child: Column(
children: [ children: [
Text(curr.name), Text(curr.name),
Text("${curr.cost.toString()} ${curr.frequency.title}"), Text("${curr.cost.toString()} ${curr.frequency.title}"),
], ],
),
), ),
), ),
); ),
}); );
/* },
return ListView(
children: [
ListTile(
title: Text("Fake Item 1"),
subtitle: Text("30.00 / month"),
),
ListTile(
title: Text("Fake Item 2"),
subtitle: Text("180.00 / year"),
),
],
); );
*/
} }
} }
class ExpenseInputDialog extends StatefulWidget { class ExpenseInputDialog extends StatefulWidget {
final Function() notifyParent;
const ExpenseInputDialog({ const ExpenseInputDialog({
super.key, super.key,
required this.notifyParent,
}); });
@override @override
@ -70,9 +59,6 @@ class _ExpenseInputDialogState extends State<ExpenseInputDialog> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
const inputWidth = 300.0;
const inputHeight = 50.0;
List<DropdownMenuItem> freqValues = []; List<DropdownMenuItem> freqValues = [];
for (var freq in Frequency.values) { for (var freq in Frequency.values) {
freqValues.add(DropdownMenuItem(value: freq, child: Text(freq.title))); freqValues.add(DropdownMenuItem(value: freq, child: Text(freq.title)));
@ -83,130 +69,112 @@ class _ExpenseInputDialogState extends State<ExpenseInputDialog> {
title: Center(child: Text("Add New Expense")), title: Center(child: Text("Add New Expense")),
content: Form( content: Form(
key: _expenseFormKey, key: _expenseFormKey,
autovalidateMode: AutovalidateMode.onUserInteraction, //autovalidateMode: AutovalidateMode.onUserInteraction,
child: Column(mainAxisSize: MainAxisSize.min, spacing: 10, children: [ child: Column(mainAxisSize: MainAxisSize.min, spacing: 10, children: [
SizedBox( TextFormField(
width: inputWidth, keyboardType: TextInputType.text,
height: inputHeight, decoration: InputDecoration(
child: TextFormField( labelText: "Name",
keyboardType: TextInputType.text, hintText: "Example: Red Pocket Phone Bill",
decoration: InputDecoration(
labelText: "Name",
hintText: "Example: Red Pocket Phone Bill",
),
validator: (value) {
if (value!.isEmpty) {
return "Name must be provided.";
}
return null;
},
onSaved: (newValue) {
_name = newValue!;
},
), ),
validator: (value) {
if (value!.isEmpty) {
return "Name must be provided.";
}
return null;
},
onSaved: (newValue) {
_name = newValue!;
},
), ),
SizedBox( TextFormField(
width: inputWidth, keyboardType: TextInputType.numberWithOptions(decimal: true),
height: inputHeight, decoration:
child: TextFormField( InputDecoration(labelText: "Cost", hintText: "Example: 10.00"),
keyboardType: TextInputType.numberWithOptions(decimal: true), validator: (value) {
decoration: InputDecoration( if (value!.isEmpty) {
labelText: "Cost", hintText: "Example: 10.00"), return "Cost must be provided.";
validator: (value) { }
if (value!.isEmpty) { if (double.tryParse(value) == null) {
return "Cost must be provided."; return "Cost must be a valid number.";
} }
if (double.tryParse(value) == null) { return null;
return "Cost must be a valid number."; },
} onSaved: (newValue) {
return null; _cost = double.parse(newValue!);
}, },
onSaved: (newValue) {
_cost = double.parse(newValue!);
},
),
), ),
SizedBox( DropdownButtonFormField(
width: inputWidth, items: freqValues,
height: inputHeight, decoration: InputDecoration(
child: DropdownButtonFormField( labelText: "Recurrence", hintText: "Example: Monthly"),
items: freqValues, validator: (value) {
decoration: InputDecoration( if (value == null) {
labelText: "Recurrence", hintText: "Example: Monthly"), return "Frequency must be provided.";
validator: (value) { }
if (value == null) { if (!Frequency.values.contains(value)) {
return "Frequency must be provided."; return "Value not valid.";
} }
if (!Frequency.values.contains(value)) { return null;
return "Value not valid."; },
} onChanged: (newValue) {
return null; _freq = newValue;
}, },
onChanged: (newValue) {
_freq = newValue;
},
),
), ),
SizedBox( TextFormField(
width: inputWidth, keyboardType: TextInputType.text,
height: inputHeight, decoration: InputDecoration(
child: TextFormField( labelText: "Description",
keyboardType: TextInputType.text, hintText: "Example: 1GB data with unlimited talk & text."),
decoration: InputDecoration( validator: (value) {
labelText: "Description", return null;
hintText: "Example: 1GB data with unlimited talk & text."), },
validator: (value) { onSaved: (newValue) {
return null; _desc = newValue!;
}, },
onSaved: (newValue) {
_desc = newValue!;
},
),
), ),
]), ]),
), ),
actions: [ actions: [
SizedBox( Row(
width: inputWidth, mainAxisAlignment: MainAxisAlignment.spaceEvenly,
height: inputHeight, crossAxisAlignment: CrossAxisAlignment.center,
child: Row( children: [
mainAxisAlignment: MainAxisAlignment.spaceEvenly, ElevatedButton.icon(
crossAxisAlignment: CrossAxisAlignment.center, onPressed: () {
children: [ print("TODO: Clear fields!");
ElevatedButton.icon( Navigator.of(context).pop();
onPressed: () { },
print("TODO: Clear fields!"); icon: Icon(Icons.cancel),
Navigator.of(context).pop(); label: Text('Cancel'),
}, ),
icon: Icon(Icons.cancel), ElevatedButton.icon(
label: Text('Cancel'), onPressed: () {
), print("TODO: Save expense!");
ElevatedButton.icon( if (_expenseFormKey.currentState!.validate()) {
onPressed: () { _expenseFormKey.currentState!.save();
print("TODO: Save expense!"); setState(() {
if (_expenseFormKey.currentState!.validate()) { expenses.add(
_expenseFormKey.currentState!.save(); Expense(
setState(() { name: _name,
expenses.add( cost: _cost,
Expense( frequency: _freq,
name: _name, description: _desc),
cost: _cost, );
frequency: _freq, });
description: _desc), widget.notifyParent();
);
}); print(expenses.toString());
print(expenses.toString()); for (var expense in expenses) {
for (var expense in expenses) { print(expense.toString());
print(expense.toString());
}
Navigator.of(context).pop();
} }
}, Navigator.of(context).pop();
icon: Icon(Icons.save), }
label: Text('Submit'), },
), icon: Icon(Icons.save),
], label: Text('Submit'),
), ),
],
) )
], ],
); );