Flutter item not updating in widget when delete need to come back to see changes - flutter

Question

I have a simple cart page I am showing products on the cart page. The issue is when I am deleting an item it's deleting but in the widget, it's not deleting I need to go back and come again to show the changes. I try to rise setState also but not working.
My code
class _CartPageState extends State<CartPage> {
num amount = 0;
bool checkLogin = false;
void navigateToAddressPage() {
Get.to(AddressPage());
}
check() async {
final storage = new FlutterSecureStorage();
String imi = await storage.read(key: "imei");
print(imi);
if (imi == "loginhuavaha") {
setState(() {
this._query();
checkLogin = true;
});
}
}
#override
void initState() {
setState(() {
this.check();
});
}
List<Widget> textWidgetList = List<Widget>();
void _query() async {
print('cart');
final dbHelper = DatabaseHelper.instance;
final allRows = await dbHelper.queryAllRows();
allRows.forEach((row) {
amount += double.parse(row['price']);
print(amount);
print(row);
});
for (int i = 0; i < allRows.length; i++) {
textWidgetList.add(Card(
elevation: 5.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12.0),
),
margin: EdgeInsets.symmetric(vertical: 8.0),
child: Container(
width: double.infinity,
height: 120.0,
padding: EdgeInsets.all(12.0),
child: Row(
children: [
ClipRRect(
borderRadius: BorderRadius.circular(12.0),
child: Image.network(allRows[i]['image'],
width: 100, height: 100)),
SizedBox(width: 12.0),
Expanded(
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 10.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: Text(
allRows[i]['title'],
textAlign: TextAlign.start,
maxLines: 3,
overflow: TextOverflow.ellipsis,
),
),
SizedBox(width: 5.0),
Row(
children: [
GestureDetector(
onTap: () async {
print('delete');
final id = await dbHelper.queryRowCount();
print(id);
final rowsDeleted = await dbHelper.delete(
id, allRows[i]['id']);
print('deleted $rowsDeleted row(s): row $id');
setState(() {
});
},
child: Icon(
FlutterIcons.delete_outline_mco,
),
)
],
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Expanded(
child: Text(
allRows[i]['price'],
),
),
// Counter(),
],
),
],
),
),
)
],
),
),
));
}
setState(() {});
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: buildAppBar(context),
body: checkLogin
? Container(
child: SingleChildScrollView(
padding: EdgeInsets.symmetric(horizontal: 18.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Column(children: textWidgetList),
],
),
),
)
: Center(
child: Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(child: Text('Your are not login')),
SizedBox(height: 10),
SizedBox(
width: 85.0,
height: 50.0,
child: RaisedButton(
color: Theme.of(context).primaryColor,
elevation: 0.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0),
),
child: Text(
'LOGIN',
style: Theme.of(context).textTheme.button,
).tr(),
onPressed: () {
Get.offAll(SignInPage());
},
),
),
])),
),
);
}
You can see I have added a comment in my code I delete the product and it actually deleted from database but state isn't changing of widget -_-

Answer 1

I think what you need here is the Provider package. Provider makes state management easier a lot. Just define a model class that extends ChangeNotifier and then wrap your widgets with ChangeNotifierProvider<Model_class_name>. To access the fields Use Provider.of(context).var or Provider.of(context).function

Answer 2

First of all you need to put textWidgetList in the setState since you manipulate those Widgets I guess. Secondly you have to put a key to those Widgets due to how Flutter handles elements in a list on the UI.Have a look at this page https://medium.com/flutter/keys-what-are-they-good-for-13cb51742e7d

Answer 3

Its Simple Man
Once the item is removed
use setState((){})
setState(() {
//Inside setState Clear the allrows list
allrows.clear();
//Then get the allrows again so that the deleted data will not be shown
allRows = await dbHelper.queryAllRows();
});
setState rebuilds your widgets