From d1565f7c2e910580ef79dfd6c22e6a8491897dc9 Mon Sep 17 00:00:00 2001 From: Emre Date: Mon, 14 Aug 2023 16:18:43 +0200 Subject: [PATCH] UI Verify Screen done :white_check_mark: --- .../justMUSIC/assets/images/plane_icon.png | Bin 0 -> 1059 bytes .../lib/screens/verify_email_screen.dart | 169 ++++++++++++++---- 2 files changed, 136 insertions(+), 33 deletions(-) create mode 100644 Sources/justMUSIC/assets/images/plane_icon.png diff --git a/Sources/justMUSIC/assets/images/plane_icon.png b/Sources/justMUSIC/assets/images/plane_icon.png new file mode 100644 index 0000000000000000000000000000000000000000..9283f00270dbba2f43366630d717f9eae525fe18 GIT binary patch literal 1059 zcmV+;1l;?HP)$zdlz|IdsAz8}L<-7EdVusmLFu`$Rf~wa z(u0D6+$2)bRibbaJruL7{Q4ixK$mIe&Y78W?^T%}{1}}(=R4=Scjml?C?FspARxe& z5RF5axe$k9I7H(CBs2+bfS2K0{>Ne(tDx~|a0|Q+KlA^z(O3hGPKV_%48NKZdLQ-o zPnb<(0W>rR9)OS7njUxy{)#$xnno*VTnbzPkHBuWXAsuGCewLwyQb4<0u7o1H^JlZ z6FYMku7x)(KC7nD02(p_?l69VFRaEpmL1DN_}b$02u!17!LpO6h3)VgtMdaMGs>5+ zeD16$r9^{D=fQ*UDI8|^gkgaZtBU2bXGJ$93RJcn*26dK9q}xd81Y2M)8ue{F~ti6 zp9TwIBdb48b_^PEQjORd@VP^oYor^N&%;*O2K!kLVVE0LM*+)@BNihtk92@QnQ$k( z1HZFAdf^^ZU7O*6LfIDb0|Mm3YL?&b2r3 zTxF_vGQ8v>MuTcXqL(Uy7g-Lb@kI2FyWs>=8|K3oF5-NE(^Zl?%WBgj9h_&2c_Pl` z!H?{YDpCO#rWzH;lV@u^I<)m0VS$EN5jd5Sg-xUG!CB-1mTz$*QL)M> znOGz!_FQ}oGbld?-iEIz*_aYMOd3JFEJ`*;f?|x)Ihl?-ZdMcha6M)i9W)+chwX`g dfPeri{sJe-Kuz{iMa}>K002ovPDHLkV1h|s)8+sG literal 0 HcmV?d00001 diff --git a/Sources/justMUSIC/lib/screens/verify_email_screen.dart b/Sources/justMUSIC/lib/screens/verify_email_screen.dart index a4ab1ca..7bcb4a4 100644 --- a/Sources/justMUSIC/lib/screens/verify_email_screen.dart +++ b/Sources/justMUSIC/lib/screens/verify_email_screen.dart @@ -1,10 +1,14 @@ import 'dart:async'; +import 'package:auto_size_text/auto_size_text.dart'; import 'package:firebase_auth/firebase_auth.dart'; import 'package:flutter/Material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:google_fonts/google_fonts.dart'; import 'package:justmusic/main.dart'; +import 'package:justmusic/values/constants.dart'; + +import '../components/login_button.dart'; class VerifyEmailScreen extends StatefulWidget { const VerifyEmailScreen({Key? key}) : super(key: key); @@ -28,8 +32,8 @@ class _VerifyEmailScreenState extends State { sendVerificationEmail(); timer = Timer.periodic( - Duration(seconds: 3), - (_) => checkEmailVerified(), + Duration(seconds: 5), + (_) => checkEmailVerified(), ); } } @@ -55,7 +59,7 @@ class _VerifyEmailScreenState extends State { } cancel() { - Navigator.pushNamed(context, '/welcome'); + Navigator.pushNamed(context, '/register'); MyApp.userViewModel.delete(); } @@ -86,38 +90,137 @@ class _VerifyEmailScreenState extends State { @override Widget build(BuildContext context) { return Scaffold( - appBar: AppBar( - title: Text('Verify Email'), - ), - body: Padding( - padding: EdgeInsets.all(16), - child: - Column(mainAxisAlignment: MainAxisAlignment.center, children: [ - Text('A verification email has been sent to your email.', - style: TextStyle(fontSize: 20), textAlign: TextAlign.center), - SizedBox(height: 24), - ElevatedButton.icon( - style: ElevatedButton.styleFrom( - minimumSize: Size.fromHeight(50), - ), - icon: Icon(Icons.email, size: 32), - label: Text( - 'ResentEmail', - style: TextStyle(fontSize: 24), + backgroundColor: bgColor, + body: Stack( + children: [ + SingleChildScrollView( + child: SizedBox( + width: double.infinity, + child: Column( + children: [ + Padding( + padding: EdgeInsets.only(top: 200.h), + child: Align( + child: SizedBox( + width: 56.h, + child: Image( + image: + AssetImage("assets/images/plane_icon.png")), + ), + )), + Padding( + padding: EdgeInsets.only(top: 43.h), + child: AutoSizeText( + "Verification de ton Email", + style: GoogleFonts.plusJakartaSans( + color: Colors.white, + fontWeight: FontWeight.w600, + fontSize: 24.w), + maxLines: 1, + maxFontSize: 30, + overflow: TextOverflow.fade, + ), + ), + Padding( + padding: EdgeInsets.symmetric(horizontal: defaultPadding), + child: Padding( + padding: EdgeInsets.only(bottom: 50.h), + child: Column( + mainAxisAlignment: MainAxisAlignment.end, + children: [ + SizedBox( + height: 15.h, + ), + SizedBox( + width: 346.h, + child: AutoSizeText( + "Nous vous avons envoyé un lien de confirmation a l'adresse ${MyApp.userViewModel.userCurrent.mail}.\nVeuillez verifier votre messagerie et cliquer sur le lien pour vérifier votre Email.", + style: GoogleFonts.plusJakartaSans( + color: Colors.white, + fontWeight: FontWeight.w100, + fontSize: 16.w), + maxFontSize: 20, + textAlign: TextAlign.center, + ), + ), + ], + ), + ), + ), + Padding( + padding: EdgeInsets.symmetric(horizontal: defaultPadding), + child: SizedBox( + width: 600, + child: LoginButton( + callback: checkEmailVerified, + )), + ), + Align( + child: GestureDetector( + behavior: HitTestBehavior.translucent, + onTap: () { + canResendEmail ? sendVerificationEmail() : null; + }, + child: Padding( + padding: EdgeInsets.only(top: 55), + child: RichText( + textAlign: TextAlign.center, + text: TextSpan( + text: 'Renvoyer l’Email de confirmation', + style: GoogleFonts.plusJakartaSans( + fontSize: 15, + fontWeight: FontWeight.w400, + color: primaryColor), + ), + ), + ), + ), + ), + Align( + child: GestureDetector( + behavior: HitTestBehavior.translucent, + onTap: () { + cancel(); + }, + child: Padding( + padding: EdgeInsets.only(top: 43), + child: RichText( + textAlign: TextAlign.center, + text: TextSpan( + text: 'Revenir a l’étape précédente', + style: GoogleFonts.plusJakartaSans( + fontSize: 15, + fontWeight: FontWeight.w400, + color: primaryColor), + ), + ), + ), + ), + ), + ], ), - onPressed: canResendEmail ? sendVerificationEmail : null, ), - SizedBox(height: 8), - TextButton( - style: ElevatedButton.styleFrom( - minimumSize: Size.fromHeight(50), + ), + Align( + alignment: Alignment.topCenter, + child: ConstrainedBox( + constraints: BoxConstraints(maxWidth: 800), + child: Padding( + padding: EdgeInsets.only( + top: 45.h, left: defaultPadding, right: defaultPadding), + child: ClipRRect( + borderRadius: BorderRadius.circular(10.0), + child: LinearProgressIndicator( + minHeight: 5, + value: 0.75, + backgroundColor: grayColor, + color: primaryColor, + ), + ), ), - child: Text( - 'Cancel', - style: TextStyle(fontSize: 24), - ), - onPressed: cancel, - ) - ]))); + ), + ) + ], + )); } }