like_button
like_button copied to clipboard
Animation is not shown while using onTap Feature
I have wrapped this Like Button with my stateless Widget named Love Button
The animation of this like button is working until I use onTap feature after onTap callback added to the widget the animation stops , only color is changed
Here's my Code
`class LoveButton extends StatelessWidget { @required final IconData icon; @required final IconData likedIcon; @required final Color startColor; @required final Color endColor; @required final Color dotPrimaryColor; @required final Color dotSecondaryColor; @required final Color likeColor; @required final int likeCount; @required final bool isLiked; @required final LikeButtonTapCallback onTap;
const LoveButton( {Key key, this.icon, this.dotSecondaryColor, this.dotPrimaryColor, this.endColor, this.startColor, this.likeColor, this.likedIcon, this.likeCount, this.isLiked, this.onTap}) : super(key: key); @override Widget build(BuildContext context) { return LikeButton( size: 24.0, isLiked: isLiked, circleColor: CircleColor(start: startColor, end: endColor), bubblesColor: BubblesColor( dotPrimaryColor: dotPrimaryColor, dotSecondaryColor: dotSecondaryColor, ), onTap: onTap, likeBuilder: (bool isLiked) { return !isLiked ? Icon( icon, color: Colors.grey, size: 24.0, ) : Icon( likedIcon, color: likeColor, size: 24.0, ); }, countPostion: CountPostion.left, likeCountPadding: EdgeInsets.only(right: 3), countDecoration: (Widget count, int likeCount) { var _formattedNumber = NumberFormat.compact().format( likeCount, ); if (likeCount == 0) { count = Text( "", ); } else count = Text( " ${_formattedNumber.toLowerCase()}", style: textTheme.caption.copyWith(color: colorScheme.secondary), ); return count; }, likeCount: likeCount, ); } }`
Hers My implementation of LovedButton
LoveButton( onTap: (bool isLiked) async { print(isLiked); if (!isLiked) { await firestoreService.addLikes( postId: post.postId, currentUserId: sanjuUser.id, ownerId: post.ownerId); await firestoreService.addLikeToActivity( ownerId: post.ownerId, postId: post.postId, currentUserId: sanjuUser.id, mediaUrl: post.mediaUrl, timestamp: new DateTime.now().millisecondsSinceEpoch, displayType: post.type); return isLiked; } else { await firestoreService.deleteLikes( postId: post.postId, currentUserId: sanjuUser.id, ownerId: post.ownerId); await firestoreService.removeLikeFromActivity( ownerId: post.ownerId, postId: post.postId, currentUserId: sanjuUser.id); return !isLiked; } }, isLiked: _isLiked, icon: FeatherIcons.heart, likeCount: 100, likeColor: colorScheme.primary, likedIcon: Icons.favorite, endColor: colorScheme.primary, startColor: colorScheme.primaryVariant, dotPrimaryColor: colorScheme.primaryVariant, dotSecondaryColor: colorScheme.secondaryVariant, ),
Please help What should I do to get that animation and background work done.
please provide an simple runnable demo
i think you don't get this api meaning. The input of islike is current status,and you should return actual status base on your case(maybe you will request a service, if failed, we shouldn't change the status).
you should change status base on your case, please see detail from demo
https://github.com/fluttercandies/like_button/blob/8ecb015abba463e34fb323f9e13f8a76eb54270b/example/lib/pages/like_button_demo.dart#L306
I have totally same issue here. I think isLiked variable doesn't change after onTap callback function..
In my case it worked when I return true/false instead of isLiked/!isLiked.
isLiked is init value