Reputation: 755
I working creating a favorite page. For each Product Page, I place on app bar a favorite icon that suppose to change and add the specific product to the favorites of the user.
I am failing to change the state of the icon after pressing it.
class FoodDetail extends StatefulWidget {
@override
_FoodDetail createState()=> _FoodDetail();
const FoodDetail({Key key}) : super(key: key);
}
class _FoodDetail extends State<FoodDetail>{
@override
Widget build(BuildContext context) {
FoodNotifier foodNotifier = Provider.of<FoodNotifier>(context);
_onFoodDeleted(Food food) {
Navigator.pop(context);
foodNotifier.deleteFood(food);
}
final _saved = Set<BuildContext>();
final alreadySaved = _saved.contains(context);
return Scaffold(
appBar: AppBar(
title: Text(foodNotifier.currentFood.name),
actions: <Widget>[
// action button
new IconButton(
icon: alreadySaved ? Icon(Icons.star) : Icon(Icons.star_border),
color: alreadySaved ? Colors.yellow[500] : null,
onPressed: (){
setState(() {
if (alreadySaved) {
_saved.remove(context);
} else {
_saved.add(context);
}
});}
Upvotes: 0
Views: 697
Reputation: 3376
Your states doesn't change because you're putting them inside the build
method which always reinitialize them.
Put your states _saved
, alreadySaved
outside the build
method.
final _saved = Set<BuildContext>();
final alreadySaved = _saved.contains(context);
@override
Widget build(BuildContext context) {
}
Upvotes: 1