mirror of
https://github.com/hmalik144/days_left_flutter.git
synced 2025-12-10 03:05:21 +00:00
- Introduction on base view model and stateless widget classes
- Implementation of firebase - Implementation of dependency injection Took 11 hours 26 minutes
This commit is contained in:
336
lib/login/LoginScreen.dart
Normal file
336
lib/login/LoginScreen.dart
Normal file
@@ -0,0 +1,336 @@
|
||||
import 'package:days_left/base/BaseModel.dart';
|
||||
import 'package:days_left/base/BaseStatelessWidget.dart';
|
||||
import 'package:days_left/login/forgot_password_6.dart';
|
||||
import 'package:days_left/login/signup_screen_6.dart';
|
||||
import 'package:days_left/login/values/values.dart';
|
||||
import 'package:days_left/login/widgets/custom_button.dart';
|
||||
import 'package:days_left/login/widgets/custom_divider.dart';
|
||||
import 'package:days_left/login/widgets/custom_text_form_field.dart';
|
||||
import 'package:days_left/login/widgets/spaces.dart';
|
||||
import 'package:days_left/viewmodels/LoginViewModel.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../locator.dart';
|
||||
|
||||
class LoginScreen extends BaseStatelessWidget {
|
||||
@override
|
||||
BaseModel getBaseModel() {
|
||||
final LoginViewModel _userAuthViewModel = locator<LoginViewModel>();
|
||||
return _userAuthViewModel;
|
||||
}
|
||||
|
||||
@override
|
||||
Widget displayWidget(context, model, child) {
|
||||
ThemeData theme = Theme.of(context);
|
||||
var heightOfScreen = MediaQuery.of(context).size.height;
|
||||
var widthOfScreen = MediaQuery.of(context).size.width;
|
||||
return Scaffold(
|
||||
body: Container(
|
||||
child: Stack(
|
||||
children: <Widget>[
|
||||
_buildHeader(context),
|
||||
Container(
|
||||
margin: EdgeInsets.only(top: heightOfScreen * 0.2),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.white,
|
||||
borderRadius: BorderRadius.only(
|
||||
topLeft: Radius.circular(Sizes.RADIUS_24),
|
||||
topRight: Radius.circular(Sizes.RADIUS_24),
|
||||
),
|
||||
),
|
||||
child: ListView(
|
||||
children: <Widget>[
|
||||
Container(
|
||||
margin:
|
||||
EdgeInsets.symmetric(horizontal: widthOfScreen * 0.1),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Text(
|
||||
StringConst.LOG_IN,
|
||||
style: theme.textTheme.headline4.copyWith(
|
||||
color: AppColors.black,
|
||||
),
|
||||
),
|
||||
SpaceH8(),
|
||||
CustomDivider(
|
||||
color: AppColors.violetShade2,
|
||||
height: Sizes.HEIGHT_3,
|
||||
width: Sizes.WIDTH_40,
|
||||
),
|
||||
SpaceH20(),
|
||||
Text(
|
||||
StringConst.LOGIN_MSG,
|
||||
style: theme.textTheme.bodyText1.copyWith(
|
||||
color: AppColors.greyShade8,
|
||||
fontWeight: FontWeight.w600,
|
||||
fontSize: Sizes.TEXT_SIZE_14,
|
||||
),
|
||||
),
|
||||
SpaceH24(),
|
||||
_buildForm(context),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Widget _buildHeader(context) {
|
||||
ThemeData theme = Theme.of(context);
|
||||
var heightOfScreen = MediaQuery.of(context).size.height;
|
||||
var widthOfScreen = MediaQuery.of(context).size.width;
|
||||
return Stack(
|
||||
children: <Widget>[
|
||||
Image.asset(
|
||||
ImagePath.SPLASH_1,
|
||||
height: heightOfScreen * 0.3,
|
||||
width: widthOfScreen,
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
Container(
|
||||
height: heightOfScreen * 0.3,
|
||||
width: widthOfScreen,
|
||||
decoration: BoxDecoration(gradient: Gradients.headerOverlayGradient),
|
||||
),
|
||||
Container(
|
||||
margin: EdgeInsets.only(
|
||||
top: heightOfScreen * 0.075,
|
||||
left: widthOfScreen * 0.1,
|
||||
),
|
||||
child: Text(
|
||||
StringConst.APP_NAME,
|
||||
style: theme.textTheme.headline4.copyWith(
|
||||
color: AppColors.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildForm(context) {
|
||||
ThemeData theme = Theme.of(context);
|
||||
var heightOfScreen = MediaQuery.of(context).size.height;
|
||||
var widthOfScreen = MediaQuery.of(context).size.width;
|
||||
return Column(
|
||||
children: <Widget>[
|
||||
CustomTextFormField(
|
||||
textInputType: TextInputType.text,
|
||||
hintTextStyle: Styles.customTextStyle(color: AppColors.greyShade8),
|
||||
textStyle: Styles.customTextStyle(color: AppColors.greyShade8),
|
||||
labelText: StringConst.EMAIL,
|
||||
labelStyle: theme.textTheme.subtitle1.copyWith(
|
||||
color: AppColors.violetShade2,
|
||||
),
|
||||
hasSuffixIcon: true,
|
||||
suffixIcon: Icon(
|
||||
Icons.mail,
|
||||
color: AppColors.greyShade8,
|
||||
),
|
||||
border:
|
||||
Borders.customOutlineInputBorder(borderRadius: Sizes.RADIUS_4),
|
||||
enabledBorder:
|
||||
Borders.customOutlineInputBorder(borderRadius: Sizes.RADIUS_4),
|
||||
focusedBorder: Borders.customOutlineInputBorder(
|
||||
borderRadius: Sizes.RADIUS_4,
|
||||
color: AppColors.violetShade2,
|
||||
width: Sizes.WIDTH_2,
|
||||
),
|
||||
hintText: StringConst.EMAIL,
|
||||
),
|
||||
SpaceH20(),
|
||||
CustomTextFormField(
|
||||
textInputType: TextInputType.text,
|
||||
hintTextStyle: Styles.customTextStyle(
|
||||
color: AppColors.greyShade8,
|
||||
),
|
||||
textStyle: Styles.customTextStyle(color: AppColors.greyShade8),
|
||||
labelText: StringConst.PASSWORD,
|
||||
labelStyle: theme.textTheme.subtitle1.copyWith(
|
||||
color: AppColors.violetShade2,
|
||||
),
|
||||
hintText: StringConst.PASSWORD_HINT_TEXT,
|
||||
hasSuffixIcon: true,
|
||||
suffixIcon: Icon(
|
||||
Icons.lock,
|
||||
color: AppColors.greyShade8,
|
||||
),
|
||||
border:
|
||||
Borders.customOutlineInputBorder(borderRadius: Sizes.RADIUS_4),
|
||||
enabledBorder:
|
||||
Borders.customOutlineInputBorder(borderRadius: Sizes.RADIUS_4),
|
||||
focusedBorder: Borders.customOutlineInputBorder(
|
||||
borderRadius: Sizes.RADIUS_4,
|
||||
color: AppColors.violetShade2,
|
||||
width: Sizes.WIDTH_2,
|
||||
),
|
||||
obscured: true,
|
||||
),
|
||||
SpaceH16(),
|
||||
GestureDetector(
|
||||
onTap: () => Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(
|
||||
builder: (context) => ForgotPasswordScreen6(),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.end,
|
||||
children: <Widget>[
|
||||
Text(
|
||||
StringConst.FORGOT_PASSWORD,
|
||||
style: theme.textTheme.subtitle1.copyWith(
|
||||
color: AppColors.black,
|
||||
fontSize: Sizes.TEXT_SIZE_14,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
SpaceH24(),
|
||||
CustomButton(
|
||||
title: StringConst.LOG_IN,
|
||||
color: AppColors.violetShade2,
|
||||
borderRadius: Sizes.ELEVATION_4,
|
||||
textStyle: theme.textTheme.button.copyWith(
|
||||
color: AppColors.white,
|
||||
fontSize: Sizes.TEXT_SIZE_16,
|
||||
),
|
||||
onPressed: () {},
|
||||
),
|
||||
SizedBox(
|
||||
height: heightOfScreen * 0.03,
|
||||
),
|
||||
_buildSeparator(context),
|
||||
SizedBox(
|
||||
height: heightOfScreen * 0.03,
|
||||
),
|
||||
Row(
|
||||
children: <Widget>[
|
||||
Expanded(
|
||||
child: CustomButton(
|
||||
title: StringConst.FACEBOOK,
|
||||
textStyle: theme.textTheme.button
|
||||
.copyWith(color: AppColors.greyShade8),
|
||||
hasIcon: true,
|
||||
color: AppColors.white,
|
||||
elevation: Sizes.ELEVATION_0,
|
||||
borderRadius: Sizes.ELEVATION_4,
|
||||
borderSide: Borders.customBorder(color: AppColors.grey),
|
||||
icon: Image.asset(
|
||||
ImagePath.FACEBOOK,
|
||||
height: Sizes.HEIGHT_24,
|
||||
width: Sizes.WIDTH_24,
|
||||
),
|
||||
onPressed: () {},
|
||||
),
|
||||
),
|
||||
SizedBox(width: widthOfScreen * 0.1),
|
||||
Expanded(
|
||||
child: CustomButton(
|
||||
title: StringConst.GOOGLE,
|
||||
hasIcon: true,
|
||||
color: AppColors.white,
|
||||
elevation: Sizes.ELEVATION_0,
|
||||
borderRadius: Sizes.ELEVATION_4,
|
||||
borderSide: Borders.customBorder(color: AppColors.grey),
|
||||
textStyle: theme.textTheme.button
|
||||
.copyWith(color: AppColors.greyShade8),
|
||||
icon: Image.asset(
|
||||
ImagePath.GOOGLE,
|
||||
height: Sizes.HEIGHT_24,
|
||||
width: Sizes.WIDTH_24,
|
||||
),
|
||||
onPressed: () {},
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
SizedBox(
|
||||
height: heightOfScreen * 0.08,
|
||||
),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
Text(
|
||||
StringConst.DONT_HAVE_AN_ACCOUNT,
|
||||
style: theme.textTheme.bodyText1.copyWith(
|
||||
color: AppColors.black,
|
||||
fontWeight: FontWeight.w600,
|
||||
fontSize: Sizes.TEXT_SIZE_14,
|
||||
),
|
||||
),
|
||||
SpaceW4(),
|
||||
GestureDetector(
|
||||
onTap: () => Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(
|
||||
builder: (context) => SignUpScreen6(),
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.end,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Text(
|
||||
StringConst.SIGN_UP,
|
||||
style: theme.textTheme.headline4.copyWith(
|
||||
color: AppColors.orangeShade5,
|
||||
fontSize: Sizes.TEXT_SIZE_14,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
SpaceH2(),
|
||||
CustomDivider(
|
||||
color: AppColors.orangeShade5,
|
||||
height: Sizes.HEIGHT_2,
|
||||
width: Sizes.WIDTH_50,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
SpaceH20(),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSeparator(BuildContext context) {
|
||||
var textTheme = Theme.of(context).textTheme;
|
||||
var widthOfScreen = MediaQuery.of(context).size.width;
|
||||
return Container(
|
||||
margin: const EdgeInsets.symmetric(horizontal: Sizes.MARGIN_16),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
CustomDivider(
|
||||
color: Colors.grey[300],
|
||||
width: widthOfScreen * 0.15,
|
||||
height: Sizes.HEIGHT_2,
|
||||
),
|
||||
SpaceW16(),
|
||||
Text(
|
||||
StringConst.OR,
|
||||
style: textTheme.subtitle1.copyWith(
|
||||
color: AppColors.greyShade8,
|
||||
),
|
||||
),
|
||||
SpaceW16(),
|
||||
CustomDivider(
|
||||
color: Colors.grey[300],
|
||||
width: widthOfScreen * 0.15,
|
||||
height: Sizes.HEIGHT_2,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user