130 lines
5.1 KiB
Dart
130 lines
5.1 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter/widgets.dart';
|
|
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
|
import 'package:get/get.dart';
|
|
import 'package:pin_code_fields/pin_code_fields.dart';
|
|
import 'package:traderscircuit/Utils/Common/CommonAppbar.dart';
|
|
import 'package:traderscircuit/Utils/Common/commonBotton.dart';
|
|
import 'package:traderscircuit/Utils/text.dart';
|
|
import 'package:traderscircuit/resources/routes/route_name.dart';
|
|
import 'package:traderscircuit/view/onBoarding/splashScreen1.dart';
|
|
|
|
class VerifyOTP extends StatefulWidget {
|
|
const VerifyOTP({super.key});
|
|
|
|
@override
|
|
State<VerifyOTP> createState() => _VerifyOTPState();
|
|
}
|
|
|
|
class _VerifyOTPState extends State<VerifyOTP> {
|
|
final GlobalKey<FormState> _otpform = GlobalKey<FormState>();
|
|
TextEditingController pincode = TextEditingController();
|
|
Color primaryColor = Colors.transparent.withOpacity(0.2);
|
|
Color secondaryColor = Colors.grey.shade800;
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
appBar: CommonAppbar(titleTxt: "Verify OTP"),
|
|
backgroundColor: Colors.black,
|
|
extendBody: true,
|
|
body: Stack(
|
|
children: [
|
|
CommonBlurLeft(),
|
|
CommonBlurRight(),
|
|
Stack(
|
|
children: [
|
|
Padding(
|
|
padding: EdgeInsets.symmetric(horizontal: 16, vertical: 16),
|
|
child: Form(
|
|
key: _otpform,
|
|
child: ListView(
|
|
physics: BouncingScrollPhysics(),
|
|
// mainAxisAlignment: MainAxisAlignment.start,
|
|
// crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
text18W400("Enter four digit code send to"),
|
|
SizedBox(
|
|
height: 100.h,
|
|
),
|
|
Container(
|
|
child: PinCodeTextField(
|
|
showCursor: true,
|
|
cursorColor: Colors.white,
|
|
hintStyle:
|
|
TextStyle(fontSize: 18.sp, color: Colors.white),
|
|
textStyle:
|
|
TextStyle(fontSize: 18.sp, color: Colors.white),
|
|
errorTextSpace: 22,
|
|
validator: (value) {
|
|
if (value != null && value.isEmpty) {
|
|
return "Please Enter verification code";
|
|
} else if (value != null && value.length < 4) {
|
|
return "OTP length should be atleast 4";
|
|
}
|
|
return null;
|
|
},
|
|
keyboardType: TextInputType.number,
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
length: 4,
|
|
obscureText: false,
|
|
animationType: AnimationType.fade,
|
|
pinTheme: PinTheme(
|
|
selectedFillColor: primaryColor,
|
|
inactiveFillColor: primaryColor,
|
|
activeFillColor: primaryColor,
|
|
inactiveColor: secondaryColor,
|
|
activeColor: secondaryColor,
|
|
selectedColor: secondaryColor,
|
|
shape: PinCodeFieldShape.box,
|
|
borderRadius: BorderRadius.circular(15),
|
|
fieldHeight: 60.h,
|
|
fieldWidth: 60.w,
|
|
),
|
|
animationDuration: Duration(milliseconds: 300),
|
|
enableActiveFill: true,
|
|
controller: pincode,
|
|
onCompleted: (v) {
|
|
print("Completed");
|
|
},
|
|
onChanged: (value) {
|
|
print(value);
|
|
setState(() {});
|
|
},
|
|
beforeTextPaste: (text) {
|
|
print("Allowing to paste $text");
|
|
|
|
return true;
|
|
},
|
|
appContext: context,
|
|
),
|
|
),
|
|
SizedBox(
|
|
height: 45.h,
|
|
),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: [
|
|
text16W700("Resend Code"),
|
|
],
|
|
),
|
|
SizedBox(
|
|
height: 200.h,
|
|
),
|
|
CommonBtn(
|
|
text: "Verify OTP",
|
|
onTap: () {
|
|
Get.toNamed(RouteName.secureaccess);
|
|
},
|
|
)
|
|
],
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|