From 6ba0576ee805294a167aa892fba007c89241af0c Mon Sep 17 00:00:00 2001 From: Elham Rababah Date: Mon, 5 Apr 2021 18:22:33 +0300 Subject: [PATCH] fix steps widget --- .../profile/soap_update/steps_widget.dart | 413 +++++++++--------- .../subjective/update_Chief_complaints.dart | 149 +++++++ .../subjective/update_subjective_page.dart | 110 +---- lib/widgets/shared/new_text_Field.dart | 229 ++++++++++ 4 files changed, 595 insertions(+), 306 deletions(-) create mode 100644 lib/widgets/patients/profile/soap_update/subjective/update_Chief_complaints.dart create mode 100644 lib/widgets/shared/new_text_Field.dart diff --git a/lib/widgets/patients/profile/soap_update/steps_widget.dart b/lib/widgets/patients/profile/soap_update/steps_widget.dart index a5bcf434..dab907b2 100644 --- a/lib/widgets/patients/profile/soap_update/steps_widget.dart +++ b/lib/widgets/patients/profile/soap_update/steps_widget.dart @@ -1,9 +1,9 @@ -import 'package:doctor_app_flutter/config/size_config.dart'; import 'package:doctor_app_flutter/core/viewModel/project_view_model.dart'; -import 'package:doctor_app_flutter/widgets/shared/Text.dart'; import 'package:doctor_app_flutter/widgets/shared/app_texts_widget.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; +import 'package:font_awesome_flutter/font_awesome_flutter.dart'; +import 'package:hexcolor/hexcolor.dart'; import 'package:provider/provider.dart'; class StepsWidget extends StatelessWidget { @@ -20,7 +20,7 @@ class StepsWidget extends StatelessWidget { ? Stack( children: [ Container( - height: 120, + height: 150, width: MediaQuery.of(context).size.width, color: Colors.transparent, child: Center( @@ -32,7 +32,7 @@ class StepsWidget extends StatelessWidget { ), ), Positioned( - top: index == 0 ? 15 : 30, + top: 45, left: 0, child: InkWell( onTap: () => changeCurrentTab(0), @@ -40,152 +40,155 @@ class StepsWidget extends StatelessWidget { crossAxisAlignment: CrossAxisAlignment.start, children: [ Container( - width: index == 0 ? 70 : 50, - height: index == 0 ? 70 : 50, + width: 50, + height:50, decoration: BoxDecoration( border: index == 0 - ? Border.all(color: Color(0xFFB9382C), width: 2) + ? Border.all(color: Color(0xFFCC9B14), width: 2) : index > 0 - ? null - : Border.all( - color: Colors.black, width: 0.75), + ? null + : Border.all( + color: Colors.black, width: 0.75), shape: BoxShape.circle, color: index == 0 - ? Colors.white + ? Color(0xFFCC9B14) : index > 0 - ? Color(0xFFB9382C) - : Color(0xFFCCCCCC), + ? Color(0xFF359846) + : Color(0xFFCCCCCC), ), child: Center( - child: Texts( - '1', - variant: index == 0 ? "heading2" : "", - bold: true, - color: index == 0 - ? Colors.black - : index > 0 - ? Colors.white - : Colors.grey, - ), + child: Icon(FontAwesomeIcons.check, size: 25, + color: Colors.white,) ), ), SizedBox( - height: index == 0 ? 5 : 10, + height:5 ), - AppText( - "SUBJECTIVE", - fontWeight: FontWeight.bold, - fontSize: 14, + Column( + mainAxisAlignment: MainAxisAlignment.start, + children: [ + AppText( + "Subjective", + fontWeight: FontWeight.bold, + fontSize: 14, + ), + StatusLabel(selectedStepId: index, stepId: 0,), + + ], ), ], ), ), ), Positioned( - top: index == 1 ? 15 : 30, - left: MediaQuery.of(context).size.width * 0.28, + top: 45, + left: MediaQuery + .of(context) + .size + .width * 0.28, child: InkWell( onTap: () => index >= 1 ? changeCurrentTab(1) : null, child: Column( crossAxisAlignment: CrossAxisAlignment.center, children: [ Container( - width: index == 1 ? 70 : 50, - height: index == 1 ? 70 : 50, + width: 50, + height: 50, decoration: BoxDecoration( border: index == 1 - ? Border.all(color: Color(0xFFB9382C), width: 2) + ? Border.all(color: Color(0xFFCC9B14), width: 2) : index > 2 - ? null - : Border.all( - color: Color(0xFFCCCCCC), width: 0.75), + ? null + : Border.all( + color: Color(0xFFCCCCCC), width: 0.75), shape: BoxShape.circle, color: index == 1 - ? Colors.white + ? Color(0xFFCC9B14) : index > 1 - ? Color(0xFFB9382C) - : Color(0xFFCCCCCC), + ? Color(0xFF359846) + : Color(0xFFCCCCCC), ), child: Center( - child: Texts( - '2', - variant: index == 1 ? "heading2" : '', - bold: true, - color: index == 1 - ? Colors.black - : index > 1 - ? Colors.white - : Colors.grey, - ), + child: Icon(FontAwesomeIcons.check, size: 25, + color: Colors.white,) ), ), SizedBox( - height: index == 1 ? 5 : 10, + height:5, ), - AppText( - "OBJECTIVE", - fontWeight: FontWeight.bold, - fontSize:14, + Column( + mainAxisAlignment: MainAxisAlignment.start, + children: [ + AppText( + "Objective", + fontWeight: FontWeight.bold, + fontSize: 14, + ), + + StatusLabel(selectedStepId: index, stepId: 1,), + + ], ), ], ), ), ), Positioned( - top: index == 2 ? 15 : 30, - left: MediaQuery.of(context).size.width * 0.52, + top: 45, + left: MediaQuery + .of(context) + .size + .width * 0.52, child: InkWell( onTap: () { - if(index >= 3) - changeCurrentTab(2); + if (index >= 3) + changeCurrentTab(2); }, child: Column( crossAxisAlignment: CrossAxisAlignment.center, children: [ Container( - width: index == 2 ? 70 : 50, - height: index == 2 ? 70 : 50, + width:50, + height:50, decoration: BoxDecoration( border: index == 2 - ? Border.all(color: Color(0xFFB9382C), width: 2) + ? Border.all(color: Color(0xFFCC9B14), width: 2) : index > 2 - ? null - : Border.all( - color: Color(0xFFCCCCCC), width: 0.75), + ? null + : Border.all( + color: Color(0xFFCCCCCC), width: 0.75), shape: BoxShape.circle, color: index == 2 - ? Colors.white + ? Color(0xFFCC9B14) : index > 2 - ? Color(0xFFB9382C) - : Color(0xFFCCCCCC), + ? Color(0xFFCC9B14) + : Color(0xFFCCCCCC), ), child: Center( - child: Texts( - '3', - variant: index == 2 ? "heading2" : '', - bold: true, - color: index == 2 - ? Colors.black - : index > 2 - ? Colors.white - : Colors.grey, - ), + child: Icon(FontAwesomeIcons.check, size: 25, + color: Colors.white,) ), ), SizedBox( - height: index == 2 ? 5 : 10, + height:5, ), - AppText( - "ASSESSMENT", - fontWeight: FontWeight.bold, - fontSize:14, + Column( + mainAxisAlignment: MainAxisAlignment.start, + children: [ + AppText( + "Assessment", + fontWeight: FontWeight.bold, + fontSize: 14, + ), + StatusLabel(selectedStepId: index, stepId: 2,), + ], ), ], ), ), ), Positioned( - top: index == 3 ? 15 : 30, + top: 45, right: 0, child: InkWell( onTap: () => index >= 3 ? changeCurrentTab(4) : null, @@ -193,45 +196,42 @@ class StepsWidget extends StatelessWidget { crossAxisAlignment: CrossAxisAlignment.center, children: [ Container( - width: index == 3 ? 70 : 50, - height: index == 3 ? 70 : 50, + width:50, + height:50, decoration: BoxDecoration( border: index == 3 - ? Border.all(color: Color(0xFFB9382C), width: 2) + ? Border.all(color: Color(0xFFCC9B14), width: 2) : index > 3 - ? null - : Border.all( - color: Color(0xFFCCCCCC), width: 0.75), + ? null + : Border.all( + color: Color(0xFFCCCCCC), width: 0.75), shape: BoxShape.circle, color: index == 3 - ? Colors.white + ? Color(0xFFCC9B14) : index > 3 - ? Color(0xFFB9382C) - : Color(0xFFCCCCCC), + ? Color(0xFF359846) + : Color(0xFFCCCCCC), ), child: Center( - child: Texts( - '4', - variant: index == 3 ? "heading2" : '', - bold: true, - color: index == 3 - ? Colors.black - : index > 3 - ? Colors.white - : Colors.grey, - ), - ) + child: Icon(FontAwesomeIcons.check, size: 25, + color: Colors.white,) + ), ), SizedBox( - height: index == 3 ? 5 : 10, + height:5, ), Center( - child: AppText( - "PLAN", - fontWeight: FontWeight.bold, - textAlign: TextAlign.center, - fontSize:14, - ), + child: Column( + children: [ + AppText( + "Plan", + fontWeight: FontWeight.bold, + textAlign: TextAlign.center, + fontSize: 14, + ), + StatusLabel(selectedStepId: index, stepId: 3,), + ], + ), ), ], ), @@ -242,8 +242,11 @@ class StepsWidget extends StatelessWidget { : Stack( children: [ Container( - height: 120, - width: MediaQuery.of(context).size.width, + height: 150, + width: MediaQuery + .of(context) + .size + .width, color: Colors.transparent, child: Center( child: Divider( @@ -254,7 +257,7 @@ class StepsWidget extends StatelessWidget { ), ), Positioned( - top: index == 0 ? 15 : 30, + top: 45, right: 0, child: InkWell( onTap: () => changeCurrentTab(0), @@ -262,37 +265,29 @@ class StepsWidget extends StatelessWidget { crossAxisAlignment: CrossAxisAlignment.start, children: [ Container( - width: index == 0 ? 70 : 50, - height: index == 0 ? 70 : 50, + width: 50, + height:50, decoration: BoxDecoration( border: index == 0 - ? Border.all(color: Color(0xFFB9382C), width: 2) + ? Border.all(color: Color(0xFFCC9B14), width: 2) : index > 0 - ? null - : Border.all( - color: Colors.black, width: 0.75), + ? null + : Border.all( + color: Colors.black, width: 0.75), shape: BoxShape.circle, color: index == 0 - ? Colors.white + ? Color(0xFFCC9B14) : index > 0 - ? Color(0xFFB9382C) - : Color(0xFFCCCCCC), + ? Color(0xFF359846) + : Color(0xFFCCCCCC), ), child: Center( - child: Texts( - '1', - variant: index == 0 ? "heading2" : "", - bold: true, - color: index == 0 - ? Colors.black - : index > 0 - ? Colors.white - : Colors.grey, - ), + child: Icon(FontAwesomeIcons.check, size: 25, + color: Colors.white,) ), ), SizedBox( - height: index == 0 ? 5 : 10, + height:5 ), AppText( "شخصي", @@ -304,45 +299,40 @@ class StepsWidget extends StatelessWidget { ), ), Positioned( - top: index == 1 ? 15 : 30, - right: MediaQuery.of(context).size.width * 0.28, + top: 45, + right: MediaQuery + .of(context) + .size + .width * 0.28, child: InkWell( onTap: () => index >= 2 ? changeCurrentTab(1) : null, child: Column( crossAxisAlignment: CrossAxisAlignment.center, children: [ Container( - width: index == 1 ? 70 : 50, - height: index == 1 ? 70 : 50, + width: 50, + height: 50, decoration: BoxDecoration( border: index == 1 - ? Border.all(color: Color(0xFFB9382C), width: 2) + ? Border.all(color: Color(0xFFCC9B14), width: 2) : index > 2 - ? null - : Border.all( - color: Color(0xFFCCCCCC), width: 0.75), + ? null + : Border.all( + color: Color(0xFFCCCCCC), width: 0.75), shape: BoxShape.circle, color: index == 1 - ? Colors.white + ? Color(0xFFCC9B14) : index > 1 - ? Color(0xFFB9382C) - : Color(0xFFCCCCCC), + ? Color(0xFF359846) + : Color(0xFFCCCCCC), ), child: Center( - child: Texts( - '2', - variant: index == 1 ? "heading2" : '', - bold: true, - color: index == 1 - ? Colors.black - : index > 1 - ? Colors.white - : Colors.grey, - ), + child: Icon(FontAwesomeIcons.check, size: 25, + color: Colors.white,) ), ), SizedBox( - height: index == 1 ? 5 : 10, + height:5 ), AppText( "هدف", @@ -354,45 +344,40 @@ class StepsWidget extends StatelessWidget { ), ), Positioned( - top: index == 2 ? 15 : 30, - right: MediaQuery.of(context).size.width * 0.52, + top: 50, + right: MediaQuery + .of(context) + .size + .width * 0.52, child: InkWell( onTap: () => index >= 3 ? changeCurrentTab(2) : null, child: Column( crossAxisAlignment: CrossAxisAlignment.center, children: [ Container( - width: index == 2 ? 70 : 50, - height: index == 2 ? 70 : 50, + width:50, + height:50, decoration: BoxDecoration( border: index == 2 - ? Border.all(color: Color(0xFFB9382C), width: 2) + ? Border.all(color: Color(0xFFCC9B14), width: 2) : index > 2 - ? null - : Border.all( - color: Color(0xFFCCCCCC), width: 0.75), + ? null + : Border.all( + color: Color(0xFFCCCCCC), width: 0.75), shape: BoxShape.circle, color: index == 2 - ? Colors.white + ? Color(0xFFCC9B14) : index > 2 - ? Color(0xFFB9382C) - : Color(0xFFCCCCCC), + ? Color(0xFFCC9B14) + : Color(0xFFCCCCCC), ), child: Center( - child: Texts( - '3', - variant: index == 2 ? "heading2" : '', - bold: true, - color: index == 2 - ? Colors.black - : index > 2 - ? Colors.white - : Colors.grey, - ), + child: Icon(FontAwesomeIcons.check, size: 25, + color: Colors.white,) ), ), SizedBox( - height: index == 2 ? 5 : 10, + height:5, ), Padding( @@ -408,7 +393,7 @@ class StepsWidget extends StatelessWidget { ), ), Positioned( - top: index == 3 ? 15 : 30, + top: 45, left: 0, child: InkWell( onTap: () => index >= 3 ? changeCurrentTab(4) : null, @@ -416,37 +401,29 @@ class StepsWidget extends StatelessWidget { crossAxisAlignment: CrossAxisAlignment.center, children: [ Container( - width: index == 3 ? 70 : 50, - height: index == 3 ? 70 : 50, + width:50, + height:50, decoration: BoxDecoration( border: index == 3 - ? Border.all(color: Color(0xFFB9382C), width: 2) + ? Border.all(color: Color(0xFFCC9B14), width: 2) : index > 3 - ? null - : Border.all( - color: Color(0xFFCCCCCC), width: 0.75), + ? null + : Border.all( + color: Color(0xFFCCCCCC), width: 0.75), shape: BoxShape.circle, color: index == 3 - ? Colors.white + ? Color(0xFFCC9B14) : index > 3 - ? Color(0xFFB9382C) - : Color(0xFFCCCCCC), + ? Color(0xFFCC9B14) + : Color(0xFFCCCCCC), ), child: Center( - child: Texts( - '4', - variant: index == 3 ? "heading2" : '', - bold: true, - color: index == 3 - ? Colors.black - : index > 3 - ? Colors.white - : Colors.grey, - ), + child: Icon(FontAwesomeIcons.check, size: 25, + color: Colors.white,) ), ), SizedBox( - height: index == 3 ? 5 : 10, + height:5, ), Container( margin: EdgeInsets.only(right:index == 3? 15:0), @@ -454,13 +431,49 @@ class StepsWidget extends StatelessWidget { "خطة", fontWeight: FontWeight.bold, fontSize:14, - ), + ), ), ], ), ), ), ], - ); + ); + } +} + +class StatusLabel extends StatelessWidget { + const StatusLabel({ + Key key, this.stepId, this.selectedStepId, + }) : super(key: key); + + final int stepId; + final int selectedStepId; + + @override + Widget build(BuildContext context) { + return Container( + padding: EdgeInsets.symmetric(horizontal: 5, vertical: 3), + decoration: BoxDecoration( + color: stepId == selectedStepId ? Color(0xFFF1E9D3) : stepId < + selectedStepId ? Color(0xFFD8E8DB) : Color(0xFFCCCCCC), + borderRadius: BorderRadius.all( + Radius.circular(5.0), + ), + border: Border.all( + color: HexColor('#707070'), + width: 0.30), + ), + child: AppText( + stepId == selectedStepId ? "inProgress" : stepId < selectedStepId + ? "Completed" + : " Locked ", + fontWeight: FontWeight.bold, + textAlign: TextAlign.center, + fontSize: 10, + color: stepId == selectedStepId ? Color(0xFFCC9B14) : stepId < + selectedStepId ? Color(0xFF359846) : Color(0xFF969696), + ), + ); } } diff --git a/lib/widgets/patients/profile/soap_update/subjective/update_Chief_complaints.dart b/lib/widgets/patients/profile/soap_update/subjective/update_Chief_complaints.dart new file mode 100644 index 00000000..90211413 --- /dev/null +++ b/lib/widgets/patients/profile/soap_update/subjective/update_Chief_complaints.dart @@ -0,0 +1,149 @@ +import 'package:doctor_app_flutter/util/translations_delegate_base.dart'; +import 'package:doctor_app_flutter/widgets/patients/profile/soap_update/subjective/update_medication_widget.dart'; +import 'package:doctor_app_flutter/widgets/shared/TextFields.dart'; +import 'package:doctor_app_flutter/widgets/shared/new_text_Field.dart'; +import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; +import 'package:hexcolor/hexcolor.dart'; + +class UpdateChiefComplaints extends StatelessWidget { + const UpdateChiefComplaints({ + Key key, + @required this.formKey, + @required this.complaintsController, + @required this.illnessController, + @required this.medicationController, + }) : super(key: key); + + final GlobalKey formKey; + final TextEditingController complaintsController; + final TextEditingController illnessController; + final TextEditingController medicationController; + + @override + Widget build(BuildContext context) { + return Form( + key: formKey, + child: Column(children: [ + SizedBox( + height: 20, + ), + + Container( + + decoration: BoxDecoration( + color: Colors.white, + borderRadius: BorderRadius.all( + Radius.circular(10.0), + ), + border: Border.all( + color: HexColor('#707070'), + width: 0.30), + ), + child: NewTextFields( + hintText: TranslationBase.of(context).addChiefComplaints, + controller: complaintsController, + ), + ), + Container( + margin: + EdgeInsets.only(left: 10, right: 10, top: 15), + child: TextFields( + hasLabelText: complaintsController.text != '' + ? true + : false, + hintText: TranslationBase + .of(context) + .addChiefComplaints, + fontSize: 13.5, + // hintColor: Colors.black, + showLabelText: true, + fontWeight: FontWeight.w600, + maxLines: 25, + minLines: 13, + controller: complaintsController, + validator: (value) { + if (value == null || value == "") + return TranslationBase.of(context) + .emptyMessage; + else if (value.length < 25) + return TranslationBase + .of(context) + .chiefComplaintLength; + //""; + else + return null; + }), + ), + SizedBox( + height: 20, + ), + Container( + margin: + EdgeInsets.only(left: 10, right: 10, top: 15), + child: TextFields( + hasLabelText: + illnessController.text != '' ? true : false, + showLabelText: true, + hintText: TranslationBase + .of(context) + .historyOfPresentIllness, + fontSize: 13.5, + // hintColor: Colors.black, + fontWeight: FontWeight.w600, + maxLines: 25, + minLines: 13, + controller: illnessController, + validator: (value) { + if (value == null || value == "") + return TranslationBase.of(context) + .emptyMessage; + else + return null; + }), + ), + SizedBox( + height: 20, + ), + SizedBox( + height: 10, + ), + UpdateMedicationWidget( + medicationController: medicationController, + ), + SizedBox( + height: 10, + ), + Container( + margin: + EdgeInsets.only(left: 10, right: 10, top: 15), + child: TextFields( + hasLabelText: medicationController.text != '' + ? true + : false, + showLabelText: true, + hintText: TranslationBase + .of(context) + .currentMedications, + fontSize: 13.5, + // hintColor: Colors.black, + fontWeight: FontWeight.w600, + maxLines: 23, + minLines: 10, + controller: medicationController, + validator: (value) { + if (value == null || value == "") + return TranslationBase + .of(context) + .emptyMessage; + else + return null; + }), + ), + SizedBox( + height: 10, + ), + ]), + ); + } +} \ No newline at end of file diff --git a/lib/widgets/patients/profile/soap_update/subjective/update_subjective_page.dart b/lib/widgets/patients/profile/soap_update/subjective/update_subjective_page.dart index c8ac819d..140fec54 100644 --- a/lib/widgets/patients/profile/soap_update/subjective/update_subjective_page.dart +++ b/lib/widgets/patients/profile/soap_update/subjective/update_subjective_page.dart @@ -16,6 +16,7 @@ import 'package:doctor_app_flutter/models/doctor/doctor_profile_model.dart'; import 'package:doctor_app_flutter/models/patient/patiant_info_model.dart'; import 'package:doctor_app_flutter/screens/base/base_view.dart'; import 'package:doctor_app_flutter/util/translations_delegate_base.dart'; +import 'package:doctor_app_flutter/widgets/patients/profile/soap_update/subjective/update_Chief_complaints.dart'; import 'package:doctor_app_flutter/widgets/patients/profile/soap_update/subjective/update_allergies_widget.dart'; import 'package:doctor_app_flutter/widgets/patients/profile/soap_update/subjective/update_history_widget.dart'; import 'package:doctor_app_flutter/widgets/patients/profile/soap_update/subjective/update_medication_widget.dart'; @@ -243,112 +244,7 @@ class _UpdateSubjectivePageState extends State { isChiefExpand = !isChiefExpand; }); }, - child: Form( - key: formKey, - child: Column(children: [ - SizedBox( - height: 20, - ), - Container( - margin: - EdgeInsets.only(left: 10, right: 10, top: 15), - child: TextFields( - hasLabelText: complaintsController.text != '' - ? true - : false, - hintText: TranslationBase - .of(context) - .addChiefComplaints, - fontSize: 13.5, - // hintColor: Colors.black, - showLabelText: true, - fontWeight: FontWeight.w600, - maxLines: 25, - minLines: 13, - controller: complaintsController, - validator: (value) { - if (value == null || value == "") - return TranslationBase.of(context) - .emptyMessage; - else if (value.length < 25) - return TranslationBase - .of(context) - .chiefComplaintLength; - //""; - else - return null; - }), - ), - SizedBox( - height: 20, - ), - Container( - margin: - EdgeInsets.only(left: 10, right: 10, top: 15), - child: TextFields( - hasLabelText: - illnessController.text != '' ? true : false, - showLabelText: true, - hintText: TranslationBase - .of(context) - .historyOfPresentIllness, - fontSize: 13.5, - // hintColor: Colors.black, - fontWeight: FontWeight.w600, - maxLines: 25, - minLines: 13, - controller: illnessController, - validator: (value) { - if (value == null || value == "") - return TranslationBase.of(context) - .emptyMessage; - else - return null; - }), - ), - SizedBox( - height: 20, - ), - SizedBox( - height: 10, - ), - UpdateMedicationWidget( - medicationController: medicationController, - ), - SizedBox( - height: 10, - ), - Container( - margin: - EdgeInsets.only(left: 10, right: 10, top: 15), - child: TextFields( - hasLabelText: medicationController.text != '' - ? true - : false, - showLabelText: true, - hintText: TranslationBase - .of(context) - .currentMedications, - fontSize: 13.5, - // hintColor: Colors.black, - fontWeight: FontWeight.w600, - maxLines: 23, - minLines: 10, - controller: medicationController, - validator: (value) { - if (value == null || value == "") - return TranslationBase - .of(context) - .emptyMessage; - else - return null; - }), - ), - SizedBox( - height: 10, - ), - ]), - ), + child: UpdateChiefComplaints(formKey: formKey, complaintsController: complaintsController, illnessController: illnessController, medicationController: medicationController), isExpanded: isChiefExpand, ), SizedBox( @@ -602,3 +498,5 @@ class _UpdateSubjectivePageState extends State { } + + diff --git a/lib/widgets/shared/new_text_Field.dart b/lib/widgets/shared/new_text_Field.dart new file mode 100644 index 00000000..dc361abd --- /dev/null +++ b/lib/widgets/shared/new_text_Field.dart @@ -0,0 +1,229 @@ +import 'package:eva_icons_flutter/eva_icons_flutter.dart'; +import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; + +class NumberTextInputFormatter extends TextInputFormatter { + @override + TextEditingValue formatEditUpdate( + TextEditingValue oldValue, TextEditingValue newValue) { + final int newTextLength = newValue.text.length; + int selectionIndex = newValue.selection.end; + int usedSubstringIndex = 0; + final StringBuffer newText = StringBuffer(); + if (newTextLength >= 1) { + newText.write('('); + if (newValue.selection.end >= 1) selectionIndex++; + } + if (newTextLength >= 4) { + newText.write(newValue.text.substring(0, usedSubstringIndex = 3) + ') '); + if (newValue.selection.end >= 3) selectionIndex += 2; + } + if (newTextLength >= 7) { + newText.write(newValue.text.substring(3, usedSubstringIndex = 6) + '-'); + if (newValue.selection.end >= 6) selectionIndex++; + } + if (newTextLength >= 11) { + newText.write(newValue.text.substring(6, usedSubstringIndex = 10) + ' '); + if (newValue.selection.end >= 10) selectionIndex++; + } + // Dump the rest. + if (newTextLength >= usedSubstringIndex) + newText.write(newValue.text.substring(usedSubstringIndex)); + return TextEditingValue( + text: newText.toString(), + selection: TextSelection.collapsed(offset: selectionIndex), + ); + } +} + +final _mobileFormatter = NumberTextInputFormatter(); + +class NewTextFields extends StatefulWidget { + NewTextFields( + {Key key, + this.type, + this.hintText, + this.suffixIcon, + this.autoFocus, + this.onChanged, + this.initialValue, + this.minLines, + this.maxLines, + this.inputFormatters, + this.padding, + this.focus = false, + this.maxLengthEnforced = true, + this.suffixIconColor, + this.inputAction, + this.onSubmit, + this.keepPadding = true, + this.textCapitalization = TextCapitalization.none, + this.controller, + this.keyboardType, + this.validator, + this.borderOnlyError = false, + this.onSaved, + this.onSuffixTap, + this.readOnly: false, + this.maxLength, + this.prefixIcon, + this.bare = false, + this.onTap, + this.fontSize = 16.0, + this.fontWeight = FontWeight.w700, + this.autoValidate = false, + this.hintColor, + this.isEnabled = true}) + : super(key: key); + + final String hintText; + + // final String initialValue; + final String type; + final bool autoFocus; + final IconData suffixIcon; + final Color suffixIconColor; + final Icon prefixIcon; + final VoidCallback onTap; + final TextEditingController controller; + final TextInputType keyboardType; + final FormFieldValidator validator; + final Function onSaved; + final Function onSuffixTap; + final Function onChanged; + final Function onSubmit; + final bool readOnly; + final int maxLength; + final int minLines; + final int maxLines; + final bool maxLengthEnforced; + final bool bare; + final bool isEnabled; + final TextInputAction inputAction; + final double fontSize; + final FontWeight fontWeight; + final bool keepPadding; + final TextCapitalization textCapitalization; + final List inputFormatters; + final bool autoValidate; + final EdgeInsets padding; + final bool focus; + final bool borderOnlyError; + final Color hintColor; + final String initialValue; + @override + _NewTextFieldsState createState() => _NewTextFieldsState(); +} + +class _NewTextFieldsState extends State { + final FocusNode _focusNode = FocusNode(); + bool focus = false; + bool view = false; + + @override + void initState() { + super.initState(); + _focusNode.addListener(() { + setState(() { + focus = _focusNode.hasFocus; + }); + }); + } + + @override + void didUpdateWidget(NewTextFields oldWidget) { + if (widget.focus) _focusNode.requestFocus(); + super.didUpdateWidget(oldWidget); + } + + @override + void dispose() { + _focusNode.dispose(); + super.dispose(); + } + + bool _determineReadOnly() { + if (widget.readOnly != null && widget.readOnly) { + _focusNode.unfocus(); + return true; + } else { + return false; + } + } + + @override + Widget build(BuildContext context) { + return AnimatedContainer( + duration: Duration(milliseconds: 300), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(12), + color: Colors.white), + child: Container( + margin: EdgeInsets.only(top: 8), + child: TextFormField( + enabled: widget.isEnabled, + initialValue: widget.initialValue, + keyboardAppearance: Theme.of(context).brightness, + scrollPhysics: BouncingScrollPhysics(), + autovalidate: widget.autoValidate, + textCapitalization: widget.textCapitalization, + onFieldSubmitted: widget.inputAction == TextInputAction.next + ? (widget.onSubmit != null + ? widget.onSubmit + : (val) { + _focusNode.nextFocus(); + }) + : widget.onSubmit, + textInputAction: widget.inputAction, + minLines: widget.minLines ?? 1, + maxLines: widget.maxLines ?? 1, + maxLengthEnforced: widget.maxLengthEnforced, + onChanged: widget.onChanged, + focusNode: _focusNode, + maxLength: widget.maxLength ?? null, + controller: widget.controller, + keyboardType: widget.keyboardType, + readOnly: _determineReadOnly(), + obscureText: widget.type == "password" && !view ? true : false, + autofocus: widget.autoFocus ?? false, + validator: widget.validator, + onSaved: widget.onSaved, + style: Theme.of(context).textTheme.body2.copyWith( + fontSize: widget.fontSize, fontWeight: widget.fontWeight), + inputFormatters: widget.keyboardType == TextInputType.phone + ? [ + WhitelistingTextInputFormatter.digitsOnly, + _mobileFormatter, + ] + : widget.inputFormatters, + decoration: InputDecoration( + labelText: widget.hintText, + labelStyle: + TextStyle(color: Theme.of(context).textTheme.bodyText1.color), + errorBorder: OutlineInputBorder( + borderSide: BorderSide( + color: Theme.of(context).errorColor.withOpacity(0.5), + width: 1.0), + borderRadius: BorderRadius.circular(12.0)), + focusedErrorBorder: OutlineInputBorder( + borderSide: BorderSide( + color: Theme.of(context).errorColor.withOpacity(0.5), + width: 1.0), + borderRadius: BorderRadius.circular(8.0)), + focusedBorder: OutlineInputBorder( + borderSide: BorderSide(color: Colors.white, width: 1.0), + borderRadius: BorderRadius.circular(12)), + disabledBorder: OutlineInputBorder( + borderSide: BorderSide(color: Colors.white, width: 1.0), + borderRadius: BorderRadius.circular(12)), + enabledBorder: OutlineInputBorder( + borderSide: BorderSide(color: Colors.white, width: 1.0), + borderRadius: BorderRadius.circular(12), + ), + ), + ), + ), + ); + } +}