flutter 收金币效果

class CoinAnimationItem extends StatefulWidget {
  final Offset startOffset, endOffset;///开始结束位置
  final Function(LandAllModel allModel)? onTap;///点击金币回调  可调用回收接口
  final LandAllModel allModel;///所需数据

  const CoinAnimationItem(this.allModel, this.endOffset, this.startOffset, {super.key, this.onTap});

  @override
  State<StatefulWidget> createState() {
    return CoinAnimationItemState();
  }
}

class CoinAnimationItemState extends State<CoinAnimationItem> with SingleTickerProviderStateMixin {
  double top = 0;
  double left = 0;

  AnimationController? _controller;
  Animation? _animation;
  ///是否结束,如果结束就消失整个coinAnimationItem
  bool finish = false;
  ///默认显示小手,点击瞬间小手消失,只有果实动画
  bool begin = false;


  ///开始动画只动一次
  forwardAction() {
    _controller?.forward();
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _controller = AnimationController(duration: const Duration(milliseconds: 1000), vsync: this);
    _animation = Tween(begin: 0, end: 1.0).animate(_controller!)
      ..addListener(() {
        if (_animation?.value > 0.99) {
          _controller?.stop();
          finish = true;

        }
        if (_animation?.value > 0.01) {
          begin = true;
        }
        setState(() {});
      })
      ..addStatusListener((AnimationStatus status) {
        if (status == AnimationStatus.completed) {
          _controller?.stop();

        }
      });
  }

  @override
  void dispose() {
    _controller?.dispose();
    _animation = null;
    _controller = null;
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    // 1. about start
    var startX = widget.startOffset.dx;
    var startY = widget.startOffset.dy;

    // 2. about end
    var endX = widget.endOffset.dx;
    var endY = widget.endOffset.dy;

    // 3. calculate
    var x = startX + (endX - startX) * _animation?.value;
    var y = startY + (endY - startY) * _animation?.value;

    top = y;
    left = x;

    return warpString(widget.allModel.member_mill?.can_receive) == "1"
    // return (!CommonUtils.isEmpty(widget.allModel.member_mill?.id))
        ? Positioned(
            top: top,
            left: left,
            child: (finish == false)
                ? TextButton(
                    onPressed: () {
                      widget.onTap?.call(widget.allModel);

                    },
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Stack(
                          alignment: Alignment.centerLeft,
                          children: [
                            Container(
                              decoration: BoxDecoration(
                                color: AppColors.white.withAlpha(100),
                                borderRadius: const BorderRadius.all(Radius.circular(90)),
                                border: Border.all(color: AppColors.yellow, width: 1.w),
                              ),
                              padding: EdgeInsets.only(left: 20.w, right: 5.w, top: 1.w, bottom: 1.w),
                              child: Center(
                                child: Row(
                                  children: [
                                    NoneText(
                                      widget.allModel.member_mill?.receive_amount,
                                      maxLines: 1,
                                      overflow: TextOverflow.ellipsis,
                                      style: TextStyle(
                                          color: AppColors.mainColor, fontSize: 11.sp, fontWeight: FontWeight.bold),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                            Image.asset(
                              "images/g1.png",
                              width: 18.w,
                              height: 18.w,
                              fit: BoxFit.cover,
                            ),
                          ],
                        ),
                        if (begin == false)
                          Image.asset(
                            "images/keshouhuo.png",
                            width: 40.w,
                            // height: width ?? 98.w,
                          ),
                      ],
                    ),
                  )
                : const SizedBox(),
          )
        : const SizedBox();
  }
}

使用方法

 CoinAnimationItem(
          landList[2],
          Offset(40.w, 10.w),
          Offset(36.w, 165.w),
          onTap: (model) {

//调用接口
          },
          key: guoshiAnimationItemStateList[2],
        ),
326441734681763_.pic.jpg
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容