import 'package:diplomaticquarterapp/config/size_config.dart'; import 'package:diplomaticquarterapp/widgets/text/app_texts_widget.dart'; import 'package:flutter/material.dart'; class SMSOTP { final type; final mobileNo; final Function onSuccess; final Function onFailure; final context; SMSOTP( this.context, this.type, this.mobileNo, this.onSuccess, this.onFailure); Map verifyAccountFormValue = { 'digit1': null, 'digit2': null, 'digit3': null, 'digit4': null, }; final focusD1 = FocusNode(); final focusD2 = FocusNode(); final focusD3 = FocusNode(); final focusD4 = FocusNode(); displayDialog(BuildContext context) async { return showDialog( context: context, builder: (context) { return AlertDialog( title: Row( mainAxisAlignment: MainAxisAlignment.end, children: [ IconButton( icon: Icon(Icons.close), onPressed: () => { Navigator.pop(context), this.onSuccess(verifyAccountFormValue) }, ) ], ), shape: RoundedRectangleBorder( borderRadius: BorderRadius.all(Radius.circular(10.0))), content: Builder(builder: (context) { return Container( color: Colors.white, height: SizeConfig.realScreenHeight * 0.5, width: SizeConfig.realScreenWidth * 0.8, child: Center( child: Column( crossAxisAlignment: CrossAxisAlignment.center, children: [ Image.asset('assets/images/login/103.png'), Padding( padding: EdgeInsets.only(top: 20), child: AppText( 'Enter The Varification sent to XXXXXXX144', textAlign: TextAlign.center, )), Padding( padding: EdgeInsets.only(top: 20), child: Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ Container( width: SizeConfig.realScreenWidth * 0.15, child: TextFormField( textInputAction: TextInputAction.next, style: buildTextStyle(), autofocus: true, maxLength: 1, textAlign: TextAlign.center, keyboardType: TextInputType.number, decoration: buildInputDecoration(context), onSaved: (val) { verifyAccountFormValue['digit1'] = val; }, validator: validateCodeDigit, onFieldSubmitted: (_) { FocusScope.of(context).requestFocus(focusD2); }, onChanged: (val) { if (val.length == 1) { FocusScope.of(context) .requestFocus(focusD2); } }, ), ), Container( width: SizeConfig.realScreenWidth * 0.15, child: TextFormField( focusNode: focusD2, textInputAction: TextInputAction.next, maxLength: 1, textAlign: TextAlign.center, style: buildTextStyle(), keyboardType: TextInputType.number, decoration: buildInputDecoration(context), onSaved: (val) { verifyAccountFormValue['digit2'] = val; }, onFieldSubmitted: (_) { FocusScope.of(context) .requestFocus(focusD3); }, onChanged: (val) { if (val.length == 1) { FocusScope.of(context) .requestFocus(focusD3); } }, validator: validateCodeDigit), ), Container( width: SizeConfig.realScreenWidth * 0.15, child: TextFormField( focusNode: focusD3, textInputAction: TextInputAction.next, maxLength: 1, textAlign: TextAlign.center, style: buildTextStyle(), keyboardType: TextInputType.number, decoration: buildInputDecoration(context), onSaved: (val) { verifyAccountFormValue['digit3'] = val; }, onFieldSubmitted: (_) { FocusScope.of(context) .requestFocus(focusD4); }, onChanged: (val) { if (val.length == 1) { FocusScope.of(context) .requestFocus(focusD4); } }, validator: validateCodeDigit)), Container( width: SizeConfig.realScreenWidth * 0.15, child: TextFormField( focusNode: focusD4, maxLength: 1, textAlign: TextAlign.center, style: buildTextStyle(), keyboardType: TextInputType.number, decoration: buildInputDecoration(context), onSaved: (val) { verifyAccountFormValue['digit4'] = val; }, validator: validateCodeDigit)) ], )) ], )), ); }), // actions: [ // new FlatButton( // child: new Text('SUBMIT'), // onPressed: () { // Navigator.of(context).pop(); // }, // ) // ], ); }); } TextStyle buildTextStyle() { return TextStyle( fontSize: SizeConfig.textMultiplier * 3, ); } InputDecoration buildInputDecoration(BuildContext context) { return InputDecoration( // ts/images/password_icon.png contentPadding: EdgeInsets.only(top: 20, bottom: 20), enabledBorder: OutlineInputBorder( borderRadius: BorderRadius.all(Radius.circular(10)), borderSide: BorderSide(color: Colors.black), ), focusedBorder: OutlineInputBorder( borderRadius: BorderRadius.all(Radius.circular(10.0)), borderSide: BorderSide(color: Theme.of(context).primaryColor), ), errorBorder: OutlineInputBorder( borderRadius: BorderRadius.all(Radius.circular(10.0)), borderSide: BorderSide(color: Theme.of(context).errorColor), ), focusedErrorBorder: OutlineInputBorder( borderRadius: BorderRadius.all(Radius.circular(10.0)), borderSide: BorderSide(color: Theme.of(context).errorColor), ), ); } String validateCodeDigit(value) { if (value.isEmpty) { return 'Please enter your Password'; } else if (value.length == 3) { print(value); } else { return null; } } }