This commit is contained in:
Juan Felipe Duarte
2023-04-14 08:53:10 -05:00
parent 232ca3df46
commit 86e3b47693
6 changed files with 1021 additions and 980 deletions
+142 -131
View File
@@ -15,148 +15,159 @@ class CodeValidationScreen extends StatelessWidget {
var otp;
return SafeArea(
child: Scaffold(
resizeToAvoidBottomInset: false,
backgroundColor: Color(0xFFD6F4FF),
body: Stack(
children: [
Container(
margin: const EdgeInsets.only(top: 280),
width: double.infinity,
height: 600,
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topRight: Radius.circular(50),
topLeft: Radius.circular(50))),
),
Container(
margin: const EdgeInsets.only(top: 120, left: 70, right: 70),
child: const Image(image: AssetImage('images/logo_prosapp.png')),
),
Container(
padding: const EdgeInsets.symmetric(horizontal: 0, vertical: 20),
margin: const EdgeInsets.only(top: 280, left: 25),
child: Row(
children: <Widget>[
IconButton(
icon: Icon(
Icons.arrow_back,
size: 30,
),
onPressed: () {
Navigator.pop(context);
},
),
Text(
'Validar código',
style: TextStyle(
color: Color(0xFF262626),
fontSize: 38.0,
fontWeight: FontWeight.bold,
),
textAlign: TextAlign.right,
),
],
),
),
Container(
padding: const EdgeInsets.symmetric(horizontal: 0, vertical: 20),
margin: const EdgeInsets.only(top: 350, left: 50, right: 50),
child: Column(children: [
const Padding(
padding: EdgeInsets.only(bottom: 5),
child: Align(
alignment: Alignment.topLeft,
child: Text('Numero de celular',
style: TextStyle(
fontSize: 18.0, color: Color(0xFF65676B))),
)),
Padding(
padding: EdgeInsets.only(bottom: 20),
child: Scaffold(
backgroundColor: const Color(0xFFD6F4FF),
body: SingleChildScrollView(
reverse: true,
child: Stack(
children: [
Container(
margin: const EdgeInsets.only(top: 280),
width: double.infinity,
height: MediaQuery.of(context).size.height / 1.5,
decoration: const BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topRight: Radius.circular(50),
topLeft: Radius.circular(50))),
),
Container(
margin: const EdgeInsets.only(top: 120, left: 70, right: 70),
child:
const Image(image: AssetImage('images/logo_prosapp.png')),
),
Container(
padding:
const EdgeInsets.symmetric(horizontal: 0, vertical: 20),
margin: const EdgeInsets.only(top: 280, left: 25),
child: Row(
children: [
Expanded(
child: TextField(
onChanged: (value) {
phoneNumber = value;
},
controller:
TextEditingController(text: phoneNumber ?? ''),
decoration: InputDecoration(
border: InputBorder.none,
hintText: '',
suffixIcon: Icon(Icons.edit),
),
children: <Widget>[
IconButton(
icon: Icon(
Icons.arrow_back,
size: 30,
),
),
TextButton(
child: Text('Reenviar código'),
onPressed: () {
if (phoneNumber!.isNotEmpty) {
PhoneAuthController.instance.phoneAuthentication(
phoneNumber!,
);
}
Navigator.pop(context);
},
),
Text(
'Validar código',
style: TextStyle(
color: Color(0xFF262626),
fontSize: 38.0,
fontWeight: FontWeight.bold,
),
textAlign: TextAlign.right,
),
],
),
),
Align(
alignment: Alignment.topLeft,
child: Padding(
padding: const EdgeInsets.only(bottom: 5),
child: Text('Codigo',
textAlign: TextAlign.left,
style:
TextStyle(fontSize: 18.0, color: Color(0xFF65676B))),
Container(
padding:
const EdgeInsets.symmetric(horizontal: 0, vertical: 20),
margin: const EdgeInsets.only(top: 350, left: 50, right: 50),
child: Column(
children: [
const Padding(
padding: EdgeInsets.only(bottom: 5),
child: Align(
alignment: Alignment.topLeft,
child: Text('Numero de celular',
style: TextStyle(
fontSize: 18.0, color: Color(0xFF65676B))),
)),
Padding(
padding: EdgeInsets.only(bottom: 20),
child: Row(
children: [
Expanded(
child: TextField(
onChanged: (value) {
phoneNumber = value;
},
controller: TextEditingController(
text: phoneNumber ?? ''),
decoration: InputDecoration(
border: InputBorder.none,
hintText: '',
suffixIcon: Icon(Icons.edit),
),
),
),
TextButton(
child: Text('Reenviar código'),
onPressed: () {
if (phoneNumber!.isNotEmpty) {
PhoneAuthController.instance
.phoneAuthentication(
phoneNumber!,
);
}
},
),
],
),
),
Align(
alignment: Alignment.topLeft,
child: Padding(
padding: const EdgeInsets.only(bottom: 5),
child: Text('Codigo',
textAlign: TextAlign.left,
style: TextStyle(
fontSize: 18.0, color: Color(0xFF65676B))),
),
),
Padding(
padding: EdgeInsets.only(bottom: 20),
child: OtpTextField(
numberOfFields: 6,
focusedBorderColor: Colors.blue,
fillColor: Colors.black.withOpacity(0.1),
filled: true,
keyboardType: TextInputType.number,
onSubmit: (code) {
otp = code;
OTPController.instance.verifyOTP(otp);
},
),
),
Padding(
padding: EdgeInsets.only(bottom: 40),
child: Center(
child: ElevatedButton(
onPressed: () {
OTPController.instance.verifyOTP(otp);
},
child: Text(
'Validar código',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 18,
),
),
style: ElevatedButton.styleFrom(
primary: Color(0xFF2BA4EC), // Color del botón
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(
50), // Bordes redondeados
),
elevation: 0,
minimumSize:
Size(230, 60), // Tamaño mínimo del botón
),
),
),
),
],
),
),
Padding(
padding: EdgeInsets.only(bottom: 20),
child: OtpTextField(
numberOfFields: 6,
focusedBorderColor: Colors.blue,
fillColor: Colors.black.withOpacity(0.1),
filled: true,
keyboardType: TextInputType.number,
onSubmit: (code) {
otp = code;
OTPController.instance.verifyOTP(otp);
},
),
),
Padding(
padding: EdgeInsets.only(bottom: 40),
child: Center(
child: ElevatedButton(
onPressed: () {
OTPController.instance.verifyOTP(otp);
},
child: Text(
'Validar código',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 18,
),
),
style: ElevatedButton.styleFrom(
primary: Color(0xFF2BA4EC), // Color del botón
shape: RoundedRectangleBorder(
borderRadius:
BorderRadius.circular(50), // Bordes redondeados
),
elevation: 0,
minimumSize: Size(230, 60), // Tamaño mínimo del botón
),
)),
),
]),
],
),
],
),
),
));
);
}
}