registration page finish

pull/14/head
Lucas Delanier 2 years ago
parent 686b601735
commit ffd9015dfe

@ -9,6 +9,13 @@
</list> </list>
</value> </value>
</entry> </entry>
<entry key="auto_size_text">
<value>
<list>
<option value="$USER_HOME$/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/auto_size_text-3.0.0/lib" />
</list>
</value>
</entry>
<entry key="boolean_selector"> <entry key="boolean_selector">
<value> <value>
<list> <list>
@ -328,6 +335,7 @@
</properties> </properties>
<CLASSES> <CLASSES>
<root url="file://$USER_HOME$/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/async-2.9.0/lib" /> <root url="file://$USER_HOME$/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/async-2.9.0/lib" />
<root url="file://$USER_HOME$/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/auto_size_text-3.0.0/lib" />
<root url="file://$USER_HOME$/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/boolean_selector-2.1.0/lib" /> <root url="file://$USER_HOME$/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/boolean_selector-2.1.0/lib" />
<root url="file://$USER_HOME$/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/characters-1.2.1/lib" /> <root url="file://$USER_HOME$/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/characters-1.2.1/lib" />
<root url="file://$USER_HOME$/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/clock-1.1.1/lib" /> <root url="file://$USER_HOME$/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/clock-1.1.1/lib" />

