Haroon6138
/
hmg_nurses
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

UI Tweaks and Extensions Added

Browse Source
development_faiz
Faiz Hashmi 3 years ago
parent 7551836598
commit 76c923d4b7
6 changed files with 158 additions and 137 deletions
Show Stats Download Patch File Download Diff File

33
lib/extensions/string_extensions.dart
Unescape Escape View File

@ -2,6 +2,7 @@ import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/cupertino.dart';
import 'package:intl/intl.dart';
import 'package:hmg_nurses/classes/colors.dart';
import 'package:sizer/sizer.dart';
extension CapExtension on String {
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(
this,
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(
this,
style: TextStyle(
fontSize: 11,
fontSize: 11.sp,
fontWeight: weight ?? (isBold ? FontWeight.bold : FontWeight.w600),
color: color ?? MyColors.darkTextColor,
letterSpacing: -0.33,
@ -38,7 +39,7 @@ extension EmailValidator on String {
textAlign: isCenter ? TextAlign.center : null,
maxLines: (maxLine > 0) ? maxLine : null,
style: TextStyle(
fontSize: 12,
fontSize: 12.sp,
fontWeight: isBold ? FontWeight.bold : FontWeight.w600,
color: color ?? MyColors.darkTextColor,
letterSpacing: -0.72,
@ -52,7 +53,7 @@ extension EmailValidator on String {
maxLines: (maxLine > 0) ? maxLine : null,
minFontSize: 8,
style: TextStyle(
fontSize: 12,
fontSize: 12.sp,
fontWeight: isBold ? FontWeight.bold : FontWeight.w600,
color: color ?? MyColors.darkTextColor,
letterSpacing: -0.72,
@ -86,7 +87,7 @@ extension EmailValidator on String {
Widget toText13({Color? color, bool isUnderLine = false}) => Text(
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(
@ -94,7 +95,7 @@ extension EmailValidator on String {
maxLines: maxlines,
style: TextStyle(
color: color ?? MyColors.darkTextColor,
fontSize: 14,
fontSize: 14.sp,
letterSpacing: -0.48,
fontWeight: weight ?? (isBold ? FontWeight.bold : FontWeight.w600),
decoration: isUnderLine ? TextDecoration.underline : null),
@ -105,7 +106,7 @@ extension EmailValidator on String {
maxLines: maxlines,
style: TextStyle(
color: color ?? MyColors.darkTextColor,
fontSize: 16,
fontSize: 16.sp,
letterSpacing: -0.64,
fontWeight: isBold ? FontWeight.bold : FontWeight.w600,
decoration: isUnderLine ? TextDecoration.underline : null,
@ -114,48 +115,48 @@ extension EmailValidator on String {
Widget toText17({Color? color, bool isBold = false}) => Text(
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(
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(
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(
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(
this,
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(
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(
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(
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(
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 = ""}) {

49
lib/extensions/widget_extensions.dart
Unescape Escape View File

@ -4,6 +4,7 @@ import 'package:hmg_nurses/classes/colors.dart';
import 'package:hmg_nurses/extensions/int_extensions.dart';
import 'package:hmg_nurses/extensions/string_extensions.dart';
import 'package:shimmer/shimmer.dart';
import 'package:sizer/sizer.dart';
extension WidgetExtensions on Widget {
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 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}) =>
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);

123
lib/ui/login/login_method_page.dart
Unescape Escape View File

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

65
lib/ui/login/login_page.dart
Unescape Escape View File

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

9
lib/widgets/input_widget.dart
Unescape Escape View File

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

Write Preview
Loading…
Cancel
Save