registration page finish

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

@ -9,6 +9,13 @@
</list>
</value>
</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">
<value>
<list>
@ -328,6 +335,7 @@
</properties>
<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/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/characters-1.2.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/services.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/welcome_screen.dart';
void main() {
runApp(const MyApp());
@ -16,6 +14,7 @@ class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);
Paint.enableDithering = true;
return ScreenUtilInit(
builder: (context, child) {
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/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
@ -22,261 +25,347 @@ class _RegistrationScreenState extends State<RegistrationScreen> {
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: bgColor,
body: Padding(
padding: EdgeInsets.symmetric(horizontal: defaultPadding),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
verticalDirection: VerticalDirection.up,
children: [
SizedBox(height: 51),
SignInButton(
Buttons.Google,
text: "Login with Google",
onPressed: () {},
),
SizedBox(height: 47.h),
ConstrainedBox(
constraints: BoxConstraints(maxWidth: 600.w),
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),
),
body: Stack(
children: [
SingleChildScrollView(
child: SizedBox(
width: double.infinity,
child: Column(
children: [
Padding(
padding: EdgeInsets.only(top: 100.h),
child: AutoSizeText(
"On a besoin de ça!",
style: GoogleFonts.plusJakartaSans(
color: Colors.white,
fontWeight: FontWeight.w600,
fontSize: 30.w),
maxLines: 1,
maxFontSize: 50,
overflow: TextOverflow.fade,
),
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,
),
)),
),
),
),
Padding(
padding: EdgeInsets.only(bottom: 21),
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,
ConstrainedBox(
constraints: BoxConstraints(maxWidth: 600),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
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: 230.h,
child: AutoSizeText(
"Promis cest rapide.",
style: GoogleFonts.plusJakartaSans(
color: Colors.white,
fontWeight: FontWeight.w400,
fontSize: 17.w),
maxFontSize: 20,
textAlign: TextAlign.center,
),
),
],
),
),
),
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, fontSize: 15),
decoration: InputDecoration(
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),
)),
],
),
),
),
),
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: '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(height: 47.h),
ConstrainedBox(
constraints: BoxConstraints(maxWidth: 540),
child: SizedBox(
width: 300.sp,
height: 50,
child: SignInButton(
Buttons.Google,
text: "Login with Google",
onPressed: () {},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(20))),
),
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),
child: ClipRRect(
borderRadius: BorderRadius.circular(10.0),
child: LinearProgressIndicator(
minHeight: 2.5.h,
value: 0.5,
backgroundColor: grayColor,
color: primaryColor,
)),
IgnorePointer(
child: Container(
height: 240.h,
decoration: BoxDecoration(
gradient: LinearGradient(begin: Alignment.topRight, stops: [
0,
1
], 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(
height: 25,
),
Text(
"Explore les nouvelles découvertes musicales de tes amis, et partage leur ton mood.",
style: GoogleFonts.plusJakartaSans(
color: Colors.white,
fontWeight: FontWeight.w200,
fontSize: 15),
ConstrainedBox(
constraints: BoxConstraints(maxWidth: 520),
child: Text(
"Explore les nouvelles découvertes musicales de tes amis, et partage leur ton mood.",
style: GoogleFonts.plusJakartaSans(
color: Colors.white,
fontWeight: FontWeight.w200,
fontSize: 15),
),
),
],
),

@ -8,6 +8,13 @@ packages:
url: "https://pub.dartlang.org"
source: hosted
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:
dependency: transitive
description:

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

Loading…
Cancel
Save