@ -1,9 +1,7 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart'; import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:justmusic/screens/login_screen.dart';
import 'package:justmusic/screens/registration_screen.dart'; import 'package:justmusic/screens/registration_screen.dart';
import 'package:justmusic/screens/welcome_screen.dart';
void main() { void main() {
runApp(const MyApp()); runApp(const MyApp());
@ -16,6 +14,7 @@ class MyApp extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky); SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);
Paint.enableDithering = true;
return ScreenUtilInit( return ScreenUtilInit(
builder: (context, child) { builder: (context, child) {
return MaterialApp( return MaterialApp(

@ -1,3 +1,6 @@
import 'dart:ui';
import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart';
@ -22,261 +25,347 @@ class _RegistrationScreenState extends State<RegistrationScreen> {
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Scaffold( return Scaffold(
backgroundColor: bgColor, backgroundColor: bgColor,
body: Padding( body: Stack(
padding: EdgeInsets.symmetric(horizontal: defaultPadding), children: [
child: Column( SingleChildScrollView(
mainAxisAlignment: MainAxisAlignment.spaceBetween, child: SizedBox(
verticalDirection: VerticalDirection.up, width: double.infinity,
children: [ child: Column(
SizedBox(height: 51), children: [
SignInButton( Padding(
Buttons.Google, padding: EdgeInsets.only(top: 100.h),
text: "Login with Google", child: AutoSizeText(
onPressed: () {}, "On a besoin de ça!",
), style: GoogleFonts.plusJakartaSans(
SizedBox(height: 47.h), color: Colors.white,
ConstrainedBox( fontWeight: FontWeight.w600,
constraints: BoxConstraints(maxWidth: 600.w), fontSize: 30.w),
child: Row( maxLines: 1,
mainAxisAlignment: MainAxisAlignment.spaceEvenly, maxFontSize: 50,
children: [ overflow: TextOverflow.fade,
Expanded(
child: Container(
color: Color(0xFF3D3D3D),
height: 1,
),
),
Padding(
padding: const EdgeInsets.only(
left: defaultPadding, right: defaultPadding),
child: Text(
'Ou',
style: GoogleFonts.plusJakartaSans(
color: Colors.white, fontWeight: FontWeight.bold),
),
), ),
Expanded(
child: Container(
height: 1,
color: Color(0xFF3D3D3D),
)),
],
),
),
SizedBox(height: 98.h),
SizedBox(width: 600.w, child: LoginButton()),
Padding(
padding: EdgeInsets.only(bottom: 25),
child: TextFormField(
obscureText: passenable,
validator: (value) {
if (value == null || value.isEmpty) {
return 'TODO';
}
return null;
},
cursorColor: primaryColor,
keyboardType: TextInputType.emailAddress,
style: GoogleFonts.plusJakartaSans(color: primaryColor),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(width: 1, color: strokeTextField),
borderRadius: BorderRadius.all(Radius.circular(10))),
contentPadding:
EdgeInsets.only(top: 0, bottom: 0, left: defaultPadding),
fillColor: bgTextField,
filled: true,
focusColor: Color.fromRGBO(255, 255, 255, 0.30),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(width: 1, color: strokeTextField),
borderRadius: BorderRadius.all(Radius.circular(10))),
hintText: 'Confirmation du Mot de passe',
hintStyle:
GoogleFonts.plusJakartaSans(color: strokeTextField),
suffixIcon: Container(
padding: EdgeInsets.only(right: 10),
margin: EdgeInsets.all(5),
height: 3,
child: InkWell(
onTap: () {
setState(() {
if (passenable) {
passenable = false;
} else {
passenable = true;
}
});
}, // Image tapped
splashColor: Colors.white10, // Splash color over image
child: Image(
image: passenable
? AssetImage("assets/images/show_icon.png")
: AssetImage("assets/images/hide_icon.png"),
height: 2,
),
)),
), ),
), ConstrainedBox(
), constraints: BoxConstraints(maxWidth: 600),
Padding( child: Column(
padding: EdgeInsets.only(bottom: 21), mainAxisAlignment: MainAxisAlignment.start,
child: TextFormField( children: [
obscureText: passenable, Padding(
validator: (value) { padding:
if (value == null || value.isEmpty) { EdgeInsets.symmetric(horizontal: defaultPadding),
return 'TODO'; child: Padding(
} padding: EdgeInsets.only(bottom: 50.h),
return null; child: Column(
}, mainAxisAlignment: MainAxisAlignment.end,
cursorColor: primaryColor, children: [
keyboardType: TextInputType.emailAddress, SizedBox(
style: GoogleFonts.plusJakartaSans(color: primaryColor), height: 15.h,
decoration: InputDecoration( ),
focusedBorder: OutlineInputBorder( SizedBox(
borderSide: BorderSide(width: 1, color: strokeTextField), width: 230.h,
borderRadius: BorderRadius.all(Radius.circular(10))), child: AutoSizeText(
contentPadding: "Promis cest rapide.",
EdgeInsets.only(top: 0, bottom: 0, left: defaultPadding), style: GoogleFonts.plusJakartaSans(
fillColor: bgTextField, color: Colors.white,
filled: true, fontWeight: FontWeight.w400,
focusColor: Color.fromRGBO(255, 255, 255, 0.30), fontSize: 17.w),
enabledBorder: OutlineInputBorder( maxFontSize: 20,
borderSide: BorderSide(width: 1, color: strokeTextField), textAlign: TextAlign.center,
borderRadius: BorderRadius.all(Radius.circular(10))), ),
hintText: 'Mot de passe', ),
hintStyle: ],
GoogleFonts.plusJakartaSans(color: strokeTextField), ),
suffixIcon: Container( ),
padding: EdgeInsets.only(right: 10), ),
margin: EdgeInsets.all(5), Padding(
height: 3, padding: EdgeInsets.only(
child: InkWell( bottom: 16.h,
onTap: () { left: defaultPadding,
setState(() { right: defaultPadding),
if (passenable) { child: TextFormField(
passenable = false; validator: (value) {
} else { if (value == null || value.isEmpty) {
passenable = true; return 'TODO';
} }
}); return null;
}, // Image tapped },
splashColor: Colors.white10, // Splash color over image cursorColor: primaryColor,
child: Image( keyboardType: TextInputType.emailAddress,
image: passenable style: GoogleFonts.plusJakartaSans(
? AssetImage("assets/images/show_icon.png") color: primaryColor, fontSize: 15),
: AssetImage("assets/images/hide_icon.png"), decoration: InputDecoration(
height: 2, focusedBorder: OutlineInputBorder(
borderSide: BorderSide(
width: 1.sp, color: strokeTextField),
borderRadius: const BorderRadius.all(
Radius.circular(10))),
contentPadding: const EdgeInsets.only(
top: 0, bottom: 0, left: defaultPadding),
fillColor: bgTextField,
filled: true,
focusColor:
const Color.fromRGBO(255, 255, 255, 0.30),
enabledBorder: const OutlineInputBorder(
borderSide: BorderSide(
width: 1, color: strokeTextField),
borderRadius: BorderRadius.all(
Radius.circular(10))),
hintText: 'Pseudo',
hintStyle: GoogleFonts.plusJakartaSans(
color: strokeTextField)),
)),
Padding(
padding: EdgeInsets.only(
bottom: 16.h,
left: defaultPadding,
right: defaultPadding),
child: TextFormField(
validator: (value) {
if (value == null || value.isEmpty) {
return 'TODO';
}
return null;
},
cursorColor: primaryColor,
keyboardType: TextInputType.emailAddress,
style: GoogleFonts.plusJakartaSans(
color: primaryColor),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(
width: 1, color: strokeTextField),
borderRadius: BorderRadius.all(
Radius.circular(10))),
contentPadding: EdgeInsets.only(
top: 0, bottom: 0, left: defaultPadding),
fillColor: bgTextField,
filled: true,
focusColor:
Color.fromRGBO(255, 255, 255, 0.30),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
width: 1, color: strokeTextField),
borderRadius: BorderRadius.all(
Radius.circular(10))),
hintText: 'Email',
hintStyle: GoogleFonts.plusJakartaSans(
color: strokeTextField)),
)),
Padding(
padding: EdgeInsets.only(
bottom: 16.h,
left: defaultPadding,
right: defaultPadding),
child: TextFormField(
obscureText: passenable,
validator: (value) {
if (value == null || value.isEmpty) {
return 'TODO';
}
return null;
},
cursorColor: primaryColor,
keyboardType: TextInputType.emailAddress,
style: GoogleFonts.plusJakartaSans(
color: primaryColor),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(
width: 1, color: strokeTextField),
borderRadius:
BorderRadius.all(Radius.circular(10))),
contentPadding: EdgeInsets.only(
top: 0, bottom: 0, left: defaultPadding),
fillColor: bgTextField,
filled: true,
focusColor: Color.fromRGBO(255, 255, 255, 0.30),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
width: 1, color: strokeTextField),
borderRadius:
BorderRadius.all(Radius.circular(10))),
hintText: 'Mot de passe',
hintStyle: GoogleFonts.plusJakartaSans(
color: strokeTextField),
suffixIcon: Container(
padding: EdgeInsets.only(right: 10),
margin: EdgeInsets.all(5),
height: 3,
child: InkWell(
onTap: () {
setState(() {
if (passenable) {
passenable = false;
} else {
passenable = true;
}
});
}, // Image tapped
splashColor: Colors
.white10, // Splash color over image
child: Image(
image: passenable
? AssetImage(
"assets/images/show_icon.png")
: AssetImage(
"assets/images/hide_icon.png"),
height: 2,
),
)),
),
),
),
Padding(
padding: EdgeInsets.only(
bottom: 16.h,
left: defaultPadding,
right: defaultPadding),
child: TextFormField(
obscureText: passenable,
validator: (value) {
if (value == null || value.isEmpty) {
return 'TODO';
}
return null;
},
cursorColor: primaryColor,
keyboardType: TextInputType.emailAddress,
style: GoogleFonts.plusJakartaSans(
color: primaryColor),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(
width: 1, color: strokeTextField),
borderRadius:
BorderRadius.all(Radius.circular(10))),
contentPadding: EdgeInsets.only(
top: 0, bottom: 0, left: defaultPadding),
fillColor: bgTextField,
filled: true,
focusColor: Color.fromRGBO(255, 255, 255, 0.30),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
width: 1, color: strokeTextField),
borderRadius:
BorderRadius.all(Radius.circular(10))),
hintText: 'Confirmation du Mot de passe',
hintStyle: GoogleFonts.plusJakartaSans(
color: strokeTextField),
suffixIcon: Container(
padding: EdgeInsets.only(right: 10),
margin: EdgeInsets.all(5),
height: 3,
child: InkWell(
onTap: () {
setState(() {
if (passenable) {
passenable = false;
} else {
passenable = true;
}
});
}, // Image tapped
splashColor: Colors
.white10, // Splash color over image
child: Image(
image: passenable
? AssetImage(
"assets/images/show_icon.png")
: AssetImage(
"assets/images/hide_icon.png"),
height: 2,
),
)),
),
),
),
Padding(
padding:
EdgeInsets.symmetric(horizontal: defaultPadding),
child: SizedBox(width: 600, child: LoginButton()),
),
],
)),
SizedBox(height: 50.h),
ConstrainedBox(
constraints: BoxConstraints(maxWidth: 600),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Expanded(
child: Container(
color: Color(0xFF3D3D3D),
height: 1,
), ),
),
Padding(
padding: const EdgeInsets.only(
left: defaultPadding, right: defaultPadding),
child: Text(
'Ou',
style: GoogleFonts.plusJakartaSans(
color: Colors.white, fontWeight: FontWeight.bold),
),
),
Expanded(
child: Container(
height: 1,
color: Color(0xFF3D3D3D),
)), )),
],
),
), ),
), SizedBox(height: 47.h),
), ConstrainedBox(
Padding( constraints: BoxConstraints(maxWidth: 540),
padding: EdgeInsets.only(bottom: 21), child: SizedBox(
child: TextFormField( width: 300.sp,
validator: (value) { height: 50,
if (value == null || value.isEmpty) { child: SignInButton(
return 'TODO'; Buttons.Google,
} text: "Login with Google",
return null; onPressed: () {},
}, shape: RoundedRectangleBorder(
cursorColor: primaryColor, borderRadius: BorderRadius.all(Radius.circular(20))),
keyboardType: TextInputType.emailAddress,
style: GoogleFonts.plusJakartaSans(color: primaryColor),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderSide:
BorderSide(width: 1, color: strokeTextField),
borderRadius: BorderRadius.all(Radius.circular(10))),
contentPadding: EdgeInsets.only(
top: 0, bottom: 0, left: defaultPadding),
fillColor: bgTextField,
filled: true,
focusColor: Color.fromRGBO(255, 255, 255, 0.30),
enabledBorder: OutlineInputBorder(
borderSide:
BorderSide(width: 1, color: strokeTextField),
borderRadius: BorderRadius.all(Radius.circular(10))),
hintText: 'Email',
hintStyle:
GoogleFonts.plusJakartaSans(color: strokeTextField)),
)),
Padding(
padding: EdgeInsets.only(bottom: 21),
child: TextFormField(
validator: (value) {
if (value == null || value.isEmpty) {
return 'TODO';
}
return null;
},
cursorColor: primaryColor,
keyboardType: TextInputType.emailAddress,
style: GoogleFonts.plusJakartaSans(color: primaryColor),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderSide:
BorderSide(width: 1, color: strokeTextField),
borderRadius: BorderRadius.all(Radius.circular(10))),
contentPadding: EdgeInsets.only(
top: 0, bottom: 0, left: defaultPadding),
fillColor: bgTextField,
filled: true,
focusColor: Color.fromRGBO(255, 255, 255, 0.30),
enabledBorder: OutlineInputBorder(
borderSide:
BorderSide(width: 1, color: strokeTextField),
borderRadius: BorderRadius.all(Radius.circular(10))),
hintText: 'Pseudo',
hintStyle:
GoogleFonts.plusJakartaSans(color: strokeTextField)),
)),
Flexible(
flex: 3,
child: Padding(
padding: EdgeInsets.only(bottom: 63.h),
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Text(
"On a besoin de ça!",
style: GoogleFonts.plusJakartaSans(
color: Colors.white,
fontWeight: FontWeight.w600,
fontSize: 34.h),
),
SizedBox(
height: 15.h,
), ),
SizedBox( ),
width: 230.w,
child: Text(
"Promis cest rapide.",
style: GoogleFonts.plusJakartaSans(
color: Colors.white,
fontWeight: FontWeight.w400,
fontSize: 17.h),
textAlign: TextAlign.center,
),
),
],
), ),
), ],
), ),
Padding( )),
padding: EdgeInsets.only(top: 45.h), IgnorePointer(
child: ClipRRect( child: Container(
borderRadius: BorderRadius.circular(10.0), height: 240.h,
child: LinearProgressIndicator( decoration: BoxDecoration(
minHeight: 2.5.h, gradient: LinearGradient(begin: Alignment.topRight, stops: [
value: 0.5, 0,
backgroundColor: grayColor, 1
color: primaryColor, ], colors: [
bgColor.withOpacity(1),
bgColor.withOpacity(0)
])),
),
),
Align(
alignment: Alignment.topCenter,
child: ConstrainedBox(
constraints: BoxConstraints(maxWidth: 800),
child: Padding(
padding: EdgeInsets.only(
top: 45, left: defaultPadding, right: defaultPadding),
child: ClipRRect(
borderRadius: BorderRadius.circular(10.0),
child: LinearProgressIndicator(
minHeight: 5,
value: 0.5,
backgroundColor: grayColor,
color: primaryColor,
),
), ),
), ),
), ),
], ),
), ],
), ),
); );
} }

