UI Tweaks and Extensions Added

development_faiz
Faiz Hashmi 3 years ago
parent 7551836598
commit 76c923d4b7

@ -215,7 +215,7 @@ class OtpDialog {
void startTimer(setState) { void startTimer(setState) {
remainingTime--; remainingTime--;
if (stopTimer) return; if (stopTimer) return;
setState(() { setState(() {
displayTime = getSecondsAsDigitalClock(remainingTime); displayTime = getSecondsAsDigitalClock(remainingTime);
}); });

@ -2,6 +2,7 @@ import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/cupertino.dart'; import 'package:flutter/cupertino.dart';
import 'package:intl/intl.dart'; import 'package:intl/intl.dart';
import 'package:hmg_nurses/classes/colors.dart'; import 'package:hmg_nurses/classes/colors.dart';
import 'package:sizer/sizer.dart';
extension CapExtension on String { extension CapExtension on String {
String get toCamelCase => "${this[0].toUpperCase()}${this.substring(1)}"; String get toCamelCase => "${this[0].toUpperCase()}${this.substring(1)}";
@ -19,13 +20,13 @@ extension EmailValidator on String {
Widget toText10({Color? color, bool isBold = false, int? maxlines, FontStyle? fontStyle}) => Text( Widget toText10({Color? color, bool isBold = false, int? maxlines, FontStyle? fontStyle}) => Text(
this, this,
maxLines: maxlines, maxLines: maxlines,
style: TextStyle(fontSize: 10, fontStyle: fontStyle ?? FontStyle.normal, fontWeight: isBold ? FontWeight.bold : FontWeight.w600, color: color ?? MyColors.darkTextColor, letterSpacing: -0.4), style: TextStyle(fontSize: 10.sp, fontStyle: fontStyle ?? FontStyle.normal, fontWeight: isBold ? FontWeight.bold : FontWeight.w600, color: color ?? MyColors.darkTextColor, letterSpacing: -0.4),
); );
Widget toText11({Color? color, FontWeight? weight, bool isUnderLine = false, bool isBold = false}) => Text( Widget toText11({Color? color, FontWeight? weight, bool isUnderLine = false, bool isBold = false}) => Text(
this, this,
style: TextStyle( style: TextStyle(
fontSize: 11, fontSize: 11.sp,
fontWeight: weight ?? (isBold ? FontWeight.bold : FontWeight.w600), fontWeight: weight ?? (isBold ? FontWeight.bold : FontWeight.w600),
color: color ?? MyColors.darkTextColor, color: color ?? MyColors.darkTextColor,
letterSpacing: -0.33, letterSpacing: -0.33,
@ -38,7 +39,7 @@ extension EmailValidator on String {
textAlign: isCenter ? TextAlign.center : null, textAlign: isCenter ? TextAlign.center : null,
maxLines: (maxLine > 0) ? maxLine : null, maxLines: (maxLine > 0) ? maxLine : null,
style: TextStyle( style: TextStyle(
fontSize: 12, fontSize: 12.sp,
fontWeight: isBold ? FontWeight.bold : FontWeight.w600, fontWeight: isBold ? FontWeight.bold : FontWeight.w600,
color: color ?? MyColors.darkTextColor, color: color ?? MyColors.darkTextColor,
letterSpacing: -0.72, letterSpacing: -0.72,
@ -52,7 +53,7 @@ extension EmailValidator on String {
maxLines: (maxLine > 0) ? maxLine : null, maxLines: (maxLine > 0) ? maxLine : null,
minFontSize: 8, minFontSize: 8,
style: TextStyle( style: TextStyle(
fontSize: 12, fontSize: 12.sp,
fontWeight: isBold ? FontWeight.bold : FontWeight.w600, fontWeight: isBold ? FontWeight.bold : FontWeight.w600,
color: color ?? MyColors.darkTextColor, color: color ?? MyColors.darkTextColor,
letterSpacing: -0.72, letterSpacing: -0.72,
@ -86,7 +87,7 @@ extension EmailValidator on String {
Widget toText13({Color? color, bool isUnderLine = false}) => Text( Widget toText13({Color? color, bool isUnderLine = false}) => Text(
this, this,
style: TextStyle(fontSize: 13, fontWeight: FontWeight.w600, color: color ?? MyColors.darkTextColor, letterSpacing: -0.52, decoration: isUnderLine ? TextDecoration.underline : null), style: TextStyle(fontSize: 13.sp, fontWeight: FontWeight.w600, color: color ?? MyColors.darkTextColor, letterSpacing: -0.52, decoration: isUnderLine ? TextDecoration.underline : null),
); );
Widget toText14({Color? color, bool isUnderLine = false, bool isBold = false, FontWeight? weight, int? maxlines}) => Text( Widget toText14({Color? color, bool isUnderLine = false, bool isBold = false, FontWeight? weight, int? maxlines}) => Text(
@ -94,7 +95,7 @@ extension EmailValidator on String {
maxLines: maxlines, maxLines: maxlines,
style: TextStyle( style: TextStyle(
color: color ?? MyColors.darkTextColor, color: color ?? MyColors.darkTextColor,
fontSize: 14, fontSize: 14.sp,
letterSpacing: -0.48, letterSpacing: -0.48,
fontWeight: weight ?? (isBold ? FontWeight.bold : FontWeight.w600), fontWeight: weight ?? (isBold ? FontWeight.bold : FontWeight.w600),
decoration: isUnderLine ? TextDecoration.underline : null), decoration: isUnderLine ? TextDecoration.underline : null),
@ -105,7 +106,7 @@ extension EmailValidator on String {
maxLines: maxlines, maxLines: maxlines,
style: TextStyle( style: TextStyle(
color: color ?? MyColors.darkTextColor, color: color ?? MyColors.darkTextColor,
fontSize: 16, fontSize: 16.sp,
letterSpacing: -0.64, letterSpacing: -0.64,
fontWeight: isBold ? FontWeight.bold : FontWeight.w600, fontWeight: isBold ? FontWeight.bold : FontWeight.w600,
decoration: isUnderLine ? TextDecoration.underline : null, decoration: isUnderLine ? TextDecoration.underline : null,
@ -114,48 +115,48 @@ extension EmailValidator on String {
Widget toText17({Color? color, bool isBold = false}) => Text( Widget toText17({Color? color, bool isBold = false}) => Text(
this, this,
style: TextStyle(color: color ?? MyColors.darkTextColor, fontSize: 17, letterSpacing: -0.68, fontWeight: isBold ? FontWeight.bold : FontWeight.w600), style: TextStyle(color: color ?? MyColors.darkTextColor, fontSize: 17.sp, letterSpacing: -0.68, fontWeight: isBold ? FontWeight.bold : FontWeight.w600),
); );
Widget toText18({Color? color, bool isBold = false}) => Text( Widget toText18({Color? color, bool isBold = false}) => Text(
this, this,
style: TextStyle(fontSize: 18, fontWeight: isBold ? FontWeight.bold : FontWeight.w600, color: color ?? MyColors.darkTextColor, letterSpacing: -1.08), style: TextStyle(fontSize: 18.sp, fontWeight: isBold ? FontWeight.bold : FontWeight.w600, color: color ?? MyColors.darkTextColor, letterSpacing: -1.08),
); );
Widget toText19({Color? color, bool isBold = false}) => Text( Widget toText19({Color? color, bool isBold = false}) => Text(
this, this,
style: TextStyle(fontSize: 19, fontWeight: isBold ? FontWeight.bold : FontWeight.w600, color: color ?? MyColors.darkTextColor, letterSpacing: -1.14), style: TextStyle(fontSize: 19.sp, fontWeight: isBold ? FontWeight.bold : FontWeight.w600, color: color ?? MyColors.darkTextColor, letterSpacing: -1.14),
); );
Widget toText20({Color? color, bool isBold = false}) => Text( Widget toText20({Color? color, bool isBold = false}) => Text(
this, this,
style: TextStyle(fontSize: 20, fontWeight: isBold ? FontWeight.bold : FontWeight.w600, color: color ?? MyColors.darkTextColor, letterSpacing: -0.4), style: TextStyle(fontSize: 20.sp, fontWeight: isBold ? FontWeight.bold : FontWeight.w600, color: color ?? MyColors.darkTextColor, letterSpacing: -0.4),
); );
Widget toText21({Color? color, bool isBold = false, FontWeight? weight, int? maxlines}) => Text( Widget toText21({Color? color, bool isBold = false, FontWeight? weight, int? maxlines}) => Text(
this, this,
maxLines: maxlines, maxLines: maxlines,
style: TextStyle(color: color ?? MyColors.grey3AColor, fontSize: 21, letterSpacing: -0.31, fontWeight: weight ?? (isBold ? FontWeight.bold : FontWeight.w600)), style: TextStyle(color: color ?? MyColors.grey3AColor, fontSize: 21.sp, letterSpacing: -0.31, fontWeight: weight ?? (isBold ? FontWeight.bold : FontWeight.w600)),
); );
Widget toText22({Color? color, bool isBold = false}) => Text( Widget toText22({Color? color, bool isBold = false}) => Text(
this, this,
style: TextStyle(height: 1, color: color ?? MyColors.darkTextColor, fontSize: 22, letterSpacing: -1.44, fontWeight: isBold ? FontWeight.bold : FontWeight.w600), style: TextStyle(height: 1, color: color ?? MyColors.darkTextColor, fontSize: 22.sp, letterSpacing: -1.44, fontWeight: isBold ? FontWeight.bold : FontWeight.w600),
); );
Widget toText24({Color? color, bool isBold = false}) => Text( Widget toText24({Color? color, bool isBold = false}) => Text(
this, this,
style: TextStyle(height: 23 / 24, color: color ?? MyColors.darkTextColor, fontSize: 24, letterSpacing: -1.44, fontWeight: isBold ? FontWeight.bold : FontWeight.w600), style: TextStyle(height: 23 / 24, color: color ?? MyColors.darkTextColor, fontSize: 24.sp, letterSpacing: -1.44, fontWeight: isBold ? FontWeight.bold : FontWeight.w600),
); );
Widget toText32({Color? color, bool isBold = false}) => Text( Widget toText32({Color? color, bool isBold = false}) => Text(
this, this,
style: TextStyle(height: 32 / 32, color: color ?? MyColors.darkTextColor, fontSize: 32, letterSpacing: -1.92, fontWeight: isBold ? FontWeight.bold : FontWeight.w600), style: TextStyle(height: 32 / 32, color: color ?? MyColors.darkTextColor, fontSize: 32.sp, letterSpacing: -1.92, fontWeight: isBold ? FontWeight.bold : FontWeight.w600),
); );
Widget toText44({Color? color, bool isBold = false}) => Text( Widget toText44({Color? color, bool isBold = false}) => Text(
this, this,
style: TextStyle(height: 32 / 32, color: color ?? MyColors.darkTextColor, fontSize: 44, letterSpacing: -2.64, fontWeight: isBold ? FontWeight.bold : FontWeight.w600), style: TextStyle(height: 32 / 32, color: color ?? MyColors.darkTextColor, fontSize: 44.sp, letterSpacing: -2.64, fontWeight: isBold ? FontWeight.bold : FontWeight.w600),
); );
Widget toSectionHeading({String upperHeading = "", String lowerHeading = ""}) { Widget toSectionHeading({String upperHeading = "", String lowerHeading = ""}) {

@ -4,6 +4,7 @@ import 'package:hmg_nurses/classes/colors.dart';
import 'package:hmg_nurses/extensions/int_extensions.dart'; import 'package:hmg_nurses/extensions/int_extensions.dart';
import 'package:hmg_nurses/extensions/string_extensions.dart'; import 'package:hmg_nurses/extensions/string_extensions.dart';
import 'package:shimmer/shimmer.dart'; import 'package:shimmer/shimmer.dart';
import 'package:sizer/sizer.dart';
extension WidgetExtensions on Widget { extension WidgetExtensions on Widget {
Widget onPress(VoidCallback onTap) => InkWell(onTap: onTap, child: this); Widget onPress(VoidCallback onTap) => InkWell(onTap: onTap, child: this);
@ -16,6 +17,8 @@ extension WidgetExtensions on Widget {
Widget paddingAll(double _value) => Padding(padding: EdgeInsets.all(_value), child: this); Widget paddingAll(double _value) => Padding(padding: EdgeInsets.all(_value), child: this);
Widget paddingSymmetrical(double horizontal, double vertical) => Padding(padding: EdgeInsets.symmetric(horizontal: horizontal, vertical: vertical), child: this);
Widget paddingOnly({double left = 0.0, double right = 0.0, double top = 0.0, double bottom = 0.0}) => Widget paddingOnly({double left = 0.0, double right = 0.0, double top = 0.0, double bottom = 0.0}) =>
Padding(padding: EdgeInsets.only(left: left, right: right, top: top, bottom: bottom), child: this); Padding(padding: EdgeInsets.only(left: left, right: right, top: top, bottom: bottom), child: this);
@ -105,3 +108,49 @@ extension WidgetExtensions on Widget {
); );
} }
} }
//Height Spacers in percentages
Widget heightSpacer02per() => SizedBox(height: 0.2.h);
Widget heightSpacer04per() => SizedBox(height: 0.4.h);
Widget heightSpacer06per() => SizedBox(height: 0.6.h);
Widget heightSpacer08per() => SizedBox(height: 0.8.h);
Widget heightSpacer1per() => SizedBox(height: 1.h);
Widget heightSpacer2per() => SizedBox(height: 2.h);
Widget heightSpacer3per() => SizedBox(height: 3.h);
Widget heightSpacer4per() => SizedBox(height: 4.h);
Widget heightSpacer5per() => SizedBox(height: 5.h);
Widget heightSpacer8per() => SizedBox(height: 8.h);
Widget heightSpacer10per() => SizedBox(height: 10.h);
Widget heightSpacer15per() => SizedBox(height: 15.h);
Widget heightSpacer20per() => SizedBox(height: 20.h);
//Width Spacers in percentages
Widget widthSpacer02perc() => SizedBox(height: 0.2.w);
Widget widthSpacer04perc() => SizedBox(height: 0.4.w);
Widget widthSpacer06perc() => SizedBox(height: 0.6.w);
Widget widthSpacer08per() => SizedBox(height: 0.8.w);
Widget widthSpacer1per() => SizedBox(height: 1.w);
Widget widthSpacer2per() => SizedBox(height: 2.w);
Widget widthSpacer3per() => SizedBox(height: 3.w);
Widget widthSpacer4per() => SizedBox(height: 4.w);
Widget widthSpacer5per() => SizedBox(height: 5.w);

@ -1,11 +1,8 @@
import 'package:easy_localization/easy_localization.dart'; import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:hexcolor/hexcolor.dart'; import 'package:hexcolor/hexcolor.dart';
import 'package:hmg_nurses/classes/colors.dart'; import 'package:hmg_nurses/classes/colors.dart';
import 'package:hmg_nurses/classes/enums.dart'; import 'package:hmg_nurses/classes/enums.dart';
import 'package:hmg_nurses/classes/size_config.dart';
import 'package:hmg_nurses/extensions/string_extensions.dart'; import 'package:hmg_nurses/extensions/string_extensions.dart';
import 'package:hmg_nurses/extensions/util_extensions.dart'; import 'package:hmg_nurses/extensions/util_extensions.dart';
import 'package:hmg_nurses/extensions/widget_extensions.dart'; import 'package:hmg_nurses/extensions/widget_extensions.dart';
@ -55,7 +52,7 @@ class LoginMethodsPageState extends State<LoginMethodsPage> {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[ children: <Widget>[
SizedBox(height: 1.h), heightSpacer1per(),
if (loginViewModel.isFromLogin) if (loginViewModel.isFromLogin)
InkWell( InkWell(
onTap: () { onTap: () {
@ -65,7 +62,7 @@ class LoginMethodsPageState extends State<LoginMethodsPage> {
child: const Icon(Icons.arrow_back_ios, color: MyColors.darkTextColor)), child: const Icon(Icons.arrow_back_ios, color: MyColors.darkTextColor)),
Column( Column(
children: <Widget>[ children: <Widget>[
SizedBox(height: 1.h), heightSpacer1per(),
isMoreOption != null && isMoreOption == false isMoreOption != null && isMoreOption == false
? Column( ? Column(
@ -73,11 +70,10 @@ class LoginMethodsPageState extends State<LoginMethodsPage> {
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[ children: <Widget>[
LocaleKeys.welcomeBack.tr().toText12(), LocaleKeys.welcomeBack.tr().toText12(),
SizedBox(height: 1.h), "Dr Amal Ahmed".toText20(isBold: true),
"Faiz Hashmi".toText24(isBold: true), heightSpacer3per(),
SizedBox(height: 3.h), LocaleKeys.wouldYouLikeToLoginWithCurrentUsername.tr().toText14(),
LocaleKeys.wouldYouLikeToLoginWithCurrentUsername.tr().toText18(), heightSpacer3per(),
SizedBox(height: 3.h),
Container( Container(
padding: const EdgeInsets.all(12), padding: const EdgeInsets.all(12),
decoration: BoxDecoration( decoration: BoxDecoration(
@ -93,39 +89,36 @@ class LoginMethodsPageState extends State<LoginMethodsPage> {
mainAxisAlignment: MainAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Text( LocaleKeys.lastLoginDetails.tr().toText13(),
LocaleKeys.lastLoginDetails.tr(), SizedBox(
overflow: TextOverflow.ellipsis, width: 55.w,
style: TextStyle( child: Row(
fontFamily: 'Poppins', children: [
fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 4.8, "${LocaleKeys.verificationType.tr()} : ".toText11(),
color: Color(0xFF2E303A), "${loginViewModel.getType(1)}".toText11(isBold: true),
fontWeight: FontWeight.w600, ],
letterSpacing: -0.4),
),
Container(
width: MediaQuery.of(context).size.width * 0.55,
child: RichText(
text: TextSpan(
text: "${LocaleKeys.verificationType.tr()} ",
style: TextStyle(
color: const Color(0xFF575757),
fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 3.5,
fontFamily: 'Poppins',
fontWeight: FontWeight.w600,
letterSpacing: -0.4),
children: <TextSpan>[
TextSpan(
text: loginViewModel.getType(1),
style: TextStyle(
color: MyColors.darkTextColor,
fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 3.5,
fontFamily: 'Poppins',
fontWeight: FontWeight.w600,
letterSpacing: -0.48),
)
]),
), ),
// child: RichText(
// text: TextSpan(
// text: "${LocaleKeys.verificationType.tr()} ",
// style: TextStyle(
// color: const Color(0xFF575757),
// fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 3.5,
// fontFamily: 'Poppins',
// fontWeight: FontWeight.w600,
// letterSpacing: -0.4),
// children: <TextSpan>[
// TextSpan(
// text: loginViewModel.getType(1),
// style: TextStyle(
// color: MyColors.darkTextColor,
// fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 3.5,
// fontFamily: 'Poppins',
// fontWeight: FontWeight.w600,
// letterSpacing: -0.48),
// )
// ]),
// ),
), ),
], ],
), ),
@ -133,27 +126,9 @@ class LoginMethodsPageState extends State<LoginMethodsPage> {
mainAxisAlignment: MainAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.end, crossAxisAlignment: CrossAxisAlignment.end,
children: [ children: [
Text( "12 NOV, 2022".toText11(isBold: true),
"12 NOV, 2022", heightSpacer06per(),
overflow: TextOverflow.ellipsis, "09:56 AM".toText10()
style: TextStyle(
fontFamily: 'Poppins',
fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 4.2,
color: Color(0xFF2E303A),
fontWeight: FontWeight.bold,
letterSpacing: -0.4),
),
Text(
"09:56 AM",
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontFamily: 'Poppins',
fontSize: SizeConfig.getTextMultiplierBasedOnWidth() * 3.5,
color: Color(0xFF2E303A),
fontWeight: FontWeight.w600,
letterSpacing: -0.4),
),
// AppText( // AppText(
// loginViewModel.user.editedOn != null // loginViewModel.user.editedOn != null
// ? AppDateUtils.getDayMonthYearDateFormatted(AppDateUtils.convertStringToDate(loginViewModel.user.editedOn), isMonthShort: true) // ? AppDateUtils.getDayMonthYearDateFormatted(AppDateUtils.convertStringToDate(loginViewModel.user.editedOn), isMonthShort: true)
@ -183,25 +158,13 @@ class LoginMethodsPageState extends State<LoginMethodsPage> {
], ],
), ),
), ),
SizedBox(height: SizeConfig.heightMultiplier! * 3), heightSpacer3per(),
Row( LocaleKeys.pleaseVerify.tr().toText14().paddingOnly(left: 1.w),
children: [ heightSpacer2per(),
//todo add translation
LocaleKeys.pleaseVerify.tr().toText18().paddingOnly(left: 8),
],
),
SizedBox(
height: SizeConfig.heightMultiplier! * 2,
),
], ],
) )
: Column(mainAxisAlignment: MainAxisAlignment.spaceEvenly, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[ : Column(mainAxisAlignment: MainAxisAlignment.spaceEvenly, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[
onlySMSBox == true LocaleKeys.pleaseVerifyForBio.tr().toText14().paddingAll(10),
? Container(
margin: const EdgeInsets.only(bottom: 20, top: 30),
child: LocaleKeys.pleaseVerify.tr().toText16(),
)
: LocaleKeys.pleaseVerify.tr().toText16(),
]), ]),
isMoreOption != null && isMoreOption == false isMoreOption != null && isMoreOption == false
? Column(mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[ ? Column(mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[
@ -299,7 +262,7 @@ class LoginMethodsPageState extends State<LoginMethodsPage> {
padding: EdgeInsets.symmetric(horizontal: 4.w), padding: EdgeInsets.symmetric(horizontal: 4.w),
child: DefaultButton(LocaleKeys.useAnotherAccount.tr(), () {}, colors: const [MyColors.redColor, MyColors.redColor]), child: DefaultButton(LocaleKeys.useAnotherAccount.tr(), () {}, colors: const [MyColors.redColor, MyColors.redColor]),
), ),
SizedBox(height: 3.h) heightSpacer3per(),
], ],
), ),
), ),

@ -2,6 +2,8 @@ import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:hmg_nurses/classes/colors.dart'; import 'package:hmg_nurses/classes/colors.dart';
import 'package:hmg_nurses/config/routes.dart'; import 'package:hmg_nurses/config/routes.dart';
import 'package:hmg_nurses/extensions/string_extensions.dart';
import 'package:hmg_nurses/extensions/widget_extensions.dart';
import 'package:hmg_nurses/generated/locale_keys.g.dart'; import 'package:hmg_nurses/generated/locale_keys.g.dart';
import 'package:hmg_nurses/widgets/button/default_button.dart'; import 'package:hmg_nurses/widgets/button/default_button.dart';
import 'package:hmg_nurses/widgets/cupertino_picker.dart'; import 'package:hmg_nurses/widgets/cupertino_picker.dart';
@ -20,60 +22,59 @@ class _LoginPageState extends State<LoginPage> {
var projectIdController = TextEditingController(); var projectIdController = TextEditingController();
var userIdController = TextEditingController(); var userIdController = TextEditingController();
var passwordController = TextEditingController(); var passwordController = TextEditingController();
FocusNode projectIdFocusNode = FocusNode();
SizedBox buildSpacer20h() => SizedBox(height: 3.h); FocusNode userIdFocusNode = FocusNode();
FocusNode passwordIdFocusNode = FocusNode();
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Scaffold( return Scaffold(
body: SingleChildScrollView( body: SafeArea(
child: Column( child: SingleChildScrollView(
crossAxisAlignment: CrossAxisAlignment.start, child: Column(
children: [ crossAxisAlignment: CrossAxisAlignment.start,
SizedBox(height: 10.h), children: [
Padding( Column(
padding: EdgeInsets.only(left: 8.w),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Text( LocaleKeys.welcomeTo.tr().toText14(color: MyColors.blackColor),
LocaleKeys.welcomeTo.tr(), LocaleKeys.drSulaiman.tr().toText20(isBold: true, color: MyColors.blackColor),
style: TextStyle(fontSize: 16.sp, fontWeight: FontWeight.w600, fontFamily: 'Poppins'), "Nurses App".toText16(color: MyColors.redColor),
),
Text(
LocaleKeys.drSulaiman.tr(),
style: TextStyle(color: MyColors.blackColor, fontWeight: FontWeight.bold, fontSize: 24.sp, fontFamily: 'Poppins'),
),
Text(
"Nurses App",
style: TextStyle(fontSize: 16.sp, fontWeight: FontWeight.w600, color: MyColors.redColor),
),
], ],
), ),
), heightSpacer4per(),
SizedBox(height: 4.h), Form(
Form( key: loginFormKey,
key: loginFormKey,
child: Padding(
padding: EdgeInsets.symmetric(horizontal: 8.w),
child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [ child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
buildSpacer20h(), heightSpacer3per(),
CustomTextField(LocaleKeys.userID.tr(), userIdController, isEnableBorder: true, ), CustomTextField(
buildSpacer20h(), LocaleKeys.userID.tr(),
CustomTextField(LocaleKeys.password.tr(), passwordController, isTextIsPassword: true), userIdController,
buildSpacer20h(), isEnableBorder: true,
focusNode: userIdFocusNode,
isInputTypeNum: true,
),
heightSpacer3per(),
CustomTextField(
LocaleKeys.password.tr(),
passwordController,
isTextIsPassword: true,
focusNode: passwordIdFocusNode,
),
heightSpacer3per(),
CustomTextField( CustomTextField(
LocaleKeys.branch.tr(), LocaleKeys.branch.tr(),
projectIdController, projectIdController,
hasSelection: true, hasSelection: true,
isEnable: false, isEnable: false,
focusNode: projectIdFocusNode,
onClick: () => CustomCupertinoPicker.showCupertinoPicker(context, [], () {}), onClick: () => CustomCupertinoPicker.showCupertinoPicker(context, [], () {}),
), ),
buildSpacer20h() heightSpacer15per(),
]), ]),
), )
) ],
], ).paddingSymmetrical(8.w, 4.h),
), ),
), ),
bottomSheet: Container( bottomSheet: Container(
@ -82,7 +83,7 @@ class _LoginPageState extends State<LoginPage> {
width: double.infinity, width: double.infinity,
child: Center( child: Center(
child: FractionallySizedBox( child: FractionallySizedBox(
widthFactor: 0.9, widthFactor: 0.89,
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.end, mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[ children: <Widget>[
@ -92,7 +93,7 @@ class _LoginPageState extends State<LoginPage> {
Navigator.pushNamed(context, AppRoutes.loginMethodsPage); Navigator.pushNamed(context, AppRoutes.loginMethodsPage);
}, colors: const [MyColors.redColor, MyColors.redColor]), }, colors: const [MyColors.redColor, MyColors.redColor]),
), ),
SizedBox(height: 3.h) heightSpacer3per(),
], ],
), ),
), ),

@ -20,6 +20,7 @@ class CustomTextField extends StatefulWidget {
final double horizontalPadding; final double horizontalPadding;
final Function(String)? onChange; final Function(String)? onChange;
final Function? onClick; final Function? onClick;
final FocusNode? focusNode;
const CustomTextField( const CustomTextField(
this.labelText, this.labelText,
@ -36,6 +37,7 @@ class CustomTextField extends StatefulWidget {
this.onClick, this.onClick,
this.isInputTypeNum = false, this.isInputTypeNum = false,
this.isBackgroundEnable = false, this.isBackgroundEnable = false,
this.focusNode,
this.verticalPadding = 15, this.verticalPadding = 15,
this.horizontalPadding = 16, this.horizontalPadding = 16,
}) : super(key: key); }) : super(key: key);
@ -73,7 +75,11 @@ class CustomTextFieldState extends State<CustomTextField> {
? () { ? () {
widget.onClick!(); widget.onClick!();
} }
: null, : () {
if (widget.focusNode != null) {
widget.focusNode?.requestFocus();
}
},
child: Row( child: Row(
children: [ children: [
Expanded( Expanded(
@ -92,6 +98,7 @@ class CustomTextFieldState extends State<CustomTextField> {
), ),
), ),
TextField( TextField(
focusNode: widget.focusNode,
autofocus: false, autofocus: false,
enabled: widget.isEnable, enabled: widget.isEnable,
scrollPadding: EdgeInsets.zero, scrollPadding: EdgeInsets.zero,

Loading…
Cancel
Save