Skip to content

Commit 4b0cf29

Browse files
committed
firebase part 02
1 parent 98ce41b commit 4b0cf29

File tree

5 files changed

+391
-15
lines changed

5 files changed

+391
-15
lines changed

lib/main.dart

Lines changed: 3 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import 'package:firebase_app_web/pages/SignInPage.dart';
2+
import 'package:firebase_app_web/pages/SignUpPage.dart';
13
import 'package:firebase_core/firebase_core.dart';
24
import 'package:flutter/material.dart';
35
import 'package:firebase_auth/firebase_auth.dart' as firebase_auth;
@@ -30,19 +32,7 @@ class _MyAppState extends State<MyApp> {
3032
@override
3133
Widget build(BuildContext context) {
3234
return MaterialApp(
33-
home: Scaffold(
34-
appBar: AppBar(
35-
title: Text("Firebase"),
36-
),
37-
body: Center(
38-
child: ElevatedButton(
39-
onPressed: () {
40-
signup();
41-
},
42-
child: Text("Signup"),
43-
),
44-
),
45-
),
35+
home: SignUpPage(),
4636
);
4737
}
4838
}

lib/pages/SignInPage.dart

Lines changed: 180 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,180 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:flutter_svg/flutter_svg.dart';
3+
4+
class SignInPage extends StatefulWidget {
5+
SignInPage({Key key}) : super(key: key);
6+
7+
@override
8+
_SignInPageState createState() => _SignInPageState();
9+
}
10+
11+
class _SignInPageState extends State<SignInPage> {
12+
@override
13+
Widget build(BuildContext context) {
14+
return Scaffold(
15+
body: SingleChildScrollView(
16+
child: Container(
17+
height: MediaQuery.of(context).size.height,
18+
width: MediaQuery.of(context).size.width,
19+
color: Colors.black,
20+
child: Column(
21+
mainAxisAlignment: MainAxisAlignment.center,
22+
children: [
23+
Text(
24+
"Sign In",
25+
style: TextStyle(
26+
fontSize: 35,
27+
color: Colors.white,
28+
fontWeight: FontWeight.bold,
29+
),
30+
),
31+
SizedBox(
32+
height: 20,
33+
),
34+
buttonItem("assets/google.svg", "Continue with Google", 25),
35+
SizedBox(
36+
height: 15,
37+
),
38+
buttonItem("assets/phone.svg", "Continue with Mobile", 30),
39+
SizedBox(
40+
height: 18,
41+
),
42+
Text(
43+
"Or",
44+
style: TextStyle(color: Colors.white, fontSize: 18),
45+
),
46+
SizedBox(
47+
height: 18,
48+
),
49+
textItem("Email...."),
50+
SizedBox(
51+
height: 15,
52+
),
53+
textItem("Password..."),
54+
SizedBox(
55+
height: 40,
56+
),
57+
colorButton(),
58+
SizedBox(
59+
height: 20,
60+
),
61+
Row(
62+
mainAxisAlignment: MainAxisAlignment.center,
63+
children: [
64+
Text(
65+
"If you don't have an Account? ",
66+
style: TextStyle(
67+
color: Colors.white,
68+
fontSize: 16,
69+
),
70+
),
71+
Text(
72+
"SignUp",
73+
style: TextStyle(
74+
color: Colors.white,
75+
fontSize: 16,
76+
fontWeight: FontWeight.w600,
77+
),
78+
),
79+
],
80+
),
81+
SizedBox(
82+
height: 10,
83+
),
84+
Text(
85+
"Forgot Password?",
86+
style: TextStyle(
87+
color: Colors.white,
88+
fontSize: 16,
89+
fontWeight: FontWeight.w600,
90+
),
91+
),
92+
],
93+
),
94+
),
95+
),
96+
);
97+
}
98+
99+
Widget colorButton() {
100+
return Container(
101+
width: MediaQuery.of(context).size.width - 100,
102+
height: 60,
103+
decoration: BoxDecoration(
104+
borderRadius: BorderRadius.circular(20),
105+
gradient: LinearGradient(
106+
colors: [Color(0xfffd746c), Color(0xffff9068), Color(0xfffd746c)]),
107+
),
108+
child: Center(
109+
child: Text(
110+
"Sign In",
111+
style: TextStyle(
112+
color: Colors.white,
113+
fontSize: 20,
114+
),
115+
),
116+
),
117+
);
118+
}
119+
120+
Widget buttonItem(String imagepath, String buttonName, double size) {
121+
return Container(
122+
width: MediaQuery.of(context).size.width - 60,
123+
height: 60,
124+
child: Card(
125+
color: Colors.black,
126+
elevation: 8,
127+
shape: RoundedRectangleBorder(
128+
borderRadius: BorderRadius.circular(15),
129+
side: BorderSide(
130+
width: 1,
131+
color: Colors.grey,
132+
),
133+
),
134+
child: Row(
135+
mainAxisAlignment: MainAxisAlignment.center,
136+
children: [
137+
SvgPicture.asset(
138+
imagepath,
139+
height: size,
140+
width: size,
141+
),
142+
SizedBox(
143+
width: 15,
144+
),
145+
Text(
146+
buttonName,
147+
style: TextStyle(
148+
color: Colors.white,
149+
fontSize: 17,
150+
),
151+
),
152+
],
153+
),
154+
),
155+
);
156+
}
157+
158+
Widget textItem(String labeltext) {
159+
return Container(
160+
width: MediaQuery.of(context).size.width - 70,
161+
height: 55,
162+
child: TextFormField(
163+
decoration: InputDecoration(
164+
labelText: labeltext,
165+
labelStyle: TextStyle(
166+
fontSize: 17,
167+
color: Colors.white,
168+
),
169+
enabledBorder: OutlineInputBorder(
170+
borderRadius: BorderRadius.circular(15),
171+
borderSide: BorderSide(
172+
width: 1,
173+
color: Colors.grey,
174+
),
175+
),
176+
),
177+
),
178+
);
179+
}
180+
}