@ -47,12 +47,15 @@ class WellcomeScreen extends StatelessWidget {
SizedBox( SizedBox(
height: 25, height: 25,
), ),
Text( ConstrainedBox(
"Explore les nouvelles découvertes musicales de tes amis, et partage leur ton mood.", constraints: BoxConstraints(maxWidth: 520),
style: GoogleFonts.plusJakartaSans( child: Text(
color: Colors.white, "Explore les nouvelles découvertes musicales de tes amis, et partage leur ton mood.",
fontWeight: FontWeight.w200, style: GoogleFonts.plusJakartaSans(
fontSize: 15), color: Colors.white,
fontWeight: FontWeight.w200,
fontSize: 15),
),
), ),
], ],
), ),

@ -8,6 +8,13 @@ packages:
url: "https://pub.dartlang.org" url: "https://pub.dartlang.org"
source: hosted source: hosted
version: "2.9.0" version: "2.9.0"
auto_size_text:
dependency: "direct main"
description:
name: auto_size_text
url: "https://pub.dartlang.org"
source: hosted
version: "3.0.0"
boolean_selector: boolean_selector:
dependency: transitive dependency: transitive
description: description:

@ -41,6 +41,7 @@ dependencies:
smooth_corner: ^1.1.0 smooth_corner: ^1.1.0
flutter_signin_button: ^2.0.0 flutter_signin_button: ^2.0.0
flutter_screenutil: ^5.7.0 flutter_screenutil: ^5.7.0
auto_size_text: ^3.0.0
dev_dependencies: dev_dependencies:
flutter_test: flutter_test:

Loading…
Cancel
Save