diff --git a/lib/home/huixiang_brand_page.dart b/lib/home/huixiang_brand_page.dart index a7dabb7f..21df2d8f 100644 --- a/lib/home/huixiang_brand_page.dart +++ b/lib/home/huixiang_brand_page.dart @@ -105,20 +105,20 @@ class _BrandPage extends State banner(), buildInfo(), buildTab(), - Container( - decoration: new BoxDecoration( - border: Border( - bottom: - BorderSide(color: Colors.black, width: 0.0)), - color: Colors.black, - ), - key: chiliGlobalKey, - child: Image.asset( - "assets/image/brand_store_cj.png", - fit: BoxFit.fill, - width: double.infinity, - ), - ), + // Container( + // decoration: new BoxDecoration( + // border: Border( + // bottom: + // BorderSide(color: Colors.black, width: 0.0)), + // color: Colors.black, + // ), + // key: chiliGlobalKey, + // child: Image.asset( + // "assets/image/brand_store_cj.png", + // fit: BoxFit.fill, + // width: double.infinity, + // ), + // ), Container( decoration: new BoxDecoration( border: Border( @@ -196,20 +196,20 @@ class _BrandPage extends State SizedBox( height: 16, ), - Container( - decoration: new BoxDecoration( - border: Border( - bottom: - BorderSide(color: Colors.white, width: 0.0)), - color: Colors.white, - ), - key: milkTeaGlobalKey, - child: Image.asset( - "assets/image/brand_store_hx.png", - fit: BoxFit.fill, - width: double.infinity, - ), - ), + // Container( + // decoration: new BoxDecoration( + // border: Border( + // bottom: + // BorderSide(color: Colors.white, width: 0.0)), + // color: Colors.white, + // ), + // key: milkTeaGlobalKey, + // child: Image.asset( + // "assets/image/brand_store_hx.png", + // fit: BoxFit.fill, + // width: double.infinity, + // ), + // ), Container( decoration: new BoxDecoration( border: Border( @@ -279,20 +279,20 @@ class _BrandPage extends State SizedBox( height: 16, ), - Container( - decoration: new BoxDecoration( - border: Border( - bottom: BorderSide( - color: Color(0xff052C4B), width: 0.0)), - color: Color(0xff052C4B), - ), - key: breadGlobalKey, - child: Image.asset( - "assets/image/brand_store_bg.png", - fit: BoxFit.fill, - width: double.infinity, - ), - ), + // Container( + // decoration: new BoxDecoration( + // border: Border( + // bottom: BorderSide( + // color: Color(0xff052C4B), width: 0.0)), + // color: Color(0xff052C4B), + // ), + // key: breadGlobalKey, + // child: Image.asset( + // "assets/image/brand_store_bg.png", + // fit: BoxFit.fill, + // width: double.infinity, + // ), + // ), Container( decoration: new BoxDecoration( border: Border( diff --git a/lib/login/login_page.dart b/lib/login/login_page.dart index 2df5c9b7..d08e2138 100644 --- a/lib/login/login_page.dart +++ b/lib/login/login_page.dart @@ -14,6 +14,7 @@ import 'package:huixiang/generated/l10n.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:dio/dio.dart'; import 'package:huixiang/view_widget/loading_view.dart'; +import 'package:photo_view/photo_view.dart'; import 'package:shared_preferences/shared_preferences.dart'; class LoginPage extends StatefulWidget { @@ -23,7 +24,7 @@ class LoginPage extends StatefulWidget { _MyLoginPageState createState() => _MyLoginPageState(); } -class _MyLoginPageState extends State { +class _MyLoginPageState extends State with TickerProviderStateMixin { var checkStatus = false; var mobileStatus = 0; var verifyStatus = 0; @@ -42,6 +43,7 @@ class _MyLoginPageState extends State { final int initAlpha = 89; int alpha = 89; int changeAlpha = 0; + Animation animation; @override void initState() { @@ -50,9 +52,16 @@ class _MyLoginPageState extends State { client = ApiService(dio); scrollController = ScrollController(keepScrollOffset: false); + alignmentBegin = Alignment.topCenter; + alignmentEnd = Alignment.bottomRight; + animationStart(); + scrollController.addListener(() { RenderBox renderBox = loginKey.currentContext.findRenderObject(); - var screenHeight = MediaQuery.of(context).size.height; + var screenHeight = MediaQuery + .of(context) + .size + .height; var scrollHeight = screenHeight * 1.47; // var spaceHeight = screenHeight * 0.6244; var height = scrollHeight - renderBox.size.height; @@ -67,9 +76,9 @@ class _MyLoginPageState extends State { changeAlpha = (changeAlpha > 255 ? 255 : changeAlpha); changeAlpha = (changeAlpha < 0 ? 0 : changeAlpha); alpha = (initAlpha + - scrollController.offset / - (height - chaHeight) * - (255 - initAlpha)) + scrollController.offset / + (height - chaHeight) * + (255 - initAlpha)) .toInt(); alpha = (alpha > 255 ? 255 : alpha); alpha = (alpha < 0 ? 0 : alpha); @@ -83,30 +92,37 @@ class _MyLoginPageState extends State { _sendCode() async { if (!checkStatus) { - Fluttertoast.showToast(msg: S.of(context).gouxuanxieyi); + Fluttertoast.showToast(msg: S + .of(context) + .gouxuanxieyi); return; } var mobile = _controllerPhone.text; if (mobile == "") { mobileStatus = 2; - mobileErrorText = S.of(context).qingshurushoujihao; + mobileErrorText = S + .of(context) + .qingshurushoujihao; setState(() {}); return; } if (_sendCodeStatus == 0) { client .sendVerify(mobile) - .then((value) => { - if (value.isSuccess) - {_sendCodeStatus = 1, countdown()} - else - { - btnText = S.of(context).send_code, - _sendCodeStatus = 0, - Fluttertoast.showToast(msg: "${value.msg}"), - refresh() - } - }) + .then((value) => + { + if (value.isSuccess) + {_sendCodeStatus = 1, countdown()} + else + { + btnText = S + .of(context) + .send_code, + _sendCodeStatus = 0, + Fluttertoast.showToast(msg: "${value.msg}"), + refresh() + } + }) .catchError((error) { Fluttertoast.showToast(msg: "$error"); }); @@ -121,7 +137,9 @@ class _MyLoginPageState extends State { _timer = Timer.periodic(Duration(seconds: 1), (timer) { countdown--; if (countdown == 0) { - btnText = S.of(context).send_code; + btnText = S + .of(context) + .send_code; _sendCodeStatus = 0; _timer.cancel(); } else { @@ -138,48 +156,60 @@ class _MyLoginPageState extends State { @override void dispose() { if (_timer != null) _timer.cancel(); + if (animatedContainer != null) animatedContainer.dispose(); super.dispose(); } _login() async { // Navigator.of(context).popAndPushNamed('/router/main_page'); // return; + return; if (alpha != 255) { scrollToTop(); return; } if (!checkStatus) { - Fluttertoast.showToast(msg: S.of(context).gouxuanxieyi); + Fluttertoast.showToast(msg: S + .of(context) + .gouxuanxieyi); return; } var mobile = _controllerPhone.text; if (mobile == "") { mobileStatus = 2; - mobileErrorText = S.of(context).qingshurushoujihao; + mobileErrorText = S + .of(context) + .qingshurushoujihao; setState(() {}); return; } if (mobile.length != 11) { mobileStatus = 2; - mobileErrorText = S.of(context).phone_error; + mobileErrorText = S + .of(context) + .phone_error; setState(() {}); return; } var code = _controllerCode.text; if (code == "") { verifyStatus = 2; - codeErrorText = S.of(context).qingshuruyanzhengma; + codeErrorText = S + .of(context) + .qingshuruyanzhengma; setState(() {}); return; } if (code.length != 6) { verifyStatus = 2; - codeErrorText = S.of(context).code_error; + codeErrorText = S + .of(context) + .code_error; setState(() {}); return; } - var paramt = { + var param = { "capcha": code, "mobile": mobile, }; @@ -190,7 +220,7 @@ class _MyLoginPageState extends State { dialogContext = context; return LoadingView(); }); - BaseData value = await client.memberLogin(paramt).catchError((error) { + BaseData value = await client.memberLogin(param).catchError((error) { print(error); Fluttertoast.showToast(msg: "$error"); }); @@ -209,13 +239,69 @@ class _MyLoginPageState extends State { saveUserJson(userJson) { var userEntity = UserEntity.fromJson(userJson); - SharedPreferences.getInstance().then((value) => { - value.setString('userJson', jsonEncode(userJson)), - value.setString('token', userEntity.token), - value.setString('userId', userEntity.userId), - value.setString('nick', userEntity.name), - value.setString('mobile', userEntity.mobile), - }); + SharedPreferences.getInstance().then((value) => + { + value.setString('userJson', jsonEncode(userJson)), + value.setString('token', userEntity.token), + value.setString('userId', userEntity.userId), + value.setString('nick', userEntity.name), + value.setString('mobile', userEntity.mobile), + }); + } + + AnimationController animatedContainer; + + Alignment alignmentBegin; + Alignment alignmentEnd; + Alignment alignmentProgress; + + Function listener() { + alignmentProgress = animation.value; + print("animation $animation"); + setState(() {}); + } + + Function statusListener(status) { + if (status == AnimationStatus.completed) { + if (alignmentEnd == Alignment.bottomRight) { + alignmentBegin = Alignment.bottomRight; + alignmentEnd = Alignment.centerLeft; + } else if (alignmentEnd == Alignment.centerLeft) { + alignmentBegin = Alignment.centerLeft; + alignmentEnd = Alignment.topRight; + } else if (alignmentEnd == Alignment.topRight) { + alignmentBegin = Alignment.topRight; + alignmentEnd = Alignment.bottomLeft; + } else if (alignmentEnd == Alignment.bottomLeft) { + alignmentBegin = Alignment.bottomLeft; + alignmentEnd = Alignment.centerRight; + } else if (alignmentEnd == Alignment.centerRight) { + alignmentBegin = Alignment.centerRight; + alignmentEnd = Alignment.topLeft; + } else if (alignmentEnd == Alignment.topLeft) { + alignmentBegin = Alignment.topLeft; + alignmentEnd = Alignment.bottomRight; + } + animationStart(); + } + } + + animationStart() { + animatedContainer = + AnimationController(vsync: this, duration: Duration(seconds: 10)); + + animation = + AlignmentTween(begin: alignmentBegin, end: alignmentEnd).animate( + animatedContainer); + + animation.removeListener(listener); + animation.addListener(listener); + + animatedContainer.removeStatusListener(statusListener); + animatedContainer.addStatusListener(statusListener); + + animatedContainer.forward(); + } @override @@ -230,29 +316,93 @@ class _MyLoginPageState extends State { child: Stack( children: [ Container( - height: MediaQuery.of(context).size.height * 0.78, + height: MediaQuery + .of(context) + .size + .height * 0.78, child: Stack( alignment: Alignment.center, children: [ - Column( - mainAxisAlignment: MainAxisAlignment.end, - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - Opacity( - opacity: (255 - changeAlpha) / 255, - child: Image.asset( - "assets/image/laoban.png", - width: MediaQuery.of(context).size.width, - fit: BoxFit.fitWidth, - ), - ), - ], + // ShaderMask( + // shaderCallback: (bounds) { + // print("bounds: ============="); + // + // // print("bounds: $value"); + // // if(value != null) { + // // // var dx = value.x * 360.0; + // // // var dy = value.y * 608.0; + // // + // // var dx = (value.x > 123.0 ? value.x : 123.0); + // // var dy = (value.y > 123.0 ? value.y : 123.0); + // // if (value.x > 123.0 && value.y > 123.0) { + // // dx = (value.x < bounds.right ? value.x : bounds.right); + // // dy = (value.y < bounds.bottom ? value.y : bounds.bottom); + // // } + // // bounds = Rect.fromLTRB(dx - 123.0, dy - 123.0, + // // value.x + 123.0, value.y + 123.0); + // // } + // print("bounds: $bounds"); + // + // return RadialGradient( + // radius: 0.5, + // focalRadius: 0.2, + // focal: Alignment.center, + // colors: [ + // Color(0xFF6AC48F).withAlpha(0), + // Color(0xFF5AD48D).withAlpha(alpha), + // ], + // ).createShader(bounds); + // }, + // blendMode: BlendMode.color, + // child: , + // ), + + PhotoView( + imageProvider: AssetImage("assets/image/laoban.png"), + initialScale: 1.02, + basePosition: alignmentProgress, ), + + // ScaleTransition( + // scale: animation, + // alignment: alignment, + // child: Column( + // mainAxisAlignment: MainAxisAlignment.end, + // crossAxisAlignment: CrossAxisAlignment.center, + // children: [ + // Opacity( + // opacity: (255 - changeAlpha) / 255, + // child: Image.asset( + // "assets/image/laoban.png", + // width: MediaQuery.of(context).size.width, + // fit: BoxFit.fitWidth, + // ), + // ), + // ], + // ), + // ), + + // Container( + // decoration: BoxDecoration( + // // color: Color(0xFF6AC48F).withAlpha(changeAlpha), + // gradient: RadialGradient( + // radius: 0.5, + // focalRadius: 0.2, + // focal: Alignment.center, + // colors: [ + // Color(0xFF6AC48F).withAlpha(0), + // Color(0xFF5AD48D).withAlpha(alpha), + // ], + // ), + // ), + // ), Container( decoration: BoxDecoration( + // color: Color(0xFF6AC48F).withAlpha(changeAlpha), gradient: LinearGradient( colors: [ Color(0xFF6AC48F).withAlpha(alpha), + Color(0xFF6AC48F).withAlpha(0), if (alpha < 190) Colors.black.withAlpha(190 - alpha), if (alpha >= 190) Color(0xFF5AD48D).withAlpha(alpha) ], @@ -262,7 +412,10 @@ class _MyLoginPageState extends State { ), ), Container( - height: MediaQuery.of(context).size.height * 0.78, + height: MediaQuery + .of(context) + .size + .height * 0.78, margin: EdgeInsets.only(top: 56), alignment: Alignment.topCenter, child: AspectRatio( @@ -299,11 +452,17 @@ class _MyLoginPageState extends State { controller: scrollController, physics: PageScrollPhysics().applyTo(ClampingScrollPhysics()), child: SizedBox( - height: MediaQuery.of(context).size.height * 1.47, + height: MediaQuery + .of(context) + .size + .height * 1.47, child: Column( children: [ SizedBox( - height: MediaQuery.of(context).size.height * 0.6244, + height: MediaQuery + .of(context) + .size + .height * 0.6244, ), Expanded( child: Container( @@ -321,7 +480,10 @@ class _MyLoginPageState extends State { child: Container( child: Image.asset( "assets/image/icon_login_bg_webp.webp", - width: MediaQuery.of(context).size.width, + width: MediaQuery + .of(context) + .size + .width, fit: BoxFit.cover, ), ), @@ -330,7 +492,10 @@ class _MyLoginPageState extends State { top: 0, ), Positioned( - top: MediaQuery.of(context).size.height * 0.1039, + top: MediaQuery + .of(context) + .size + .height * 0.1039, bottom: 0, child: Container( padding: EdgeInsets.symmetric(horizontal: 40), @@ -436,7 +601,9 @@ class _MyLoginPageState extends State { crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( - S.of(context).input_phone, + S + .of(context) + .input_phone, style: TextStyle( fontSize: 18.sp, color: Colors.black, @@ -444,7 +611,10 @@ class _MyLoginPageState extends State { ), Container( height: 50.h, - width: MediaQuery.of(context).size.width - 80, + width: MediaQuery + .of(context) + .size + .width - 80, child: TextField( style: TextStyle(), onChanged: (value) { @@ -497,7 +667,9 @@ class _MyLoginPageState extends State { height: 35, ), Text( - S.of(context).input_code, + S + .of(context) + .input_code, style: TextStyle( fontSize: 18.sp, color: Colors.black, @@ -505,7 +677,10 @@ class _MyLoginPageState extends State { ), Container( height: 50.h, - width: MediaQuery.of(context).size.width - 80, + width: MediaQuery + .of(context) + .size + .width - 80, child: Stack( children: [ TextField( @@ -545,7 +720,7 @@ class _MyLoginPageState extends State { ), hintText: "", contentPadding: - EdgeInsets.only(top: 12, bottom: 12, left: 12), + EdgeInsets.only(top: 12, bottom: 12, left: 12), hintStyle: TextStyle( fontSize: 10, color: Color(0xFFA29E9E), @@ -579,7 +754,10 @@ class _MyLoginPageState extends State { Expanded( flex: 1, child: Container( - width: MediaQuery.of(context).size.width - 80, + width: MediaQuery + .of(context) + .size + .width - 80, alignment: Alignment.bottomCenter, child: Row( mainAxisAlignment: MainAxisAlignment.center, @@ -598,19 +776,27 @@ class _MyLoginPageState extends State { Text.rich( TextSpan(children: [ TextSpan( - text: S.of(context).privacy_policy1, + text: S + .of(context) + .privacy_policy1, style: TextStyle(fontSize: 11, color: Colors.black)), TextSpan( - text: S.of(context).privacy_policy2, + text: S + .of(context) + .privacy_policy2, style: TextStyle(fontSize: 11, color: Colors.black)), TextSpan( text: "、\n", style: TextStyle(fontSize: 11, color: Colors.black)), TextSpan( - text: S.of(context).privacy_policy3, + text: S + .of(context) + .privacy_policy3, style: TextStyle(fontSize: 11, color: Colors.black)), TextSpan( - text: S.of(context).privacy_policy4, + text: S + .of(context) + .privacy_policy4, style: TextStyle(fontSize: 11, color: Colors.black)), ]), ), @@ -628,7 +814,10 @@ class _MyLoginPageState extends State { scrollToTop() { RenderBox renderBox = loginKey.currentContext.findRenderObject(); - var screenHeight = MediaQuery.of(context).size.height; + var screenHeight = MediaQuery + .of(context) + .size + .height; var scrollHeight = screenHeight * 1.47; var height = scrollHeight - renderBox.size.height; var chaHeight = screenHeight - renderBox.size.height; diff --git a/pubspec.yaml b/pubspec.yaml index 841a9efa..8ecc3da5 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -65,6 +65,7 @@ dependencies: # azlistview: ^1.1.1 flutter_html: ^1.3.0 #2.1.0 + photo_view: ^0.11.1 dev_dependencies: flutter_test: