flutter Like A Post With Heart动画(动态设置)

7gs2gvoe  于 2023-05-29  发布在  Flutter
关注(0)|答案(1)|浏览(129)

我尝试(双击容器)在屏幕上显示心脏动画。我希望它与like_button库(其中已经有我想要的心脏动画),但不是用户单击like按钮,我希望它是在容器上使用双击。我知道这个库不支持这个,但是有没有人做了一个分支或者修改它,使它成为可能?谢谢!下面是一些示例代码,您可以使用它们来测试库:

import 'package:flutter/material.dart';
import 'package:like_button/like_button.dart';

class LikeAnimationWidget extends StatefulWidget {
  @override
  _LikeAnimationWidgetState createState() => _LikeAnimationWidgetState();
}

class _LikeAnimationWidgetState extends State<LikeAnimationWidget> {
  bool liked = false;

  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        SizedBox(height: 100),
        LikeButton(
          onTap: (bool isLiked) async {
            setState(() {
              liked = !isLiked;
            });
            return !isLiked;
          },
          isLiked: liked,
          size: 200,
          circleColor:
              CircleColor(start: Color(0xff00ddff), end: Color(0xff0099cc)),
          bubblesColor: BubblesColor(
            dotPrimaryColor: Color(0xff33b5e5),
            dotSecondaryColor: Color(0xff0099cc),
          ),
          likeBuilder: (bool isLiked) {
            return Icon(
              Icons.favorite,
              color: isLiked ? Colors.deepPurpleAccent : Colors.grey,
              size: 50,
            );
          },
          countBuilder: (int? count, bool isLiked, String text) {
            var color = isLiked ? Colors.deepPurpleAccent : Colors.grey;
            Widget result;
            if (count == 0) {
              result = Text(
                "love",
                style: TextStyle(color: color),
              );
            } else {
              result = Text(
                text,
                style: TextStyle(color: color),
              );
            }
            return result;
          },
        ),
      ],
    );
  }
}
zynd9foi

zynd9foi1#

您可以覆盖LikeButton类中的函数onTap并实现GestureListener。很可能甚至会有一个已经实现了你只是修改。这可以通过创建类MyLikeButton并扩展LikeButton类来完成。然后,您可以使用@Override标记覆盖onTap函数并使其生效,以便在双击时触发onTap事件。
如何用手势监听器实现双击手势可以阅读here

相关问题