diff --git a/lib/src/screens/code_validation.dart b/lib/src/screens/code_validation.dart index 6f0b9e9..1f71cb3 100644 --- a/lib/src/screens/code_validation.dart +++ b/lib/src/screens/code_validation.dart @@ -110,6 +110,7 @@ class _CodeValidationScreenState extends State { padding: EdgeInsets.only(bottom: 20), child: OtpTextField( numberOfFields: 6, + focusedBorderColor: Colors.blue, fillColor: Colors.black.withOpacity(0.1), filled: true, keyboardType: TextInputType.number, @@ -118,32 +119,6 @@ class _CodeValidationScreenState extends State { OTPController.instance.verifyOTP(otp); }, ), - // child: TextField( - // onSubmitted: - // maxLength: 6, - // keyboardType: TextInputType.number, - // decoration: InputDecoration( - // enabledBorder: OutlineInputBorder( - // borderSide: BorderSide(color: Color(0xFFECECEC)), - // borderRadius: BorderRadius.all( - // Radius.circular(50), - // ), - // ), - // focusedBorder: OutlineInputBorder( - // borderSide: BorderSide(color: Color(0xFFECECEC)), - // borderRadius: BorderRadius.all( - // Radius.circular(50), - // ), - // ), - // hintText: '_ _ _ _ _ _', - // fillColor: Color.fromARGB(255, 239, 239, 239), - // filled: true, - // ), - // textAlign: TextAlign.center, - // style: TextStyle( - // letterSpacing: 10.0, - // ), - // ), ), Padding( padding: EdgeInsets.only(bottom: 40), diff --git a/lib/src/screens/login.dart b/lib/src/screens/login.dart index de6e6d5..2a8660e 100644 --- a/lib/src/screens/login.dart +++ b/lib/src/screens/login.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:get/get.dart'; +import 'package:intl_phone_field/intl_phone_field.dart'; import 'package:prosappco/src/authentication/authentication_repository.dart'; import 'package:prosappco/src/controllers/phone_auth_controller.dart'; import 'package:prosappco/src/screens/code_validation.dart'; @@ -16,6 +17,7 @@ class LoginScreen extends StatefulWidget { class _LoginScreenState extends State { final controller = Get.put(PhoneAuthController()); final _formKey = GlobalKey(); + String completePhoneNumber = ''; @override Widget build(BuildContext context) { @@ -71,41 +73,62 @@ class _LoginScreenState extends State { Form( key: _formKey, child: Padding( - padding: EdgeInsets.only(bottom: 10), - child: TextFormField( + padding: EdgeInsets.only(bottom: 5), + child: IntlPhoneField( controller: controller.phoneNo, + initialCountryCode: 'CO', + onChanged: (phoneNo) { + completePhoneNumber = phoneNo.completeNumber; + }, decoration: InputDecoration( - enabledBorder: OutlineInputBorder( - borderSide: BorderSide(color: Color(0xFFECECEC)), - borderRadius: BorderRadius.all( - Radius.circular(50), - )), - focusedBorder: OutlineInputBorder( - borderSide: BorderSide(color: Color(0xFFECECEC)), - borderRadius: BorderRadius.all( - Radius.circular(50), - )), - hintText: '+57', - fillColor: Color.fromARGB(255, 239, 239, 239), - filled: true, - prefixIcon: Icon(Icons.phone_android_outlined)), + enabledBorder: OutlineInputBorder( + borderSide: BorderSide(color: Color(0xFFECECEC)), + borderRadius: BorderRadius.all( + Radius.circular(50), + )), + focusedBorder: OutlineInputBorder( + borderSide: BorderSide(color: Color(0xFFECECEC)), + borderRadius: BorderRadius.all( + Radius.circular(50), + )), + fillColor: Color.fromARGB(255, 239, 239, 239), + filled: true, + ), ), + // child: TextFormField( + // controller: controller.phoneNo, + // decoration: InputDecoration( + // enabledBorder: OutlineInputBorder( + // borderSide: BorderSide(color: Color(0xFFECECEC)), + // borderRadius: BorderRadius.all( + // Radius.circular(50), + // )), + // focusedBorder: OutlineInputBorder( + // borderSide: BorderSide(color: Color(0xFFECECEC)), + // borderRadius: BorderRadius.all( + // Radius.circular(50), + // )), + // hintText: '+57', + // fillColor: Color.fromARGB(255, 239, 239, 239), + // filled: true, + // prefixIcon: Icon(Icons.phone_android_outlined)), + // ), ), ), const Padding( - padding: EdgeInsets.only(bottom: 40), + padding: EdgeInsets.only(bottom: 30), child: Text('Un código será enviado a este numero de celular.', textAlign: TextAlign.center, style: TextStyle(fontSize: 13.0, color: Color(0xFF65676B))), ), Padding( - padding: EdgeInsets.only(bottom: 40), + padding: EdgeInsets.only(bottom: 30), child: Center( child: ElevatedButton( onPressed: () { if (_formKey.currentState!.validate()) { PhoneAuthController.instance.phoneAuthentication( - controller.phoneNo.text.trim(), + completePhoneNumber.trim(), ); Get.to(() => const CodeValidationScreen()); } diff --git a/lib/src/screens/register.dart b/lib/src/screens/register.dart index e7205f7..11a06cb 100644 --- a/lib/src/screens/register.dart +++ b/lib/src/screens/register.dart @@ -138,37 +138,37 @@ class _RegisterScreenState extends State { key: _formKey, child: Column( children: [ - const Padding( - padding: EdgeInsets.only(bottom: 5), - child: Align( - alignment: Alignment.topLeft, - child: Text('Nombre', - style: TextStyle( - fontSize: 18.0, color: Color(0xFF65676B))), - )), - Padding( - padding: EdgeInsets.only(bottom: 18), - child: TextFormField( - controller: controller.name, - decoration: InputDecoration( - enabledBorder: OutlineInputBorder( - borderSide: - BorderSide(color: Color(0xFFECECEC)), - borderRadius: BorderRadius.all( - Radius.circular(50), - )), - focusedBorder: OutlineInputBorder( - borderSide: - BorderSide(color: Color(0xFFECECEC)), - borderRadius: BorderRadius.all( - Radius.circular(50), - )), - hintText: 'Nombre y Apellido', - fillColor: Color.fromARGB(255, 239, 239, 239), - filled: true, - prefixIcon: Icon(Icons.person_outline)), - ), - ), + // const Padding( + // padding: EdgeInsets.only(bottom: 5), + // child: Align( + // alignment: Alignment.topLeft, + // child: Text('Nombre', + // style: TextStyle( + // fontSize: 18.0, color: Color(0xFF65676B))), + // )), + // Padding( + // padding: EdgeInsets.only(bottom: 18), + // child: TextFormField( + // controller: controller.name, + // decoration: InputDecoration( + // enabledBorder: OutlineInputBorder( + // borderSide: + // BorderSide(color: Color(0xFFECECEC)), + // borderRadius: BorderRadius.all( + // Radius.circular(50), + // )), + // focusedBorder: OutlineInputBorder( + // borderSide: + // BorderSide(color: Color(0xFFECECEC)), + // borderRadius: BorderRadius.all( + // Radius.circular(50), + // )), + // hintText: 'Nombre y Apellido', + // fillColor: Color.fromARGB(255, 239, 239, 239), + // filled: true, + // prefixIcon: Icon(Icons.person_outline)), + // ), + // ), const Padding( padding: EdgeInsets.only(bottom: 5), child: Align( diff --git a/pubspec.lock b/pubspec.lock index c7a0f7d..5b98fe5 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -232,6 +232,14 @@ packages: url: "https://pub.dev" source: hosted version: "0.17.0" + intl_phone_field: + dependency: "direct main" + description: + name: intl_phone_field + sha256: "0d2b35d148ed28a454d50797e6c2fb297f0a295feab84641b02d3dd32294b3f3" + url: "https://pub.dev" + source: hosted + version: "3.1.0" js: dependency: transitive description: diff --git a/pubspec.yaml b/pubspec.yaml index 6187bef..6846fb0 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -44,6 +44,7 @@ dependencies: get: ^4.6.5 font_awesome_flutter: ^10.4.0 flutter_otp_text_field: ^1.1.1 + intl_phone_field: ^3.1.0 dev_dependencies: flutter_test: