Fix edit/delete option slidable (#561)

* Fix Edit Slidable in receive address cell
Fix Edit/Delete slidable in contact list

* Update Delete node slidable
This commit is contained in:
Omar Hatem 2022-10-24 21:15:17 +02:00 committed by GitHub
parent 65b87ecae0
commit 12e54426bd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 109 additions and 88 deletions

View file

@ -1,4 +1,5 @@
import 'package:cake_wallet/entities/contact_base.dart'; import 'package:cake_wallet/entities/contact_base.dart';
import 'package:cake_wallet/entities/contact_record.dart';
import 'package:cake_wallet/utils/show_bar.dart'; import 'package:cake_wallet/utils/show_bar.dart';
import 'package:cake_wallet/utils/show_pop_up.dart'; import 'package:cake_wallet/utils/show_pop_up.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
@ -34,12 +35,12 @@ class ContactListPage extends BasePage {
height: 32.0, height: 32.0,
decoration: BoxDecoration( decoration: BoxDecoration(
shape: BoxShape.circle, shape: BoxShape.circle,
color: Theme.of(context).accentTextTheme!.caption!.color!), color: Theme.of(context).accentTextTheme.caption!.color!),
child: Stack( child: Stack(
alignment: Alignment.center, alignment: Alignment.center,
children: <Widget>[ children: <Widget>[
Icon(Icons.add, Icon(Icons.add,
color: Theme.of(context).primaryTextTheme!.headline6!.color!, color: Theme.of(context).primaryTextTheme.headline6!.color!,
size: 22.0), size: 22.0),
ButtonTheme( ButtonTheme(
minWidth: 32.0, minWidth: 32.0,
@ -66,9 +67,9 @@ class ContactListPage extends BasePage {
return CollapsibleSectionList( return CollapsibleSectionList(
context: context, context: context,
sectionCount: 2, sectionCount: 2,
themeColor: Theme.of(context).primaryTextTheme!.headline6!.color!, themeColor: Theme.of(context).primaryTextTheme.headline6!.color!,
dividerThemeColor: dividerThemeColor:
Theme.of(context).primaryTextTheme!.caption!.decorationColor!, Theme.of(context).primaryTextTheme.caption!.decorationColor!,
sectionTitleBuilder: (_, int sectionIndex) { sectionTitleBuilder: (_, int sectionIndex) {
var title = 'Contacts'; var title = 'Contacts';
@ -91,37 +92,13 @@ class ContactListPage extends BasePage {
final contact = contactListViewModel.contacts[index]; final contact = contactListViewModel.contacts[index];
final content = generateRaw(context, contact); final content = generateRaw(context, contact);
// FIX-ME: Slidable return !isEditable
return content; ? content
// return !isEditable : Slidable(
// ? content key: Key('${contact.key}'),
// : Slidable( endActionPane: _actionPane(context, contact),
// key: Key('${contact.key}'), child: content,
// actionPane: SlidableDrawerActionPane(), );
// child: content,
// secondaryActions: <Widget>[
// IconSlideAction(
// caption: S.of(context).edit,
// color: Colors.blue,
// icon: Icons.edit,
// onTap: () async => await Navigator.of(context)
// .pushNamed(Routes.addressBookAddContact,
// arguments: contact),
// ),
// IconSlideAction(
// caption: S.of(context).delete,
// color: Colors.red,
// icon: CupertinoIcons.delete,
// onTap: () async {
// final isDelete =
// await showAlertDialog(context) ?? false;
// if (isDelete) {
// await contactListViewModel.delete(contact);
// }
// },
// ),
// ]);
}, },
); );
}, },
@ -141,7 +118,7 @@ class ContactListPage extends BasePage {
final isCopied = await showNameAndAddressDialog( final isCopied = await showNameAndAddressDialog(
context, contact.name, contact.address); context, contact.name, contact.address);
if (isCopied != null && isCopied) { if (isCopied) {
await Clipboard.setData(ClipboardData(text: contact.address)); await Clipboard.setData(ClipboardData(text: contact.address));
await showBar<void>(context, S.of(context).copied_to_clipboard); await showBar<void>(context, S.of(context).copied_to_clipboard);
} }
@ -165,7 +142,7 @@ class ContactListPage extends BasePage {
style: TextStyle( style: TextStyle(
fontSize: 14, fontSize: 14,
fontWeight: FontWeight.normal, fontWeight: FontWeight.normal,
color: Theme.of(context).primaryTextTheme!.headline6!.color!), color: Theme.of(context).primaryTextTheme.headline6!.color!),
), ),
) )
) )
@ -266,4 +243,34 @@ class ContactListPage extends BasePage {
actionLeftButton: () => Navigator.of(context).pop(false)); actionLeftButton: () => Navigator.of(context).pop(false));
}) ?? false; }) ?? false;
} }
ActionPane _actionPane(BuildContext context, ContactRecord contact) => ActionPane(
motion: const ScrollMotion(),
extentRatio: 0.4,
children: [
SlidableAction(
onPressed: (_) async => await Navigator.of(context)
.pushNamed(Routes.addressBookAddContact,
arguments: contact),
backgroundColor: Colors.blue,
foregroundColor: Colors.white,
icon: Icons.edit,
label: S.of(context).edit,
),
SlidableAction(
onPressed: (_) async {
final isDelete =
await showAlertDialog(context);
if (isDelete) {
await contactListViewModel.delete(contact);
}
},
backgroundColor: Colors.red,
foregroundColor: Colors.white,
icon: CupertinoIcons.delete,
label: S.of(context).delete,
),
],
);
} }

