Skip to content

Commit dc19c27

Browse files
sumit-codersumit-coder
authored
Merge pull request #18 from sumit-coder/ui_work
UI work
2 parents c3eec97 + c16a3aa commit dc19c27

File tree

12 files changed

+843
-155
lines changed

12 files changed

+843
-155
lines changed

‎assets/images/github-icon-light.png

4.72 KB
Loading

‎lib/main.dart

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,11 @@ import 'package:flutter/material.dart';
22
import 'package:help_me_design/providers/component_tab_provider/component_tab_provider.dart';
33
import 'package:help_me_design/theme/my_theme.dart';
44
import 'package:help_me_design/views/screens/onboarding_screens/signin_screen.dart';
5+
import 'package:help_me_design/views/screens/onboarding_screens/signin_signup_screen/signin_signup_screen.dart';
6+
import 'package:help_me_design/views/screens/onboarding_screens/signup_screen.dart';
57
import 'package:provider/provider.dart';
68

79
import 'providers/snippet_tab_provider.dart';
8-
import 'views/screens/home_screen/home_screen.dart';
910

1011
void main() {
1112
runApp(const MyApp());
@@ -31,7 +32,9 @@ class MyApp extends StatelessWidget {
3132
scrollBehavior: const ScrollBehavior().copyWith(scrollbars: false),
3233
themeMode: Provider.of<ThemeManager>(context).getThemeMode,
3334
// home: const MyHomePage(),
34-
home: const SignInScreen(),
35+
// home: const SignInScreen(),
36+
// home: SignUpScreen(),
37+
home: SignInSignUpScreen(),
3538
);
3639
}),
3740
);

‎lib/views/screens/onboarding_screens/signin_screen.dart

Lines changed: 94 additions & 153 deletions
Large diffs are not rendered by default.

‎lib/views/screens/onboarding_screens/signin_signup_screen/signin_signup_screen.dart

Lines changed: 98 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
import 'dart:convert';
2+
import 'dart:developer';
3+
import 'dart:typed_data';
4+
import 'package:appwrite/appwrite.dart';
5+
import 'package:favicon/favicon.dart';
6+
import 'package:flutter_animate/flutter_animate.dart';
7+
import 'package:help_me_design/theme/my_design_system.dart';
8+
import 'package:help_me_design/theme/my_theme.dart';
9+
import 'package:help_me_design/views/screens/onboarding_screens/signin_signup_screen/widgets/signup_view.dart';
10+
import 'package:help_me_design/views/widgets/button_tap_effect.dart';
11+
import 'package:help_me_design/views/widgets/container_pattern_painter.dart';
12+
import 'package:help_me_design/views/widgets/divider_with_title.dart';
13+
import 'package:help_me_design/views/widgets/form_widgets/buttons/button_with_title_and_icon.dart';
14+
import 'package:help_me_design/views/widgets/form_widgets/buttons/simple_button.dart';
15+
import 'package:help_me_design/views/widgets/form_widgets/input_fields/email_input_field.dart';
16+
import 'package:help_me_design/views/widgets/form_widgets/input_fields/password_input_field.dart';
17+
import 'package:html/parser.dart';
18+
import 'package:image/image.dart' as img;
19+
20+
// import 'package:favicon/favicon.dart';
21+
import 'package:flutter/material.dart';
22+
import 'package:provider/provider.dart';
23+
24+
import 'widgets/signin_view.dart';
25+
26+
enum ActiveOnboardingView { signIn, signUp, resetPassword, none }
27+
28+
class SignInSignUpScreen extends StatefulWidget {
29+
const SignInSignUpScreen({Key? key}) : super(key: key);
30+
31+
@override
32+
State<SignInSignUpScreen> createState() => _SignInSignUpScreenState();
33+
}
34+
35+
class _SignInSignUpScreenState extends State<SignInSignUpScreen> {
36+
ActiveOnboardingView activeOnboardingView = ActiveOnboardingView.signIn;
37+
38+
final PageController _pageController = PageController();
39+
40+
@override
41+
Widget build(BuildContext context) {
42+
var themeData = Theme.of(context);
43+
var themeMangerProvider = Provider.of<ThemeManager>(context, listen: false);
44+
return Scaffold(
45+
body: SafeArea(
46+
child: Container(
47+
width: double.maxFinite,
48+
child: Column(
49+
mainAxisAlignment: MainAxisAlignment.center,
50+
crossAxisAlignment: CrossAxisAlignment.center,
51+
children: [
52+
Expanded(
53+
child: PageView(
54+
controller: _pageController,
55+
children: [
56+
Column(
57+
mainAxisAlignment: MainAxisAlignment.center,
58+
children: [
59+
SignInView(
60+
onTapSignUp: () {
61+
_pageController.animateToPage(1, duration: Duration(milliseconds: 500), curve: Curves.decelerate);
62+
},
63+
).animate().rotate(begin: -0.07, alignment: Alignment.bottomLeft),
64+
],
65+
),
66+
Column(
67+
mainAxisAlignment: MainAxisAlignment.center,
68+
children: [
69+
SignUpView(
70+
onTapSignIn: () {
71+
_pageController.animateToPage(0, duration: Duration(milliseconds: 300), curve: Curves.decelerate);
72+
},
73+
).animate().rotate(begin: -0.07, alignment: Alignment.bottomRight),
74+
],
75+
)
76+
],
77+
),
78+
),
79+
ButtonTapEffect(
80+
onTap: () {
81+
if (themeMangerProvider.isDarkMode) {
82+
themeMangerProvider.changeThemeMode(ThemeMode.light);
83+
setState(() {});
84+
return;
85+
}
86+
themeMangerProvider.changeThemeMode(ThemeMode.dark);
87+
setState(() {});
88+
89+
print(themeMangerProvider.getThemeMode);
90+
},
91+
child: const Text('LOgin'))
92+
],
93+
),
94+
),
95+
),
96+
);
97+
}
98+
}

