import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:yumi/app_localizations.dart';
import 'package:yumi/ui_kit/components/sc_compontent.dart';
import 'package:yumi/main.dart';
import 'package:provider/provider.dart';
import 'package:yumi/ui_kit/components/text/sc_text.dart';
import 'package:yumi/services/gift/gift_animation_manager.dart';


///房间礼物滚屏动画
class LGiftAnimalPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _GiftAnimalPageState();
  }
}

class _GiftAnimalPageState extends State<LGiftAnimalPage>
    with TickerProviderStateMixin {
  @override
  Widget build(BuildContext context) {
    return Container(
      height: 305.w,
      child: Stack(
        children: [
          Consumer<GiftAnimationManager>(
            builder: (context, ref, child) {
              return ref.giftMap[0] != null
                  ? AnimatedBuilder(
                animation: ref.animationControllerList[0].controller,
                builder: (context, child) {
                  return Container(
                    margin: ref.animationControllerList[0].verticalAnimation.value,
                    width: ScreenUtil().screenWidth * 0.75,
                    child: Stack(
                      alignment: AlignmentDirectional.centerStart,
                      clipBehavior: Clip.none,
                      children: [
                        Container(
                          padding: EdgeInsetsDirectional.only(
                            top: 5.w,
                          ),
                          width: ScreenUtil().screenWidth * 0.65,
                          height:
                          35.w,
                          decoration: BoxDecoration(
                            image: DecorationImage(
                              image: AssetImage(
                                getBg(""),
                              ),
                              fit: BoxFit.fill,
                            ),
                          ),
                          child: Row(
                            mainAxisSize: MainAxisSize.min,
                            children: <Widget>[
                              SizedBox(width: 3.w),
                              netImage(
                                url: ref.giftMap[0]!.sendUserPic,
                                shape: BoxShape.circle,
                                width: 25.w,
                                height: 25.w,
                              ),
                              SizedBox(width: 4.w),
                              Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  socialchatNickNameText(
                                    maxWidth: 82.w,
                                    ref.giftMap[0]!.sendUserName ?? "",
                                    fontSize: 12.sp,
                                    fontWeight: FontWeight.w500,
                                    type: "",
                                    needScroll:
                                    (ref
                                        .giftMap[0]!
                                        .sendUserName
                                        .characters
                                        .length ??
                                        0) >
                                        8,
                                  ),
                                  //SizedBox(width: 2.w,),
                                  Row(
                                    children: [
                                      Text(
                                        "${SCAppLocalizations.of(context)!.sendTo} ",
                                        style: TextStyle(
                                          fontSize: 10.sp,
                                          color: Colors.white,
                                        ),
                                      ),
                                      ConstrainedBox(
                                        constraints: BoxConstraints(
                                          maxWidth: 62.w,
                                        ),
                                        child: Text(
                                          "${ref.giftMap[0]?.sendToUserName}",
                                          maxLines: 1,
                                          overflow: TextOverflow.ellipsis,
                                          style: TextStyle(
                                            fontSize: 10.sp,
                                            color:Color(0xFFFFD400),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                ],
                              ),
                              SizedBox(width: 4.w),
                            ],
                          ),
                        ),
                        Positioned(
                          left: 155.w,
                          child: Row(
                            children: <Widget>[
                              netImage(
                                url: ref.giftMap[0]!.giftPic,
                                fit: BoxFit.cover,
                                borderRadius: BorderRadius.circular(4.w),
                                width: 32.w,
                                height: 32.w,
                              ),
                              SizedBox(width: 12.w),
                              Text.rich(
                                TextSpan(
                                  children: [
                                    TextSpan(
                                      text: "x",
                                      style: TextStyle(
                                        fontSize:
                                        ref
                                            .animationControllerList[0]
                                            .sizeAnimation
                                            .value
                                            .w,
                                        fontStyle: FontStyle.italic,
                                        color: Color(0xFFFFD400),
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                    TextSpan(
                                      text:
                                      "${ref.giftMap[0]!.giftCount}",
                                      style: TextStyle(
                                        fontSize:
                                        ref
                                            .animationControllerList[0]
                                            .sizeAnimation
                                            .value,
                                        fontStyle: FontStyle.italic,
                                        color: Color(0xFFFFD400),
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  );
                },
              )
                  : Container();
            },
          ),
          Consumer<GiftAnimationManager>(
            builder: (context, ref, child) {
              return ref.giftMap[1] != null
                  ? AnimatedBuilder(
                animation: ref.animationControllerList[1].controller,
                builder: (context, child) {
                  return Container(
                    margin: ref.animationControllerList[1].verticalAnimation.value,
                    width: ScreenUtil().screenWidth * 0.75,
                    child: Stack(
                      alignment: AlignmentDirectional.centerStart,
                      clipBehavior: Clip.none,
                      children: [
                        Container(
                          padding: EdgeInsetsDirectional.only(
                            top:
                            6.w,
                          ),
                          width: ScreenUtil().screenWidth * 0.65,
                          height:
                          35.w,
                          decoration: BoxDecoration(
                            // borderRadius: BorderRadius.circular(52),
                            // gradient: LinearGradient(
                            //   colors: [
                            //     Color(0xffFFE400),
                            //     Color(0xffFFE400).withOpacity(0.7),
                            //     Color(0xffFFE400).withOpacity(0),
                            //   ]
                            // ),
                            image: DecorationImage(
                              image: AssetImage(
                                getBg(""),
                              ),
                              fit: BoxFit.fill,
                            ),
                          ),
                          child: Row(
                            mainAxisSize: MainAxisSize.min,
                            children: <Widget>[
                              SizedBox(width: 3.w),
                              netImage(
                                url: ref.giftMap[1]!.sendUserPic,
                                shape: BoxShape.circle,
                                width: 25.w,
                                height: 25.w,
                              ),
                              SizedBox(width: 4.w),
                              Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  socialchatNickNameText(
                                    maxWidth: 82.w,
                                    ref.giftMap[1]!.sendUserName ?? "",
                                    fontSize: 12.sp,
                                    fontWeight: FontWeight.w500,
                                    type: "",
                                    needScroll:
                                    (ref
                                        .giftMap[1]!
                                        .sendUserName
                                        .characters
                                        .length ??
                                        0) >
                                        8,
                                  ),
                                  //SizedBox(width: 2.w,),
                                  Row(
                                    children: [
                                      Text(
                                        "${SCAppLocalizations.of(context)!.sendTo} ",
                                        style: TextStyle(
                                          fontSize: 10.sp,
                                          color: Colors.white,
                                        ),
                                      ),
                                      ConstrainedBox(
                                        constraints: BoxConstraints(
                                          maxWidth: 62.w,
                                        ),
                                        child: Text(
                                          "${ref.giftMap[1]?.sendToUserName}",
                                          maxLines: 1,
                                          overflow: TextOverflow.ellipsis,
                                          style: TextStyle(
                                            fontSize: 10.sp,
                                            color:Color(0xFFFFD400),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                ],
                              ),
                              SizedBox(width: 4.w),
                            ],
                          ),
                        ),
                        Positioned(
                          left: 155.w,
                          child: Row(
                            children: <Widget>[
                              netImage(
                                url: ref.giftMap[1]!.giftPic,
                                fit: BoxFit.cover,
                                borderRadius: BorderRadius.circular(4.w),
                                width: 32.w,
                                height: 32.w,
                              ),
                              SizedBox(width: 12.w),
                              Text.rich(
                                TextSpan(
                                  children: [
                                    TextSpan(
                                      text: "x",
                                      style: TextStyle(
                                        fontSize:
                                        ref
                                            .animationControllerList[1]
                                            .sizeAnimation
                                            .value
                                            .w,
                                        fontStyle: FontStyle.italic,
                                        color: Color(0xFFFFD400),
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                    TextSpan(
                                      text:
                                      "${ref.giftMap[1]!.giftCount}",
                                      style: TextStyle(
                                        fontSize:
                                        ref
                                            .animationControllerList[1]
                                            .sizeAnimation
                                            .value,
                                        fontStyle: FontStyle.italic,
                                        color: Color(0xFFFFD400),
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  );
                },
              )
                  : Container();
            },
          ),
          Consumer<GiftAnimationManager>(
            builder: (context, ref, child) {
              return ref.giftMap[2] != null
                  ? AnimatedBuilder(
                animation: ref.animationControllerList[2].controller,
                builder: (context, child) {
                  return Container(
                    margin: ref.animationControllerList[2].verticalAnimation.value,
                    width: ScreenUtil().screenWidth * 0.75,
                    child: Stack(
                      alignment: AlignmentDirectional.centerStart,
                      clipBehavior: Clip.none,
                      children: [
                        Container(
                          padding: EdgeInsetsDirectional.only(
                            top:
                            6.w,
                          ),
                          width: ScreenUtil().screenWidth * 0.65,
                          height:
                          35.w,
                          decoration: BoxDecoration(
                            // borderRadius: BorderRadius.circular(52),
                            // gradient: LinearGradient(
                            //   colors: [
                            //     Color(0xffFFE400),
                            //     Color(0xffFFE400).withOpacity(0.7),
                            //     Color(0xffFFE400).withOpacity(0),
                            //   ]
                            // ),
                            image: DecorationImage(
                              image: AssetImage(
                                getBg(""),
                              ),
                              fit: BoxFit.fill,
                            ),
                          ),
                          child: Row(
                            mainAxisSize: MainAxisSize.min,
                            children: <Widget>[
                              SizedBox(width: 3.w),
                              netImage(
                                url: ref.giftMap[2]!.sendUserPic,
                                shape: BoxShape.circle,
                                width: 25.w,
                                height: 25.w,
                              ),
                              SizedBox(width: 4.w),
                              Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  socialchatNickNameText(
                                    maxWidth: 82.w,
                                    ref.giftMap[2]!.sendUserName ?? "",
                                    fontSize: 12.sp,
                                    fontWeight: FontWeight.w500,
                                    type: "",
                                    needScroll:
                                    (ref
                                        .giftMap[2]!
                                        .sendUserName
                                        .characters
                                        .length ??
                                        0) >
                                        8,
                                  ),
                                  //SizedBox(width: 2.w,),
                                  Row(
                                    children: [
                                      Text(
                                        "${SCAppLocalizations.of(context)!.sendTo} ",
                                        style: TextStyle(
                                          fontSize: 10.sp,
                                          color: Colors.white,
                                        ),
                                      ),
                                      ConstrainedBox(
                                        constraints: BoxConstraints(
                                          maxWidth: 62.w,
                                        ),
                                        child: Text(
                                          "${ref.giftMap[2]?.sendToUserName}",
                                          maxLines: 1,
                                          overflow: TextOverflow.ellipsis,
                                          style: TextStyle(
                                            fontSize: 10.sp,
                                            color:Color(0xFFFFD400),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                ],
                              ),
                              SizedBox(width: 4.w),
                            ],
                          ),
                        ),
                        Positioned(
                          left: 155.w,
                          child: Row(
                            children: <Widget>[
                              netImage(
                                url: ref.giftMap[2]!.giftPic,
                                fit: BoxFit.cover,
                                borderRadius: BorderRadius.circular(4.w),
                                width: 32.w,
                                height: 32.w,
                              ),
                              SizedBox(width: 12.w),
                              Text.rich(
                                TextSpan(
                                  children: [
                                    TextSpan(
                                      text: "x",
                                      style: TextStyle(
                                        fontSize:
                                        ref
                                            .animationControllerList[2]
                                            .sizeAnimation
                                            .value
                                            .w,
                                        fontStyle: FontStyle.italic,
                                        color: Color(0xFFFFD400),
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                    TextSpan(
                                      text:
                                      "${ref.giftMap[2]!.giftCount}",
                                      style: TextStyle(
                                        fontSize:
                                        ref
                                            .animationControllerList[2]
                                            .sizeAnimation
                                            .value,
                                        fontStyle: FontStyle.italic,
                                        color: Color(0xFFFFD400),
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  );
                },
              )
                  : Container();
            },
          ),
          Consumer<GiftAnimationManager>(
            builder: (context, ref, child) {
              return ref.giftMap[3] != null
                  ? AnimatedBuilder(
                animation: ref.animationControllerList[3].controller,
                builder: (context, child) {
                  return Container(
                    margin: ref.animationControllerList[3].verticalAnimation.value,
                    width: ScreenUtil().screenWidth * 0.75,
                    child: Stack(
                      alignment: AlignmentDirectional.centerStart,
                      clipBehavior: Clip.none,
                      children: [
                        Container(
                          padding: EdgeInsetsDirectional.only(
                            top:
                            6.w,
                          ),
                          width: ScreenUtil().screenWidth * 0.65,
                          height:
                          35.w,
                          decoration: BoxDecoration(
                            // borderRadius: BorderRadius.circular(52),
                            // gradient: LinearGradient(
                            //   colors: [
                            //     Color(0xffFFE400),
                            //     Color(0xffFFE400).withOpacity(0.7),
                            //     Color(0xffFFE400).withOpacity(0),
                            //   ]
                            // ),
                            image: DecorationImage(
                              image: AssetImage(
                                getBg(""),
                              ),
                              fit: BoxFit.fill,
                            ),
                          ),
                          child: Row(
                            mainAxisSize: MainAxisSize.min,
                            children: <Widget>[
                              SizedBox(width: 3.w),
                              netImage(
                                url: ref.giftMap[3]!.sendUserPic,
                                shape: BoxShape.circle,
                                width: 25.w,
                                height: 25.w,
                              ),
                              SizedBox(width: 4.w),
                              Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  socialchatNickNameText(
                                    maxWidth: 82.w,
                                    ref.giftMap[3]!.sendUserName ?? "",
                                    fontSize: 12.sp,
                                    fontWeight: FontWeight.w500,
                                    type: "",
                                    needScroll:
                                    (ref
                                        .giftMap[3]!
                                        .sendUserName
                                        .characters
                                        .length ??
                                        0) >
                                        8,
                                  ),
                                  //SizedBox(width: 2.w,),
                                  Row(
                                    children: [
                                      Text(
                                        "${SCAppLocalizations.of(context)!.sendTo} ",
                                        style: TextStyle(
                                          fontSize: 10.sp,
                                          color: Colors.white,
                                        ),
                                      ),
                                      ConstrainedBox(
                                        constraints: BoxConstraints(
                                          maxWidth: 62.w,
                                        ),
                                        child: Text(
                                          "${ref.giftMap[3]?.sendToUserName}",
                                          maxLines: 1,
                                          overflow: TextOverflow.ellipsis,
                                          style: TextStyle(
                                            fontSize: 10.sp,
                                            color:Color(0xFFFFD400),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                ],
                              ),
                              SizedBox(width: 4.w),
                            ],
                          ),
                        ),
                        Positioned(
                          left: 155.w,
                          child: Row(
                            children: <Widget>[
                              netImage(
                                url: ref.giftMap[3]!.giftPic,
                                fit: BoxFit.cover,
                                borderRadius: BorderRadius.circular(4.w),
                                width: 32.w,
                                height: 32.w,
                              ),
                              SizedBox(width: 12.w),
                              Text.rich(
                                TextSpan(
                                  children: [
                                    TextSpan(
                                      text: "x",
                                      style: TextStyle(
                                        fontSize:
                                        ref
                                            .animationControllerList[3]
                                            .sizeAnimation
                                            .value
                                            .w,
                                        fontStyle: FontStyle.italic,
                                        color: Color(0xFFFFD400),
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                    TextSpan(
                                      text:
                                      "${ref.giftMap[3]!.giftCount}",
                                      style: TextStyle(
                                        fontSize:
                                        ref
                                            .animationControllerList[3]
                                            .sizeAnimation
                                            .value,
                                        fontStyle: FontStyle.italic,
                                        color: Color(0xFFFFD400),
                                        fontWeight: FontWeight.bold,
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  );
                },
              )
                  : Container();
            },
          ),
        ],
      ),
    );
  }

  @override
  void dispose() {
    Provider.of<GiftAnimationManager>(
      navigatorKey.currentState!.context,
      listen: false,
    ).cleanupAnimationResources();
    super.dispose();
  }

  @override
  void initState() {
    super.initState();
    initAnimal();
  }

  void initAnimal() {
    List<LGiftScrollingScreenAnimsBean> beans = [];
    double top = 60;
    for (int i = 0; i < 4; i++) {
      var bean = LGiftScrollingScreenAnimsBean();
      var controller = AnimationController(
        value: 0,
        duration: const Duration(milliseconds: 5000),
        vsync: this,
      );
      bean.controller = controller;
      // bean.transverseAnimation = Tween<Offset>(
      //   begin: Offset(ScreenUtil().screenWidth, 0),
      //   end: Offset(0, 0),
      // ).animate(
      //   CurvedAnimation(
      //     parent: controller,
      //     curve: Interval(0.0, 0.45, curve: Curves.ease),
      //   ),
      // );
      bean.verticalAnimation = EdgeInsetsTween(
        begin: EdgeInsets.only(top: top),
        end: EdgeInsets.only(top: 0),
      ).animate(
        CurvedAnimation(
          parent: controller,
          curve: Interval(0.2, 1, curve: Curves.easeOut),
        ),
      );
      bean.sizeAnimation = Tween<double>(begin: 0, end: 22).animate(
        CurvedAnimation(
          parent: controller,
          curve: Interval(0.45, 0.55, curve: Curves.ease),
        ),
      );
      beans.add(bean);
      top = top + 70;
    }
    beans[0].controller.addStatusListener((state) {
      if (state == AnimationStatus.completed) {
        //动画完成监听
        Provider.of<GiftAnimationManager>(
          context,
          listen: false,
        ).markAnimationAsFinished(0);
      }
    });
    beans[1].controller.addStatusListener((state) {
      if (state == AnimationStatus.completed) {
        //动画完成监听
        Provider.of<GiftAnimationManager>(
          context,
          listen: false,
        ).markAnimationAsFinished(1);
      }
    });
    beans[2].controller.addStatusListener((state) {
      if (state == AnimationStatus.completed) {
        //动画完成监听
        Provider.of<GiftAnimationManager>(
          context,
          listen: false,
        ).markAnimationAsFinished(2);
      }
    });
    beans[3].controller.addStatusListener((state) {
      if (state == AnimationStatus.completed) {
        //动画完成监听
        Provider.of<GiftAnimationManager>(
          context,
          listen: false,
        ).markAnimationAsFinished(3);
      }
    });
    Provider.of<GiftAnimationManager>(
      context,
      listen: false,
    ).attachAnimationControllers(beans);
  }

  String getBg(String type) {
    return "sc_images/room/sc_icon_room_gift_left_no_vip_bg.png";
  }
}

class LGiftScrollingScreenAnimsBean {
  // late Animation<Offset> transverseAnimation;
  late Animation<EdgeInsets> verticalAnimation;
  late AnimationController controller;
  late Animation<double> sizeAnimation;
}

class LGiftModel {
  //发送者的名字
  String sendUserName = "";

  //发送给谁
  String sendToUserName = "";

  //发送者的头像
  String sendUserPic = "";

  //礼物的图片
  String giftPic = "";

  //礼物的名字
  String giftName = "";

  //一次发送礼物的数量
  num giftCount = 0;

  //id
  String labelId = "";

}
