I am new to Flutter and can't figure out why my boolean variable clickedLike isn't changing to true.
I declare this outside my Column, with the initial value false in a StatefulWidget class.
IconButton(
onPressed: () async {
setState(() {
likeColor = Colors.blue;
if (clickedLike == false) {
numLikes++;
FirebaseFirestore.instance
.collection('board')
.doc(docID)
.update({'likes': numLikes});
clickedLike = true;
} else {}
});
},
icon: Icon(Icons.thumb_up, color: likeColor)
//color: Colors.blue,
),
I have omitted the rest of the children widgets, as they are irrelevant. Any help would be appreciated. Thanks.
if (!clickedLike) {
numLikes++;
FirebaseFirestore.instance
.collection('board')
.doc(docID)
.update({'likes': numLikes});
clickedLike = !clickedLike;
}
try this ?
Related
I want to change the icon button color according to the variable value.
eg: if the variable value is greater than 40 icon color should be red other wise icon color is white.
I get a variable values from SQLite table.
following code, i have tried but its shows null check operator used on null value.\
int? tatalLeave=0;
IconButton(
onPressed: (() {
getTotalLeave();
}),
icon: Icon(
Icons.notifications_active_rounded,
color:
tatalLeave! >= 40 ? Colors.red : Colors.white,
size: 30.0,
),
)
following i have added sqlite codes
//get total number of leaves
getTotalLeave() async {
int? count = await DatabaseHelper.instance.countAllLeave();
setState(() {
tatalLeave = count;
print(tatalLeave);
});
}
}
db helper class
Future<int?> countAllLeave() async {
Database db = await database;
final allLeave = Sqflite.firstIntValue(
await db.rawQuery('SELECT SUM(num_leave_days) FROM leave_Details'));
return allLeave;
}
please help me to slove my issue.
Try modifiying the code as below,
As the getTotalLeave function is asynchronous you need to put await.
(await is to interrupt the process flow until the async method completes)
int? tatalLeave=0;
IconButton(
onPressed: (()async {
await getTotalLeave();
}),
icon: Icon(
Icons.notifications_active_rounded,
color:
tatalLeave! >= 40 ? Colors.red :
Colors.white,
size: 30.0,
),
)
I want to set a property of a dart object related to another property of the same object. I have the following code for the button press function:
onPressed: () {
setState(() {
if (textEditController.text.trim().isNotEmpty) {
_sendMessage();
myMessagesList.add(OwnMessageCard(
myMessage:
textEditController.text.trim(),
isSeen: false,
deliverIconColor: Colors.grey));
}
});
},
I want to create condition for deliverIconColor. If isSeen == true then deliverIconColor must be Colors.blue and if not then it must be Colors.grey.
How can I make such a relation in Flutter?
Simply you can use ternary operator
onPressed: () {
setState(() {
if (textEditController.text.trim().isNotEmpty) {
_sendMessage();
myMessagesList.add(OwnMessageCard(
myMessage:
textEditController.text.trim(),
isSeen: false,
deliverIconColor: isSeen? Colors.blue : Colors.grey));
}
});
},
Hi I am trying to use ColorFilter when recommend is only true
GestureDetector(
onTap: () {
setState(() {
recommend = !recommend;
if (!recommend) {
both = false;
male = false;
female = false;
}
});
},
child: ColorFiltered(
colorFilter: recommend
? ColorFilter.mode(Colors.amber, BlendMode.saturation)
: ColorFilter.mode(Colors.white, BlendMode.saturation),)
How can i use CololrFilter when the recommend is only true ??
try this:
colorFilter: recommend
? ColorFilter.mode(Colors.amber, BlendMode.saturation)
: ColorFilter.mode(Colors.transparent, BlendMode.saturation),)
This is my code. I want to get a variable called "favorite" from the Video0_02 file and change the color to yellow if true and to blue if false. I don't know how to write the code because the if statement doesn't work.
How do I solve this?
LearnLevelButton(
color: Colors.yellow,
onTap: () async {
await Navigator.push(
context, MaterialPageRoute(builder: (context) {
return Video0_02();
//Level newLevel = await gameBloc.setLevel(index + 1);
//Navigator.of(context).push(GamePage.route(newLevel));
}));
},
),
Try with this
LearnLevelButton(
color: favorite? Colors.yellow:Colors.blue,
onTap: () async {
await Navigator.push(
context, MaterialPageRoute(builder: (context) {
return Video0_02();
//Level newLevel = await gameBloc.setLevel(index + 1);
//Navigator.of(context).push(GamePage.route(newLevel));
}));
},
),
There are several ways you can use to handle the logic.
Use Dart's ternary operator. Something like this:
...
// Remember to check in case your `favorite` variable is null, set it to false
LearnLevelButton(
color: (favorite ?? false) ? Colors.yellow : Colors.blue,
...
),
Use a function to handle the logic:
LearnLevelButton(
color: getColor(favorite),
...
),
// The function
Color getColor(bool favorite) {
if (favorite ?? false) {
return Colors.yellow;
}
return Colors.blue;
}
Other way is immediate anonymous function or use switch/case in your separate function when there are more than 2 values to consider. But these 2 methods should be enough to get you started! ;)
I want to change the favorite icon and its color when pressed
class MyFavorite extends ChangeNotifier{
bool isFavorite ;
isFavorited(){
isFavorite = !isFavorite;
notifyListeners();
}
}
var favorite = Provider.of<MyFavorite>(context , listen: false);
GestureDetector(
onTap: () {
favorite.isFavorited();
},
child: Icon(favorite.isFavorite == true ? Icons.favorite :Icons.favorite_border, color: favorite.isFavorite == true ? Colors.red : Colors.white,
)),
and when I try to set the listen to true when I clicked
the color changed for other items
There are a few things you need/should do. First, you need to give the boolean an initial value. Secondly, it is advised to modify your properties as getters, but in doing so, it then makes sense to make them private first(indicated by the underscore). This is recommended so that they will not be able to be accessed from outside and modified. Lastly, you need to take off the listen: false because you are actually trying to change the UI by rebuilding the widget.
bool _isFavorite = false;
bool get isFav => _isFavorite;
isFavorited(){
_isFavorite = !_isFavorite;
notifyListeners();
}
var favorite = Provider.of<MyFavorite>(context);
GestureDetector(
onTap: () {
favorite.isFavorited();
},
child: Icon(favorite.isFav == true ? Icons.favorite :Icons.favorite_border, color: favorite.isFav == true ? Colors.red : Colors.white,
)),
enter code here
As noted in the comments, you can just use favorite.isFav for the condition without the == true
I highly reccomend you to read this https://flutter.dev/docs/development/data-and-backend/state-mgmt/simple
Initialize your isFavourite variable in the class as true or false.
like this:-
class MyFavorite extends ChangeNotifier{
bool isFavorite =false;
isFavorited(){
isFavorite = !isFavorite;
notifyListeners();
}
}
Put this line in the build function (if it's not already there) and remove the listen: false
var favorite = Provider.of<MyFavorite>(context);
listen:false meaning you don't want to listen for upcoming changes.