View file

@ -1,4 +1,5 @@
import 'package:cake_wallet/utils/show_pop_up.dart'; import 'package:cake_wallet/utils/show_pop_up.dart';
import 'package:cw_core/node.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:flutter_mobx/flutter_mobx.dart';
@ -26,7 +27,7 @@ class NodeListPage extends BasePage {
height: 32, height: 32,
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(16)), borderRadius: BorderRadius.all(Radius.circular(16)),
color: Theme.of(context).accentTextTheme!.caption!.color!), color: Theme.of(context).accentTextTheme.caption!.color!),
child: ButtonTheme( child: ButtonTheme(
minWidth: double.minPositive, minWidth: double.minPositive,
child: TextButton( child: TextButton(
@ -85,7 +86,7 @@ class NodeListPage extends BasePage {
final node = nodeListViewModel.nodes[index]; final node = nodeListViewModel.nodes[index];
final isSelected = final isSelected =
node.keyIndex == nodeListViewModel.currentNode?.keyIndex; node.keyIndex == nodeListViewModel.currentNode.keyIndex;
final nodeListRow = NodeListRow( final nodeListRow = NodeListRow(
title: node.uriRaw, title: node.uriRaw,
isSelected: isSelected, isSelected: isSelected,
@ -114,45 +115,52 @@ class NodeListPage extends BasePage {
}); });
}); });
}); });
// FIX-ME: Slidable
// final dismissibleRow = Slidable(
// key: Key('${node.keyIndex}'),
// actionPane: SlidableDrawerActionPane(),
// child: nodeListRow,
// secondaryActions: <Widget>[
// IconSlideAction(
// caption: S.of(context).delete,
// color: Colors.red,
// icon: CupertinoIcons.delete,
// onTap: () async {
// final confirmed = await showPopUp<bool>(
// context: context,
// builder: (BuildContext context) {
// return AlertWithTwoActions(
// alertTitle: S.of(context).remove_node,
// alertContent:
// S.of(context).remove_node_message,
// rightButtonText: S.of(context).remove,
// leftButtonText: S.of(context).cancel,
// actionRightButton: () =>
// Navigator.pop(context, true),
// actionLeftButton: () =>
// Navigator.pop(context, false));
// }) ??
// false;
// if (confirmed) { final dismissibleRow = Slidable(
// await nodeListViewModel.delete(node); key: Key('${node.keyIndex}'),
// } startActionPane: _actionPane(context, node),
// }, endActionPane: _actionPane(context, node),
// ), child: nodeListRow,
// ]); );
return nodeListRow; return isSelected ? nodeListRow : dismissibleRow;
// return isSelected ? nodeListRow : dismissibleRow;
}); });
}, },
), ),
); );
} }
ActionPane _actionPane(BuildContext context, Node node) => ActionPane(
motion: const ScrollMotion(),
extentRatio: 0.3,
children: [
SlidableAction(
onPressed: (context) async {
final confirmed = await showPopUp<bool>(
context: context,
builder: (BuildContext context) {
return AlertWithTwoActions(
alertTitle: S.of(context).remove_node,
alertContent:
S.of(context).remove_node_message,
rightButtonText: S.of(context).remove,
leftButtonText: S.of(context).cancel,
actionRightButton: () =>
Navigator.pop(context, true),
actionLeftButton: () =>
Navigator.pop(context, false));
}) ??
false;
if (confirmed) {
await nodeListViewModel.delete(node);
}
},
backgroundColor: Colors.red,
foregroundColor: Colors.white,
icon: CupertinoIcons.delete,
label: S.of(context).delete,
),
],
);
} }

View file

@ -57,6 +57,7 @@ class AddressCell extends StatelessWidget {
final Widget cell = InkWell( final Widget cell = InkWell(
onTap: () => onTap?.call(address), onTap: () => onTap?.call(address),
child: Container( child: Container(
width: double.infinity,
color: backgroundColor, color: backgroundColor,
padding: EdgeInsets.only(left: 24, right: 24, top: 28, bottom: 28), padding: EdgeInsets.only(left: 24, right: 24, top: 28, bottom: 28),
child: Text( child: Text(
@ -69,20 +70,25 @@ class AddressCell extends StatelessWidget {
), ),
), ),
)); ));
// FIX-ME: Slidable return Slidable(
return cell; key: Key(address),
// return Container( startActionPane: _actionPane(context),
// color: backgroundColor, endActionPane: _actionPane(context),
// child: Slidable( child: cell,
// key: Key(address), );
// actionPane: SlidableDrawerActionPane(),
// child: cell,
// secondaryActions: <Widget>[
// IconSlideAction(
// caption: S.of(context).edit,
// color: Colors.blue,
// icon: Icons.edit,
// onTap: () => onEdit?.call())
// ]));
} }
ActionPane _actionPane(BuildContext context) => ActionPane(
motion: const ScrollMotion(),
extentRatio: 0.3,
children: [
SlidableAction(
onPressed: (_) => onEdit?.call(),
backgroundColor: Colors.blue,
foregroundColor: Colors.white,
icon: Icons.edit,
label: S.of(context).edit,
),
],
);
} }