‎lib/views/screens/onboarding_screens/signin_signup_screen/widgets/signin_view.dart

Lines changed: 138 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,138 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:help_me_design/theme/my_design_system.dart';
3+
import 'package:help_me_design/theme/my_theme.dart';
4+
import 'package:help_me_design/views/widgets/button_tap_effect.dart';
5+
import 'package:help_me_design/views/widgets/container_pattern_painter.dart';
6+
import 'package:help_me_design/views/widgets/divider_with_title.dart';
7+
import 'package:help_me_design/views/widgets/form_widgets/buttons/button_with_title_and_icon.dart';
8+
import 'package:help_me_design/views/widgets/form_widgets/buttons/simple_button.dart';
9+
import 'package:help_me_design/views/widgets/form_widgets/input_fields/email_input_field.dart';
10+
import 'package:help_me_design/views/widgets/form_widgets/input_fields/password_input_field.dart';
11+
12+
class SignInView extends StatelessWidget {
13+
const SignInView({Key? key, required this.onTapSignUp}) : super(key: key);
14+
15+
final VoidCallback onTapSignUp;
16+
17+
@override
18+
Widget build(BuildContext context) {
19+
var themeData = Theme.of(context);
20+
return Container(
21+
// height: 500,
22+
width: 374,
23+
// padding: EdgeInsets.all(MySpaceSystem.spaceX3),
24+
decoration: BoxDecoration(
25+
color: themeData.colorScheme.secondary,
26+
boxShadow: cardShadow,
27+
borderRadius: BorderRadius.circular(8),
28+
),
29+
child: Column(
30+
children: [
31+
Container(
32+
width: 374,
33+
height: 100,
34+
child: CustomPaint(
35+
painter: ContainerPatternPainter(42, context),
36+
child: Container(
37+
padding: EdgeInsets.all(MySpaceSystem.spaceX3),
38+
alignment: Alignment.topLeft,
39+
child: Container(
40+
color: themeData.colorScheme.primary,
41+
padding: EdgeInsets.symmetric(horizontal: MySpaceSystem.spaceX2, vertical: MySpaceSystem.spaceX1),
42+
child: Text(
43+
"Sign In".toUpperCase(),
44+
style: MyTextTypeSystem.titleXLargeDark,
45+
),
46+
),
47+
),
48+
),
49+
),
50+
SizedBox(height: MySpaceSystem.spaceX1),
51+
// Login Form
52+
Container(
53+
padding: EdgeInsets.all(MySpaceSystem.spaceX4),
54+
child: Column(
55+
crossAxisAlignment: CrossAxisAlignment.center,
56+
mainAxisAlignment: MainAxisAlignment.center,
57+
// mainAxisAlignment: MainAxisAlignment.center,
58+
children: [
59+
// Text('Email*', style: themeData.textTheme.titleSmall),
60+
// SizedBox(height: MySpaceSystem.spaceX1),
61+
EmailInputField(
62+
emailEditingController: TextEditingController(),
63+
),
64+
SizedBox(height: MySpaceSystem.spaceX2),
65+
PasswordInputField(
66+
isNeedVisibilityButton: true,
67+
passwordEditingController: TextEditingController(),
68+
),
69+
SizedBox(height: MySpaceSystem.spaceX2),
70+
Row(
71+
mainAxisAlignment: MainAxisAlignment.end,
72+
children: [
73+
ButtonTapEffect(
74+
onTap: () {},
75+
child: Text(
76+
"Forgot password",
77+
style: themeData.textTheme.bodySmall!.copyWith(color: themeData.colorScheme.primary),
78+
),
79+
)
80+
],
81+
),
82+
SizedBox(height: MySpaceSystem.spaceX3),
83+
SimpleButton(
84+
buttonTitle: "Sign In",
85+
onTap: () {
86+
print("object");
87+
},
88+
),
89+
90+
DividerWithTitle(title: 'Continue With', margin: EdgeInsets.symmetric(vertical: MySpaceSystem.spaceX4)),
91+
92+
Container(
93+
// margin: EdgeInsets.only(top: MySpaceSystem.spaceX3),
94+
child: Row(
95+
children: [
96+
Expanded(
97+
child: ButtonWithTitleAndIcon(
98+
onTap: () {},
99+
buttonTitle: "Google",
100+
icon: Image.asset("assets/images/google-icon.png"),
101+
),
102+
),
103+
SizedBox(width: MySpaceSystem.spaceX2),
104+
Expanded(
105+
child: ButtonWithTitleAndIcon(
106+
onTap: () {},
107+
buttonTitle: "Github",
108+
icon: Image.asset("assets/images/github-icon-light.png"),
109+
),
110+
)
111+
],
112+
),
113+
),
114+
// SizedBox(height: 64)
115+
SizedBox(height: MySpaceSystem.spaceX4),
116+
Row(
117+
mainAxisAlignment: MainAxisAlignment.center,
118+
children: [
119+
Text("Don't have an account? ", style: themeData.textTheme.bodyMedium),
120+
ButtonTapEffect(
121+
onTap: () {
122+
onTapSignUp();
123+
},
124+
child: Text(
125+
"Sign Up".toUpperCase(),
126+
style: themeData.textTheme.bodyMedium!.copyWith(color: themeData.colorScheme.primary),
127+
),
128+
)
129+
],
130+
),
131+
],
132+
),
133+
)
134+
],
135+
),
136+
);
137+
}
138+
}

