logins y register responsivos

This commit is contained in:
Juan Felipe Duarte
2023-06-05 13:14:25 -05:00
parent 261e10968e
commit 660f99e188
4 changed files with 1467 additions and 677 deletions
+142 -144
View File
@@ -162,165 +162,163 @@ class _LoginScreenState extends State<LoginScreen> {
double height = MediaQuery.of(context).size.height;
double width = MediaQuery.of(context).size.width;
return Scaffold(
backgroundColor: const Color(0xFFD6F4FF),
body: SizedBox(
height: height,
width: width,
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
Expanded(
child: SizedBox(
height: height,
child: const Center(
child: Image(
image: AssetImage('images/logo_prosapp.png'),
),
backgroundColor: const Color(0xFFD6F4FF),
body: SizedBox(
height: height,
width: width,
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
Expanded(
child: SizedBox(
height: height,
child: const Center(
child: Image(
image: AssetImage('images/logo_prosapp.png'),
),
),
),
Expanded(
child: Container(
padding: EdgeInsets.symmetric(horizontal: width * 0.1),
color: Colors.white,
height: height,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
const SizedBox(
width: double.infinity,
child: Text(
'Iniciar sesión',
style: TextStyle(
color: Color(0xFF262626),
fontSize: 38.0,
fontWeight: FontWeight.bold,
),
),
),
const SizedBox(height: 20),
const SizedBox(
width: double.infinity,
child: Text(
'Numero de celular',
style: TextStyle(
fontSize: 18.0,
color: Color(0xFF65676B),
),
),
),
Form(
key: _formKey,
child: IntlPhoneField(
controller: controller.phoneNo,
initialCountryCode: 'CO',
keyboardType: TextInputType.number,
onChanged: (phoneNo) {
completePhoneNumber = phoneNo.completeNumber;
},
decoration: const InputDecoration(
border: OutlineInputBorder(
borderSide:
BorderSide(color: Color(0xFFECECEC)),
borderRadius: BorderRadius.all(
Radius.circular(50),
)),
errorBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Color.fromARGB(255, 184, 0, 0)),
borderRadius: BorderRadius.all(
Radius.circular(50),
)),
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,
),
),
),
const Text(
'Un código será enviado a este numero de celular.',
textAlign: TextAlign.center,
),
Expanded(
child: Container(
padding: EdgeInsets.symmetric(horizontal: width * 0.1),
color: Colors.white,
height: height,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
const SizedBox(
width: double.infinity,
child: Text(
'Iniciar sesión',
style: TextStyle(
fontSize: 13.0,
color: Color(0xFF262626),
fontSize: 38.0,
fontWeight: FontWeight.bold,
),
),
),
const SizedBox(height: 20),
const SizedBox(
width: double.infinity,
child: Text(
'Numero de celular',
style: TextStyle(
fontSize: 18.0,
color: Color(0xFF65676B),
),
),
const SizedBox(height: 20),
PrimaryButtom(
onPressed: () {
if (_formKey.currentState!.validate()) {
PhoneAuthController.instance.phoneAuthentication(
completePhoneNumber.trim(),
);
Get.to(
() => CodeValidationScreen(
phoneNumber: completePhoneNumber.trim(),
),
);
}
),
Form(
key: _formKey,
child: IntlPhoneField(
controller: controller.phoneNo,
initialCountryCode: 'CO',
keyboardType: TextInputType.number,
onChanged: (phoneNo) {
completePhoneNumber = phoneNo.completeNumber;
},
label: 'Enviar código',
),
const SizedBox(height: 20),
GestureDetector(
onTap: () {
Navigator.pushNamed(context, '/login');
},
child: const Text(
'Entrar con correo electronico',
style: TextStyle(
fontSize: 15.0, color: Color(0xFF65676B),
decoration: TextDecoration.underline, // Subrayado
),
decoration: const InputDecoration(
border: OutlineInputBorder(
borderSide: BorderSide(color: Color(0xFFECECEC)),
borderRadius: BorderRadius.all(
Radius.circular(50),
)),
errorBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Color.fromARGB(255, 184, 0, 0)),
borderRadius: BorderRadius.all(
Radius.circular(50),
)),
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,
),
),
const SizedBox(height: 20),
RichText(
text: TextSpan(
style: const TextStyle(
fontSize: 16.0,
color: Color(0xFF65676B),
fontFamily: 'Poppins',
),
children: [
const TextSpan(text: 'No estas registrado? '),
WidgetSpan(
child: GestureDetector(
onTap: () {
Navigator.pushNamed(context, '/register');
},
child: const Text(
'Registrarse',
style: TextStyle(
fontSize: 16.0,
color: Color(0xFF2BA4EC),
fontWeight: FontWeight.w600,
),
),
const Text(
'Un código será enviado a este numero de celular.',
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 13.0,
color: Color(0xFF65676B),
),
),
const SizedBox(height: 20),
PrimaryButtom(
onPressed: () {
if (_formKey.currentState!.validate()) {
PhoneAuthController.instance.phoneAuthentication(
completePhoneNumber.trim(),
);
Get.to(
() => CodeValidationScreen(
phoneNumber: completePhoneNumber.trim(),
),
);
}
},
label: 'Enviar código',
),
const SizedBox(height: 20),
GestureDetector(
onTap: () {
Navigator.pushNamed(context, '/login');
},
child: const Text(
'Entrar con correo electronico',
style: TextStyle(
fontSize: 15.0, color: Color(0xFF65676B),
decoration: TextDecoration.underline, // Subrayado
),
),
),
const SizedBox(height: 20),
RichText(
text: TextSpan(
style: const TextStyle(
fontSize: 16.0,
color: Color(0xFF65676B),
fontFamily: 'Poppins',
),
children: [
const TextSpan(text: 'No estas registrado? '),
WidgetSpan(
child: GestureDetector(
onTap: () {
Navigator.pushNamed(context, '/register');
},
child: const Text(
'Registrarse',
style: TextStyle(
fontSize: 16.0,
color: Color(0xFF2BA4EC),
fontWeight: FontWeight.w600,
),
),
),
],
),
),
],
),
],
),
),
],
),
),
],
),
));
),
],
),
),
);
}
}