From 94a2379ac99758c216305d692a0d8f360b739838 Mon Sep 17 00:00:00 2001 From: Florian Schindler <florianschndlr@gmail.com> Date: Tue, 27 Jun 2023 12:45:59 +0200 Subject: [PATCH] additional functionality - swipe to delete - edit - fixed bug where the category would be the same across listtiles --- .../frontend/utils/transaction_listtile.dart | 153 +++++++++++------- 1 file changed, 95 insertions(+), 58 deletions(-) diff --git a/trackeroo/lib/frontend/utils/transaction_listtile.dart b/trackeroo/lib/frontend/utils/transaction_listtile.dart index b6828a5..c5f403b 100644 --- a/trackeroo/lib/frontend/utils/transaction_listtile.dart +++ b/trackeroo/lib/frontend/utils/transaction_listtile.dart @@ -1,8 +1,10 @@ import 'package:flutter/material.dart'; +import 'package:trackeroo/frontend/views/edit_transaction_view.dart'; import 'package:trackeroo/logic/models/category.dart'; import 'package:trackeroo/logic/models/transaction.dart'; import 'package:trackeroo/logic/services/categories_controller.dart'; import 'package:trackeroo/logic/services/locator.dart'; +import 'package:trackeroo/logic/services/transactions_controller.dart'; class TransactionListtile extends StatefulWidget { const TransactionListtile({super.key, required this.transaction}); @@ -14,78 +16,108 @@ class TransactionListtile extends StatefulWidget { } class _TransactionListtileState extends State<TransactionListtile> { - late Category category; final monthsGer = const ['Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember']; - @override - void initState() { - category = locator.get<CategoriesController>().categories[widget.transaction.categoryId] ?? - Category(id: 'no_category', title: '', iconCodePoint: Icons.attach_money_rounded.codePoint, colorValue: Colors.transparent.value); - super.initState(); - } - @override Widget build(BuildContext context) { - return GestureDetector( - onTap: () => showModalBottomSheet<void>( - showDragHandle: true, - context: context, - builder: (BuildContext context) { - return buildModalContent(widget.transaction); - }, - ), - child: Container( - padding: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 12.0), - margin: const EdgeInsets.only(bottom: 5.0), - decoration: BoxDecoration( - color: Theme.of(context).colorScheme.secondaryContainer, - borderRadius: const BorderRadius.all(Radius.circular(12.0)) - ), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - Row( - children: [ - Container( - width: 50.0, - height: 50.0, - decoration: BoxDecoration( - borderRadius: const BorderRadius.all(Radius.circular(8.0)), - color: Theme.of(context).colorScheme.surface + Category category = locator.get<CategoriesController>().catBox.get(widget.transaction.categoryId)!; + return Padding( + padding: const EdgeInsets.only(bottom: 5.0), + child: ClipRRect( + borderRadius: const BorderRadius.all(Radius.circular(12.0)), + child: Dismissible( + key: UniqueKey(), + direction: DismissDirection.startToEnd, + onDismissed: (_) => { + locator.get<TransactionsController>().deleteTransaction(widget.transaction), + ScaffoldMessenger.of(context).removeCurrentSnackBar(), + ScaffoldMessenger.of(context).showSnackBar( + SnackBar( + content: Text( + 'Transaction deleted', + style: TextStyle( + color: Theme.of(context).colorScheme.onSecondary ), - child: Icon(IconData(category.iconCodePoint, fontFamily: category.iconFontFamily)), ), - const SizedBox(width: 17.0), - Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - widget.transaction.title, - style: const TextStyle( - fontSize: 18.0, - fontWeight: FontWeight.bold - ), - ), - Text( - "${widget.transaction.createdAt.day}.${monthsGer[widget.transaction.createdAt.month]} · ${widget.transaction.createdAt.hour < 10 ? 0 : ''}${widget.transaction.createdAt.hour}:${widget.transaction.createdAt.minute < 10 ? 0 : ''}${widget.transaction.createdAt.minute}" - ) - ], + backgroundColor: Theme.of(context).colorScheme.secondary, + behavior: SnackBarBehavior.floating, + shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(8.0))), + action: SnackBarAction( + label: 'Undo', + textColor: Theme.of(context).colorScheme.onSecondary, + onPressed: () => locator.get<TransactionsController>().undoLastDeletion() ), - ], + ) + ) + }, + background: Container( + padding: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 12.0), + color: Theme.of(context).colorScheme.errorContainer, + alignment: Alignment.centerLeft, + child: Icon( + Icons.delete, + color: Theme.of(context).colorScheme.error, ), - Text( - '${widget.transaction.amount.toString()} €', - style: TextStyle( - color: widget.transaction.amount.isNegative ? Colors.red[700] : Colors.green[700] + ), + child: GestureDetector( + onTap: () => showModalBottomSheet<void>( + showDragHandle: true, + context: context, + builder: (BuildContext context) { + return buildModalContent(widget.transaction, category, context); + }, + ), + child: Container( + padding: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 12.0), + color: Theme.of(context).colorScheme.secondaryContainer, + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Row( + children: [ + Container( + width: 50.0, + height: 50.0, + decoration: BoxDecoration( + borderRadius: const BorderRadius.all(Radius.circular(8.0)), + color: Theme.of(context).colorScheme.surface + ), + child: Icon(IconData(category.iconCodePoint, fontFamily: category.iconFontFamily)), + ), + const SizedBox(width: 17.0), + Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + widget.transaction.title, + style: const TextStyle( + fontSize: 18.0, + fontWeight: FontWeight.bold + ), + ), + Text( + "${widget.transaction.createdAt.day}.${monthsGer[widget.transaction.createdAt.month]} · ${widget.transaction.createdAt.hour < 10 ? 0 : ''}${widget.transaction.createdAt.hour}:${widget.transaction.createdAt.minute < 10 ? 0 : ''}${widget.transaction.createdAt.minute}" + ) + ], + ), + ], + ), + Text( + '${widget.transaction.amount.toString()} €', + style: TextStyle( + color: widget.transaction.amount.isNegative ? Colors.red[700] : Colors.green[700] + ), + ), + ], ), ), - ], + ), ), ), ); } - Widget buildModalContent(Transaction transaction) { + Widget buildModalContent(Transaction transaction, Category category, BuildContext context) { return SizedBox( width: double.infinity, child: SafeArea( @@ -164,7 +196,12 @@ class _TransactionListtileState extends State<TransactionListtile> { const SizedBox(width: 10.0), Expanded( child: FilledButton.tonal( - onPressed: () => {}, + onPressed: () => { + Navigator.push( + context, + MaterialPageRoute(builder: (context) => EditTransactionView(transaction: transaction)) + ) + }, child: const Row( mainAxisAlignment: MainAxisAlignment.center, children: [ -- GitLab