‎lib/views/screens/onboarding_screens/signin_signup_screen/widgets/signup_view.dart

Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
import 'package:help_me_design/theme/my_design_system.dart';
2+
import 'package:help_me_design/theme/my_theme.dart';
3+
import 'package:help_me_design/views/widgets/button_tap_effect.dart';
4+
import 'package:help_me_design/views/widgets/container_pattern_painter.dart';
5+
import 'package:help_me_design/views/widgets/divider_with_title.dart';
6+
import 'package:help_me_design/views/widgets/form_widgets/buttons/button_with_title_and_icon.dart';
7+
import 'package:help_me_design/views/widgets/form_widgets/buttons/simple_button.dart';
8+
import 'package:help_me_design/views/widgets/form_widgets/input_fields/email_input_field.dart';
9+
import 'package:help_me_design/views/widgets/form_widgets/input_fields/password_input_field.dart';
10+
11+
// import 'package:favicon/favicon.dart';
12+
import 'package:flutter/material.dart';
13+
import 'package:provider/provider.dart';
14+
15+
class SignUpView extends StatelessWidget {
16+
const SignUpView({Key? key, required this.onTapSignIn}) : super(key: key);
17+
18+
final VoidCallback onTapSignIn;
19+
20+
@override
21+
Widget build(BuildContext context) {
22+
var themeData = Theme.of(context);
23+
var themeMangerProvider = Provider.of<ThemeManager>(context, listen: false);
24+
return Container(
25+
// height: 500,
26+
width: 374,
27+
// padding: EdgeInsets.all(MySpaceSystem.spaceX3),
28+
decoration: BoxDecoration(
29+
color: themeData.colorScheme.secondary,
30+
boxShadow: cardShadow,
31+
borderRadius: BorderRadius.circular(8),
32+
),
33+
child: Column(
34+
children: [
35+
Container(
36+
width: 374,
37+
height: 100,
38+
child: CustomPaint(
39+
painter: ContainerPatternPainter(42, context),
40+
child: Container(
41+
padding: EdgeInsets.all(MySpaceSystem.spaceX3),
42+
alignment: Alignment.topLeft,
43+
child: Container(
44+
color: themeData.colorScheme.primary,
45+
padding: EdgeInsets.symmetric(horizontal: MySpaceSystem.spaceX2, vertical: MySpaceSystem.spaceX1),
46+
child: Text(
47+
"Sign Up".toUpperCase(),
48+
style: MyTextTypeSystem.titleXLargeDark,
49+
),
50+
),
51+
),
52+
),
53+
),
54+
SizedBox(height: MySpaceSystem.spaceX1),
55+
// Login Form
56+
Container(
57+
padding: EdgeInsets.all(MySpaceSystem.spaceX4),
58+
child: Column(
59+
crossAxisAlignment: CrossAxisAlignment.center,
60+
mainAxisAlignment: MainAxisAlignment.center,
61+
// mainAxisAlignment: MainAxisAlignment.center,
62+
children: [
63+
EmailInputField(
64+
emailEditingController: TextEditingController(),
65+
),
66+
SizedBox(height: MySpaceSystem.spaceX2),
67+
PasswordInputField(
68+
passwordEditingController: TextEditingController(),
69+
),
70+
SizedBox(height: MySpaceSystem.spaceX2),
71+
PasswordInputField(
72+
customHintText: "Conform Password",
73+
passwordEditingController: TextEditingController(),
74+
),
75+
76+
SizedBox(height: MySpaceSystem.spaceX3),
77+
SimpleButton(
78+
buttonTitle: "Sign Up",
79+
onTap: () {
80+
print("object");
81+
},
82+
),
83+
84+
DividerWithTitle(title: 'Continue With', margin: EdgeInsets.symmetric(vertical: MySpaceSystem.spaceX4)),
85+
86+
Container(
87+
// margin: EdgeInsets.only(top: MySpaceSystem.spaceX3),
88+
child: Row(
89+
children: [
90+
Expanded(
91+
child: ButtonWithTitleAndIcon(
92+
onTap: () {},
93+
buttonTitle: "Google",
94+
icon: Image.asset("assets/images/google-icon.png"),
95+
),
96+
),
97+
SizedBox(width: MySpaceSystem.spaceX2),
98+
Expanded(
99+
child: ButtonWithTitleAndIcon(
100+
onTap: () {},
101+
buttonTitle: "Github",
102+
icon: Image.asset("assets/images/github-icon-light.png"),
103+
),
104+
)
105+
],
106+
),
107+
),
108+
// SizedBox(height: 64)
109+
SizedBox(height: MySpaceSystem.spaceX4),
110+
Row(
111+
mainAxisAlignment: MainAxisAlignment.center,
112+
children: [
113+
Text("Already have an account? ", style: themeData.textTheme.bodyMedium),
114+
ButtonTapEffect(
115+
onTap: () {
116+
onTapSignIn();
117+
},
118+
child: Text(
119+
"Sign In".toUpperCase(),
120+
style: themeData.textTheme.bodyMedium!.copyWith(color: themeData.colorScheme.primary),
121+
),
122+
)
123+
],
124+
),
125+
],
126+
),
127+
)
128+
],
129+
),
130+
);
131+
}
132+
}

0 commit comments

Comments
 (0)