lib/pages/SignUpPage.dart

Lines changed: 169 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,169 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:flutter_svg/flutter_svg.dart';
3+
4+
class SignUpPage extends StatefulWidget {
5+
SignUpPage({Key key}) : super(key: key);
6+
7+
@override
8+
_SignUpPageState createState() => _SignUpPageState();
9+
}
10+
11+
class _SignUpPageState extends State<SignUpPage> {
12+
@override
13+
Widget build(BuildContext context) {
14+
return Scaffold(
15+
body: SingleChildScrollView(
16+
child: Container(
17+
height: MediaQuery.of(context).size.height,
18+
width: MediaQuery.of(context).size.width,
19+
color: Colors.black,
20+
child: Column(
21+
mainAxisAlignment: MainAxisAlignment.center,
22+
children: [
23+
Text(
24+
"Sign Up",
25+
style: TextStyle(
26+
fontSize: 35,
27+
color: Colors.white,
28+
fontWeight: FontWeight.bold,
29+
),
30+
),
31+
SizedBox(
32+
height: 20,
33+
),
34+
buttonItem("assets/google.svg", "Continue with Google", 25),
35+
SizedBox(
36+
height: 15,
37+
),
38+
buttonItem("assets/phone.svg", "Continue with Mobile", 30),
39+
SizedBox(
40+
height: 18,
41+
),
42+
Text(
43+
"Or",
44+
style: TextStyle(color: Colors.white, fontSize: 18),
45+
),
46+
SizedBox(
47+
height: 18,
48+
),
49+
textItem("Email...."),
50+
SizedBox(
51+
height: 15,
52+
),
53+
textItem("Password..."),
54+
SizedBox(
55+
height: 40,
56+
),
57+
colorButton(),
58+
SizedBox(
59+
height: 20,
60+
),
61+
Row(
62+
mainAxisAlignment: MainAxisAlignment.center,
63+
children: [
64+
Text(
65+
"If you alredy have an Account? ",
66+
style: TextStyle(
67+
color: Colors.white,
68+
fontSize: 16,
69+
),
70+
),
71+
Text(
72+
"Login",
73+
style: TextStyle(
74+
color: Colors.white,
75+
fontSize: 16,
76+
fontWeight: FontWeight.w600,
77+
),
78+
),
79+
],
80+
),
81+
],
82+
),
83+
),
84+
),
85+
);
86+
}
87+
88+
Widget colorButton() {
89+
return Container(
90+
width: MediaQuery.of(context).size.width - 100,
91+
height: 60,
92+
decoration: BoxDecoration(
93+
borderRadius: BorderRadius.circular(20),
94+
gradient: LinearGradient(
95+
colors: [Color(0xfffd746c), Color(0xffff9068), Color(0xfffd746c)]),
96+
),
97+
child: Center(
98+
child: Text(
99+
"Sign Up",
100+
style: TextStyle(
101+
color: Colors.white,
102+
fontSize: 20,
103+
),
104+
),
105+
),
106+
);
107+
}
108+
109+
Widget buttonItem(String imagepath, String buttonName, double size) {
110+
return Container(
111+
width: MediaQuery.of(context).size.width - 60,
112+
height: 60,
113+
child: Card(
114+
color: Colors.black,
115+
elevation: 8,
116+
shape: RoundedRectangleBorder(
117+
borderRadius: BorderRadius.circular(15),
118+
side: BorderSide(
119+
width: 1,
120+
color: Colors.grey,
121+
),
122+
),
123+
child: Row(
124+
mainAxisAlignment: MainAxisAlignment.center,
125+
children: [
126+
SvgPicture.asset(
127+
imagepath,
128+
height: size,
129+
width: size,
130+
),
131+
SizedBox(
132+
width: 15,
133+
),
134+
Text(
135+
buttonName,
136+
style: TextStyle(
137+
color: Colors.white,
138+
fontSize: 17,
139+
),
140+
),
141+
],
142+
),
143+
),
144+
);
145+
}
146+
147+
Widget textItem(String labeltext) {
148+
return Container(
149+
width: MediaQuery.of(context).size.width - 70,
150+
height: 55,
151+
child: TextFormField(
152+
decoration: InputDecoration(
153+
labelText: labeltext,
154+
labelStyle: TextStyle(
155+
fontSize: 17,
156+
color: Colors.white,
157+
),
158+
enabledBorder: OutlineInputBorder(
159+
borderRadius: BorderRadius.circular(15),
160+
borderSide: BorderSide(
161+
width: 1,
162+
color: Colors.grey,
163+
),
164+
),
165+
),
166+
),
167+
);
168+
}
169+
}

0 commit comments

Comments
 (0)