The key [GlobalObjectKey int#a1467] was used by multiple widgets - flutter

I have project that have very long sheet code on each page without Bloc or other code separation.
I have this code, that must open dialog with location peeker in one page:
showDialog(
context: context,
builder: (BuildContext context) {
return LocationPickerDialog(_address);
}).then....
After clicking, a bug occurs. In project no GlobalKeys.In other page this code don't bug.
The key [GlobalObjectKey int#a1467] was used by multiple widgets. The parents of those widgets were different widgets that both had the following description:
Builder(dependencies: [MediaQuery])
A GlobalKey can only be specified on one widget at a time in the widget tree.
how to understand why this is happening?
What widget is causing this?
UPDATE:
class LocationPickerDialog extends StatefulWidget {
var retrieveAddress;
LocationPickerDialog(this.retrieveAddress);
#override
_LocationPickerDialogState createState() =>
new _LocationPickerDialogState(retrieveAddress);
}
class _LocationPickerDialogState extends State<LocationPickerDialog> {
var retrieveAddress;
_LocationPickerDialogState(this.retrieveAddress);
final searchLinkHolder = TextEditingController();
final addressHolder = TextEditingController();
var searchLink;
var _address;
var Address = "";
List<String> placeList = [];
var Locationlist = <beanLocation>[];
#override
void initState() {
super.initState();
}
getSuggestions(String query) {
if (query.isNotEmpty) {
API.getPlaceSearchAPI(query).then((response) {
setState(() {
Iterable list = json.decode(response.body)['features'];
Locationlist =
list.map((model) => beanLocation.fromJson(model)).toList();
});
});
setState(() {
placeList.clear();
for (int i = 0; i < Locationlist.length; i++) {
Constant_Class.printMessage(
"Locationlist => $i" + Locationlist[i].name.toString());
placeList.add(Locationlist[i].name);
}
});
} else {
Constant_Class.printMessage("Locationlist => 123");
}
}
#override
Widget build(BuildContext context) {
return ScreenUtilInit(
// designSize: Constant_Class.screenSize(context),
builder: (_) => Scaffold(
backgroundColor: Colors.transparent,
resizeToAvoidBottomInset: false,
body: Stack(
children: [
GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Container(
color: Colors.black.withOpacity(0.5),
),
),
Container(
margin: EdgeInsets.only(right: 20, left: 20, bottom: 20, top: 20),
child: Container(
decoration: BoxDecoration(
borderRadius: new BorderRadius.all(const Radius.circular(30)),
color: Colors.white,
),
padding: EdgeInsets.all(10),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Align(
alignment: Alignment.topRight,
child: InkWell(
onTap: () {
Navigator.pop(context);
},
child: Container(
margin:
EdgeInsets.only(right: 10, top: 5, bottom: 5),
height: 35,
width: 35,
padding: EdgeInsets.all(5),
decoration: BoxDecoration(
shape: BoxShape.circle,
color: ColorsApp.colorSelectedTab),
child: Center(
child: Icon(
Icons.close_rounded,
color: Colors.white,
),
)),
),
),
Container(
margin: EdgeInsets.all(5),
padding: EdgeInsets.all(12),
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius:
new BorderRadius.all(const Radius.circular(30)),
border: Border.all(color: Colors.black, width: 1.0)),
child: TextFormField(
controller: searchLinkHolder,
textAlignVertical: TextAlignVertical.center,
textInputAction: TextInputAction.done,
cursorColor: Colors.black,
style: TextStyle(
fontFamily: Constant_Class.appFontFamily,
color: Colors.black),
decoration: new InputDecoration(
border: InputBorder.none,
focusedBorder: InputBorder.none,
enabledBorder: InputBorder.none,
errorBorder: InputBorder.none,
disabledBorder: InputBorder.none,
isDense: true,
contentPadding: EdgeInsets.only(top: 3),
filled: false,
//fillColor: Theme.of(context).cardColor,
labelStyle: TextStyle(
fontFamily: Constant_Class.appFontFamily,
fontSize: 16,
fontWeight: FontWeight.normal,
color: Colors.black),
hintStyle: TextStyle(
fontFamily: Constant_Class.appFontFamily,
fontSize: 16,
fontWeight: FontWeight.normal,
color: Colors.grey),
hintText: 'google_meet'.tr()),
keyboardType: TextInputType.text,
onSaved: (val) {
searchLink = val;
},
onChanged: (val) {
searchLink = val;
},
onFieldSubmitted: (value) {
// if(value != null && value.trim() != ""){
// Navigator.of(context).pop(value);
// }
setState(() {
searchLink = value;
});
if (value != null && Uri.parse(value).host != "") {
Constant_Class.locationLatitude = "";
Constant_Class.locationLongitude = "";
Constant_Class.printMessage(value);
Navigator.of(context).pop(value);
} else {
Constant_Class.ToastMessage(
'Please enter valid url');
}
},
),
),
SizedBox(
height: 10,
),
_textWithRightLeftLine('or'.tr()),
SizedBox(
height: 10,
),
Container(
margin: EdgeInsets.all(5),
padding: EdgeInsets.all(12),
alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius:
new BorderRadius.all(const Radius.circular(30)),
border: Border.all(color: Colors.black, width: 1.0)),
child: TextFormField(
controller: addressHolder,
textAlignVertical: TextAlignVertical.center,
textInputAction: TextInputAction.done,
cursorColor: Colors.black,
style: TextStyle(
fontFamily: Constant_Class.appFontFamily,
color: Colors.black),
decoration: new InputDecoration(
border: InputBorder.none,
focusedBorder: InputBorder.none,
enabledBorder: InputBorder.none,
errorBorder: InputBorder.none,
disabledBorder: InputBorder.none,
isDense: true,
contentPadding: EdgeInsets.only(top: 3),
filled: false,
//fillColor: Theme.of(context).cardColor,
labelStyle: TextStyle(
fontFamily: Constant_Class.appFontFamily,
fontSize: 16,
fontWeight: FontWeight.normal,
color: Colors.black),
hintStyle: TextStyle(
fontFamily: Constant_Class.appFontFamily,
fontSize: 16,
fontWeight: FontWeight.normal,
color: Colors.grey),
hintText: 'search_location'.tr()),
keyboardType: TextInputType.text,
onSaved: (val) {
_address = val;
getSuggestions(val.toString());
},
onChanged: (val) {
_address = val;
getSuggestions(val.toString());
},
onFieldSubmitted: (value) {
Constant_Class.locationLatitude = "";
Constant_Class.locationLongitude = "";
setState(() {
_address = value;
});
if (searchLink != null &&
Uri.parse(searchLink).host != "") {
Constant_Class.printMessage(searchLink);
Navigator.of(context).pop(searchLink);
} else {
Navigator.of(context).pop(_address);
}
},
),
),
Expanded(
child: ListView.separated(
physics: BouncingScrollPhysics(
parent: AlwaysScrollableScrollPhysics()),
shrinkWrap: true,
itemCount: placeList.length,
separatorBuilder: (BuildContext context, int index) =>
Divider(),
itemBuilder: (BuildContext context, int index) {
return ListTile(
dense: true,
title: InkWell(
onTap: () {
Constant_Class.locationLatitude =
Locationlist[index].latitude;
Constant_Class.locationLongitude =
Locationlist[index].longitude;
Navigator.of(context)
.pop(placeList[index].toString());
},
// child: Text(placeList[index].toString()),
child: Text(
placeList[index].toString(),
textAlign: TextAlign.left,
style: TextStyle(
fontFamily: Constant_Class.appFontFamily,
fontWeight: FontWeight.w500,
color: Colors.black,
fontSize: 16),
),
),
);
},
),
),
],
),
),
),
],
),
),
);
}
Widget _textWithRightLeftLine(var title) {
return Container(
child: Column(
children: [
Row(
children: [
Expanded(
child: new Container(
margin: const EdgeInsets.only(left: 0.0, right: 10.0),
child: Container(
color: ColorsApp.colorTextLight,
height: 1,
)),
),
Text(
title,
style: TextStyle(
color: ColorsApp.colorTextDark,
fontFamily: Constant_Class.appFontFamily),
),
Expanded(
child: new Container(
margin: const EdgeInsets.only(left: 10.0, right: 0.0),
child: Container(
color: ColorsApp.colorTextLight,
height: 1,
)),
),
],
),
],
),
);
}
}
https://drive.google.com/file/d/1KRidmPbZJeobB6FCG2TZmn1ENFvkAojj/view?usp=sharing

I found what it was. in this screen and in the dialog root widget was ScreenUtilInit from the flutter_screenutil package. I deleted this from one page and the problem was solved.

Related

How to write a code for update logged in user data into firebase using flutter

I'm a newbie for flutter and currently learning it by developing a small system for my university project. Below are my user register and profile view which I referenced from YouTube. But I do not know how to write a code for edit and delete the logged in user data (the personal information such as name and address)...
class RegMuser extends StatefulWidget {
const RegMuser({Key? key}) : super(key: key);
#override
_RegMuserState createState() => _RegMuserState();
}
class _RegMuserState extends State<RegMuser> {
bool hidePassword = true;
final formkey = GlobalKey<FormState>();
final nameEC = new TextEditingController();
final emailEC = new TextEditingController();
final nricEC = new TextEditingController();
final passwordEC = new TextEditingController();
final confirmPasswordEC = new TextEditingController();
final _auth = FirebaseAuth.instance;
#override
Widget build(BuildContext context) {
final nameField = TextFormField(
autofocus: false,
controller: nameEC,
keyboardType: TextInputType.name,
validator: (value) {
RegExp regex = new RegExp(r'^.{3,}$');
if (value!.isEmpty) {
return ("Name Cannot Be Empty");
}
if (!regex.hasMatch(value)) {
return ("Enter A Valid Name");
}
return null;
},
onSaved: (value) {
nameEC.text = value!;
},
textInputAction: TextInputAction.next,
decoration: InputDecoration(
prefixIcon: Icon(Icons.person),
contentPadding: EdgeInsets.fromLTRB(20, 15, 20, 15),
labelText: 'Name',
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
),
),
);
final emailField = TextFormField(
autofocus: false,
controller: emailEC,
keyboardType: TextInputType.emailAddress,
validator: (value) {
if (value!.isEmpty) {
return ("Please Enter Your Email");
}
if (!RegExp("^[a-zA-Z0-9+_.-]+#[a-zA-Z0-9.-]+[a-z]").hasMatch(value)) {
return ("Please Enter Valid Email");
}
return null;
},
onSaved: (value) {
nameEC.text = value!;
},
textInputAction: TextInputAction.next,
decoration: InputDecoration(
prefixIcon: Icon(Icons.mail),
contentPadding: EdgeInsets.fromLTRB(20, 15, 20, 15),
labelText: "Email",
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
),
),
);
final nricField = TextFormField(
autofocus: false,
controller: nricEC,
keyboardType: TextInputType.number,
validator: (value) {
RegExp regex = new RegExp(r'[0-9]');
if (value!.isEmpty) {
return ("NRIC Cannot Be Empty");
}
if (!regex.hasMatch(value)) {
return ("Enter A Valid NRIC");
}
if (nricEC.text.length != 12) {
return ("Enter A Valid NRIC");
}
return null;
},
onSaved: (value) {
nricEC.text = value!;
},
textInputAction: TextInputAction.next,
decoration: InputDecoration(
prefixIcon: Icon(Icons.card_membership),
contentPadding: EdgeInsets.fromLTRB(20, 15, 20, 15),
labelText: "NRIC",
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
),
),
);
final passwordField = TextFormField(
autofocus: false,
controller: passwordEC,
obscureText: hidePassword,
validator: (value) {
RegExp regex = new RegExp(r'^.{6,}$');
if (value!.isEmpty) {
return ("Password Is Required For Login");
}
if (!regex.hasMatch(value)) {
return ("Please Enter Valid Password");
}
},
textInputAction: TextInputAction.next,
decoration: InputDecoration(
prefixIcon: Icon(Icons.vpn_key),
contentPadding: EdgeInsets.fromLTRB(20, 15, 20, 15),
labelText: "Pasword",
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
),
suffixIcon: InkWell(
onTap: togglePasswordView,
child: Icon(
Icons.visibility,
),
),
),
);
final confirmPasswordField = TextFormField(
autofocus: false,
controller: confirmPasswordEC,
obscureText: hidePassword,
validator: (value) {
if (confirmPasswordEC.text != passwordEC.text) {
return "Password Don't Match";
}
return null;
},
textInputAction: TextInputAction.next,
decoration: InputDecoration(
prefixIcon: Icon(Icons.vpn_key),
contentPadding: EdgeInsets.fromLTRB(20, 15, 20, 15),
labelText: "Confirm Pasword",
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
),
suffixIcon: InkWell(
onTap: togglePasswordView,
child: Icon(
Icons.visibility,
),
),
),
);
final signUpButton = Material(
elevation: 5,
borderRadius: BorderRadius.circular(30),
color: Colors.blue[400],
child: MaterialButton(
padding: EdgeInsets.fromLTRB(20, 15, 20, 15),
minWidth: MediaQuery.of(context).size.width,
onPressed: () {
signUp(emailEC.text, passwordEC.text);
},
child: Text(
"Sign Up",
style: TextStyle(
fontSize: 20,
color: Colors.white,
fontWeight: FontWeight.bold,
),
),
),
);
return Scaffold(
backgroundColor: Colors.blueGrey[100],
appBar: AppBar(
backgroundColor: Colors.transparent,
elevation: 0,
leading: IconButton(
icon: Icon(
Icons.arrow_back,
color: Colors.black,
),
onPressed: () {
Navigator.of(context).pop();
},
),
),
body: Center(
child: SingleChildScrollView(
child: Container(
color: Colors.white,
child: Padding(
padding: const EdgeInsets.all(36.0),
child: Form(
key: formkey,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
SizedBox(height: 20),
nameField,
SizedBox(height: 20),
emailField,
SizedBox(height: 20),
nricField,
SizedBox(height: 20),
passwordField,
SizedBox(height: 20),
confirmPasswordField,
SizedBox(height: 20),
signUpButton,
SizedBox(height: 10),
],
),
),
),
),
),
),
);
}
void togglePasswordView() {
setState(() {
hidePassword = !hidePassword;
});
}
void signUp(String email, String password) async {
if (formkey.currentState!.validate()) {
await _auth
.createUserWithEmailAndPassword(email: email, password: password)
.then((value) => {postDetailsToFirestore()})
.catchError((e) {
Fluttertoast.showToast(msg: e!.message);
});
}
}
postDetailsToFirestore() async {
FirebaseFirestore firebaseFirestore = FirebaseFirestore.instance;
User? mUser = _auth.currentUser;
Muser muser = Muser();
muser.email = mUser!.email;
muser.uid = mUser.uid;
muser.name = nameEC.text;
muser.nric = nricEC.text;
await firebaseFirestore
.collection("mUsers")
.doc(muser.uid)
.set(muser.toMap());
Fluttertoast.showToast(msg: "Account Created Successfully");
Navigator.pushAndRemoveUntil((context),
MaterialPageRoute(builder: (context) => homePage()), (route) => false);
}
}
Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10)),
child: Container(
child: Column(
children: <Widget>[
ListTile(
title: Text(
"Name",
style: TextStyle(
color: Colors.black54,
fontSize: 13,
fontWeight: FontWeight.bold,
),
),
subtitle: Text(
"${loggedInUser.name}",
style: TextStyle(
color: Colors.black,
fontSize: 18,
),
),
shape: RoundedRectangleBorder(
side: BorderSide(
color: Colors.black54,
width: 3,
),
borderRadius: BorderRadius.circular(10),
),
),
SizedBox(height: 10.0),
ListTile(
title: Text(
"Email",
style: TextStyle(
color: Colors.black54,
fontSize: 13,
fontWeight: FontWeight.bold,
),
),
subtitle: Text(
"${loggedInUser.email}",
style: TextStyle(
color: Colors.black,
fontSize: 18,
),
),
shape: RoundedRectangleBorder(
side: BorderSide(
color: Colors.black54,
width: 3,
),
borderRadius: BorderRadius.circular(10),
),
),
SizedBox(height: 10.0),
ListTile(
title: Text(
"Position",
style: TextStyle(
color: Colors.black54,
fontSize: 13,
fontWeight: FontWeight.bold,
),
),
subtitle: Text(
"${loggedInUser.post}",
style: TextStyle(
color: Colors.black,
fontSize: 18,
),
),
shape: RoundedRectangleBorder(
side: BorderSide(
color: Colors.black54,
width: 3,
),
borderRadius: BorderRadius.circular(10),
),
),
SizedBox(height: 10.0),
ListTile(
title: Text(
"Department",
style: TextStyle(
color: Colors.black54,
fontSize: 13,
fontWeight: FontWeight.bold,
),
),
subtitle: Text(
"${loggedInUser.dept}",
style: TextStyle(
color: Colors.black,
fontSize: 18,
),
),
shape: RoundedRectangleBorder(
side: BorderSide(
color: Colors.black54,
width: 3,
),
borderRadius: BorderRadius.circular(10),
),
),
SizedBox(height: 10.0),
ListTile(
title: Text(
"Hospital",
style: TextStyle(
color: Colors.black54,
fontSize: 13,
fontWeight: FontWeight.bold,
),
),
subtitle: Text(
"${loggedInUser.hosp}",
style: TextStyle(
color: Colors.black,
fontSize: 18,
),
),
shape: RoundedRectangleBorder(
side: BorderSide(
color: Colors.black54,
width: 3,
),
borderRadius: BorderRadius.circular(10),
),
),
SizedBox(height: 10.0),
ListTile(
title: Text(
"Address",
style: TextStyle(
color: Colors.black54,
fontSize: 13,
fontWeight: FontWeight.bold,
),
),
subtitle: Text(
"${loggedInUser.street} ${loggedInUser.city} ${loggedInUser.postcode} ${loggedInUser.state} ${loggedInUser.country}",
style: TextStyle(
color: Colors.black,
fontSize: 18,
),
),
shape: RoundedRectangleBorder(
side: BorderSide(
color: Colors.black54,
width: 3,
),
borderRadius: BorderRadius.circular(10),
),
),
],
),
),
),
// Import the Firebase package
import 'package:firebase_auth/firebase_auth.dart';
// Create an instance of the Firebase authentication
final FirebaseAuth _auth = FirebaseAuth.instance;
// Create a function to update logged in user data
Future<void> updateUserData(String name, String email, String phone) async {
// Get the current logged in user
FirebaseUser user = await _auth.currentUser();
// Create a user update profile
UserUpdateInfo userInfo = UserUpdateInfo();
// Update the user profile with the provided data
userInfo.displayName = name;
userInfo.email = email;
userInfo.phoneNumber = phone;
// Finally update the user profile
await user.updateProfile(userInfo);
}

how to make layout center vertical in flutter like in android

Like in android for layout we apply center vertical same way i m trying in flutter to make center vertical. so that entire widget view will be moved to center vertical. How to achieve this in flutter.
I have tried same using sizebox. How to make layout center vertical in flutter like in android.
Code as below:
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:login_app/sso.dart';
import 'package:flutter_svg/flutter_svg.dart';
class Otp extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return OtpPage();
}
}
class OtpPage extends State<Otp> {
String assetNameArrow = 'images/ic_back.svg';
String assertOtp = 'images/otp_sms.svg';
int backspaceClick = 0;
String otpError = "";
bool isHideOTP = true;
bool isTextFiledFocus = false;
String otp1 = "";
String otp2 = "";
String otp3 = "";
String otp4 = "";
String otp5 = "";
String otp6 = "";
FocusNode focusNodeOtp1 = FocusNode();
FocusNode focusNodeOtp2 = FocusNode();
FocusNode focusNodeOtp3 = FocusNode();
FocusNode focusNodeOtp4 = FocusNode();
FocusNode focusNodeOtp5 = FocusNode();
FocusNode focusNodeOtp6 = FocusNode();
#override
void initState() {
super.initState();
}
#override
void dispose() {
super.dispose();
}
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
resizeToAvoidBottomInset:
false, //to avoid floating container on keyboard, use this
backgroundColor: Colors.white,
body: SingleChildScrollView(
child: SafeArea(
child: Column(children: [
Padding(
padding: const EdgeInsets.only(left: 20, top: 20, bottom: 20),
child: Align(
alignment: Alignment.topLeft,
child: SvgPicture.asset(
assetNameArrow,
width: 8,
height: 19,
alignment: Alignment.topLeft,
),
),
),
SizedBox(
width: 70.0,
height: 70.0,
),
Container(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(left: 16),
child: Align(
alignment: Alignment.topLeft,
child: SvgPicture.asset(
assertOtp,
width: 61,
height: 61,
alignment: Alignment.topLeft,
),
),
),
Expanded(
child: Padding(
padding: const EdgeInsets.only(left: 16.0, right: 16.0),
child: Container(
child: Text('We need to make\nsure its you',
maxLines: 2,
style: TextStyle(
fontFamily: 'Circular_Std_Bold',
fontSize: 24.0,
color: Color(0xFF2E2E2E),
)),
),
),
),
],
),
),
Padding(
padding:
const EdgeInsets.only(left: 90.0, right: 16.0, top: 20.0),
child: Text(
'Please enter the OTP (One-Time Password) sent to your registered mobile number (ending in 6380). Do not share your OTP with anyone else.',
style: TextStyle(
fontFamily: 'Soleil_Regular',
fontSize: 14.0,
fontStyle: FontStyle.normal,
color: Color(0xFF2E2E2E),
)),
),
SizedBox(
width: 60.0,
height: 60.0,
),
Container(
// first
padding: EdgeInsets.all(16.0),
child: Row(children: [
Container(
margin: EdgeInsets.only(left: 16, right: 5),
//first
width: 46.0,
height: 48.0,
child: TextField(
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
textAlign: TextAlign.center,
// obscureText: isHideOTP,
enableSuggestions: false,
autocorrect: false,
autofocus: true,
focusNode: focusNodeOtp1,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide:
BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide:
BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp1 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp2.requestFocus();
}
},
),
),
Container(
margin: EdgeInsets.only(left: 5, right: 5),
// secound
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {
if (event.logicalKey ==
LogicalKeyboardKey.backspace &&
otp2 == "") {
backspaceClick = backspaceClick + 1;
if (backspaceClick >= 2) {
focusNodeOtp1.requestFocus();
}
}
},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
focusNode: focusNodeOtp2,
// obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp2 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp3.requestFocus();
}
},
)),
),
Container(
// Third
margin: EdgeInsets.only(left: 5, right: 5),
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {
if (event.logicalKey ==
LogicalKeyboardKey.backspace &&
otp3 == "") {
backspaceClick = backspaceClick + 1;
if (backspaceClick >= 2) {
focusNodeOtp2.requestFocus();
}
}
},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
focusNode: focusNodeOtp3,
//obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp3 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp4.requestFocus();
}
},
)),
),
Container(
margin: EdgeInsets.only(left: 5, right: 5),
// Fourth
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {
if (event.logicalKey ==
LogicalKeyboardKey.backspace &&
otp4 == "") {
backspaceClick = backspaceClick + 1;
if (backspaceClick >= 2) {
focusNodeOtp3.requestFocus();
}
}
},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
focusNode: focusNodeOtp4,
//obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp4 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp5.requestFocus();
}
},
)),
),
Container(
// Fifth
margin: EdgeInsets.only(left: 5, right: 5),
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {
if (event.logicalKey ==
LogicalKeyboardKey.backspace &&
otp5 == "") {
backspaceClick = backspaceClick + 1;
if (backspaceClick >= 2) {
focusNodeOtp4.requestFocus();
}
}
},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
focusNode: focusNodeOtp5,
// obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp5 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp6.requestFocus();
}
},
)),
),
Container(
// Sixth
margin: EdgeInsets.only(left: 5, right: 5),
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {
if (event.logicalKey ==
LogicalKeyboardKey.backspace &&
otp6 == "") {
backspaceClick = backspaceClick + 1;
if (backspaceClick >= 2) {
focusNodeOtp5.requestFocus();
}
}
},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
focusNode: focusNodeOtp6,
//obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp6 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp6.unfocus();
}
if (!otp1.isEmpty &&
!otp2.isEmpty &&
!otp3.isEmpty &&
!otp4.isEmpty &&
!otp5.isEmpty &&
!otp6.isEmpty) {
isTextFiledFocus = true;
} else {
isTextFiledFocus = false;
}
},
)),
),
/*IconButton(
onPressed: () {
setState(() {
isHideOTP = !isHideOTP;
});
},
icon:
Icon(isHideOTP ? Icons.visibility : Icons.visibility_off),
),*/
]),
),
Padding(
padding: const EdgeInsets.only(top: 32.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
child: Image.asset(
'images/Warning.png',
),
),
Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Container(
child: Text(
'OTP is valid for 5 minutes only.',
style: TextStyle(
color: Color(0xFF4B4B4B),
fontSize: 12,
fontFamily: 'Soleil_Regular',
),
),
),
),
],
),
),
Container(
child: Padding(
padding: const EdgeInsets.only(top: 22),
child: GestureDetector(
onTap: () {},
child: Container(
child: Text(
'Did not get any OTP?',
style: TextStyle(
color: Color(0xFF0072D8),
fontSize: 16,
fontFamily: 'Circular_Std_Bold',
),
),
)),
),
),
SizedBox(
width: 125,
height: 125,
),
Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.end,
children: [
Container(
decoration: new BoxDecoration(
color: Colors.blueAccent,
borderRadius: new BorderRadius.circular(10.0),
),
margin:
EdgeInsets.only(left: 16.0, right: 16.0, bottom: 16.0),
width: double.infinity,
height: 50.0,
child: FlatButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10)),
child: Text('Next ', style: TextStyle(fontSize: 16)),
onPressed: () {
FocusScopeNode currentFocus = FocusScope.of(context);
if (!currentFocus.hasPrimaryFocus) {
currentFocus.unfocus();
}
Navigator.push(
context,
new MaterialPageRoute(
builder: (context) => new sso()),
);
},
color: isTextFiledFocus
? Color(0xFF0072D8)
: Color(0xFFC2C2C1),
textColor: Colors.white,
),
),
],
),
])),
)),
);
}
}
In above code,
I need to eliminate sizebox 70 because view should be center vertical & button should be bottom aligned so size box 120 also need to eliminated. how to fix this two problem in above code.
I m new to flutter i have tried above code with basic knowledge any help improving above code is appreciated.
Any help is appreciated!
Instead of using a Row(), you should have used a Stack(), with alignment: AlignmentDirectional.center.
Try This....
class Otp extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return OtpPage();
}
}
class OtpPage extends State<Otp> {
String assetNameArrow = 'images/ic_back.svg';
String assertOtp = 'images/otp_sms.svg';
int backspaceClick = 0;
String otpError = "";
bool isHideOTP = true;
bool isTextFiledFocus = false;
String otp1 = "";
String otp2 = "";
String otp3 = "";
String otp4 = "";
String otp5 = "";
String otp6 = "";
FocusNode focusNodeOtp1 = FocusNode();
FocusNode focusNodeOtp2 = FocusNode();
FocusNode focusNodeOtp3 = FocusNode();
FocusNode focusNodeOtp4 = FocusNode();
FocusNode focusNodeOtp5 = FocusNode();
FocusNode focusNodeOtp6 = FocusNode();
#override
void initState() {
super.initState();
}
#override
void dispose() {
super.dispose();
}
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
resizeToAvoidBottomInset: false, //to avoid floating container on keyboard, use this
backgroundColor: Colors.white,
body: SingleChildScrollView(
child: SafeArea(
child: Column(children: [
Padding(
padding: const EdgeInsets.only(left: 20, top: 20, bottom: 20),
child: Align(
alignment: Alignment.topLeft,
child: SvgPicture.asset(
assetNameArrow,
width: 8,
height: 19,
alignment: Alignment.topLeft,
),
),
),
SizedBox(
width: 70.0,
height: 70.0,
),
Container(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(left: 16),
child: Align(
alignment: Alignment.topLeft,
child: SvgPicture.asset(
assertOtp,
width: 61,
height: 61,
alignment: Alignment.topLeft,
),
),
),
Expanded(
child: Padding(
padding: const EdgeInsets.only(left: 16.0, right: 16.0),
child: Container(
child: Text('We need to make\nsure its you',
maxLines: 2,
style: TextStyle(
fontFamily: 'Circular_Std_Bold',
fontSize: 24.0,
color: Color(0xFF2E2E2E),
)),
),
),
),
],
),
),
Padding(
padding: const EdgeInsets.only(left: 90.0, right: 16.0, top: 20.0),
child: Text('Please enter the OTP (One-Time Password) sent to your registered mobile number (ending in 6380). Do not share your OTP with anyone else.',
style: TextStyle(
fontFamily: 'Soleil_Regular',
fontSize: 14.0,
fontStyle: FontStyle.normal,
color: Color(0xFF2E2E2E),
)),
),
SizedBox(
width: 60.0,
height: 60.0,
),
Container(
// first
padding: EdgeInsets.all(16.0),
child: Row(children: [
Container(
margin: EdgeInsets.only(left: 16, right: 5),
//first
width: 46.0,
height: 48.0,
child: TextField(
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
textAlign: TextAlign.center,
// obscureText: isHideOTP,
enableSuggestions: false,
autocorrect: false,
autofocus: true,
focusNode: focusNodeOtp1,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp1 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp2.requestFocus();
}
},
),
),
Container(
margin: EdgeInsets.only(left: 5, right: 5),
// secound
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {
if (event.logicalKey == LogicalKeyboardKey.backspace && otp2 == "") {
backspaceClick = backspaceClick + 1;
if (backspaceClick >= 2) {
focusNodeOtp1.requestFocus();
}
}
},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
focusNode: focusNodeOtp2,
// obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp2 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp3.requestFocus();
}
},
)),
),
Container(
// Third
margin: EdgeInsets.only(left: 5, right: 5),
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {
if (event.logicalKey == LogicalKeyboardKey.backspace && otp3 == "") {
backspaceClick = backspaceClick + 1;
if (backspaceClick >= 2) {
focusNodeOtp2.requestFocus();
}
}
},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
focusNode: focusNodeOtp3,
//obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp3 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp4.requestFocus();
}
},
)),
),
Container(
margin: EdgeInsets.only(left: 5, right: 5),
// Fourth
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {
if (event.logicalKey == LogicalKeyboardKey.backspace && otp4 == "") {
backspaceClick = backspaceClick + 1;
if (backspaceClick >= 2) {
focusNodeOtp3.requestFocus();
}
}
},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
focusNode: focusNodeOtp4,
//obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp4 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp5.requestFocus();
}
},
)),
),
Container(
// Fifth
margin: EdgeInsets.only(left: 5, right: 5),
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {
if (event.logicalKey == LogicalKeyboardKey.backspace && otp5 == "") {
backspaceClick = backspaceClick + 1;
if (backspaceClick >= 2) {
focusNodeOtp4.requestFocus();
}
}
},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
focusNode: focusNodeOtp5,
// obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp5 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp6.requestFocus();
}
},
)),
),
Container(
// Sixth
margin: EdgeInsets.only(left: 5, right: 5),
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {
if (event.logicalKey == LogicalKeyboardKey.backspace && otp6 == "") {
backspaceClick = backspaceClick + 1;
if (backspaceClick >= 2) {
focusNodeOtp5.requestFocus();
}
}
},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [
LengthLimitingTextInputFormatter(1),
],
focusNode: focusNodeOtp6,
//obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp6 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp6.unfocus();
}
if (!otp1.isEmpty && !otp2.isEmpty && !otp3.isEmpty && !otp4.isEmpty && !otp5.isEmpty && !otp6.isEmpty) {
isTextFiledFocus = true;
} else {
isTextFiledFocus = false;
}
},
)),
),
/*IconButton(
onPressed: () {
setState(() {
isHideOTP = !isHideOTP;
});
},
icon:
Icon(isHideOTP ? Icons.visibility : Icons.visibility_off),
),*/
]),
),
Padding(
padding: const EdgeInsets.only(top: 32.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
child: Image.asset(
'images/Warning.png',
),
),
],
),
),
Stack(
alignment: AlignmentDirectional.center,
children: [
Column(
children: [
Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Container(
child: Text(
'OTP is valid for 5 minutes only.',
style: TextStyle(
color: Color(0xFF4B4B4B),
fontSize: 12,
fontFamily: 'Soleil_Regular',
),
),
),
),
Container(
child: Padding(
padding: const EdgeInsets.only(top: 22),
child: GestureDetector(
onTap: () {},
child: Container(
child: Text(
'Did not get any OTP?',
style: TextStyle(
color: Color(0xFF0072D8),
fontSize: 16,
fontFamily: 'Circular_Std_Bold',
),
),
)),
),
),
],
),
Container(
child: Image.asset(
'images/Warning.png',
),
),
],
),
SizedBox(
width: 125,
height: 125,
),
Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.end,
children: [
Container(
decoration: new BoxDecoration(
color: Colors.blueAccent,
borderRadius: new BorderRadius.circular(10.0),
),
margin: EdgeInsets.only(left: 16.0, right: 16.0, bottom: 16.0),
width: double.infinity,
height: 50.0,
child: FlatButton(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
child: Text('Next ', style: TextStyle(fontSize: 16)),
onPressed: () {
FocusScopeNode currentFocus = FocusScope.of(context);
if (!currentFocus.hasPrimaryFocus) {
currentFocus.unfocus();
}
// Navigator.push(
// context,
// new MaterialPageRoute(
// builder: (context) => new sso()),
// );
},
color: isTextFiledFocus ? Color(0xFF0072D8) : Color(0xFFC2C2C1),
textColor: Colors.white,
),
),
],
),
])),
)),
);
}
}
You can take help from this Article and build whatever layout you want to build.
Flutter Layout Cheatsheat
That's pretty simple use column and inside column set the property of cross-axis
to center
something like this in the parent widget
Column(
crossAxisAlignment:CrossAxisAlignment.center,
children:[
//your rest of child widget goes here
]
)
You need to use
mainAxisAlignment: MainAxisAlignment.center, by default it is MainAxisAlignment.start.
Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text("Center"),
],
),
Update
Separating MaterialApp, Better solution will be using Stack
class Otp extends StatefulWidget {
#override
State<StatefulWidget> createState() {
return OtpPage();
}
}
class OtpPage extends State<Otp> {
String assetNameArrow = 'images/ic_back.svg';
String assertOtp = 'images/otp_sms.svg';
int backspaceClick = 0;
String otpError = "";
bool isHideOTP = true;
bool isTextFiledFocus = false;
String otp1 = "";
String otp2 = "";
String otp3 = "";
String otp4 = "";
String otp5 = "";
String otp6 = "";
FocusNode focusNodeOtp1 = FocusNode();
FocusNode focusNodeOtp2 = FocusNode();
FocusNode focusNodeOtp3 = FocusNode();
FocusNode focusNodeOtp4 = FocusNode();
FocusNode focusNodeOtp5 = FocusNode();
FocusNode focusNodeOtp6 = FocusNode();
#override
void initState() {
super.initState();
}
#override
void dispose() {
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomInset:
false, //to avoid floating container on keyboard, use this
backgroundColor: Colors.white,
body: SingleChildScrollView(
child: Column(
// mainAxisAlignment: MainAxisAlignment.center,
// crossAxisAlignment: CrossAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.only(left: 20, top: 20, bottom: 20),
child: Align(
alignment: Alignment.topLeft,
child: Container(
color: Colors.deepOrange,
width: 8,
height: 19,
alignment: Alignment.topLeft,
),
),
),
SizedBox(
width: 70.0,
height: 70.0,
),
Container(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.only(left: 16),
child: Align(
alignment: Alignment.topLeft,
child: Container(
color: Colors.deepPurple,
width: 61,
height: 61,
alignment: Alignment.topLeft,
),
),
),
Expanded(
child: Padding(
padding: const EdgeInsets.only(left: 16.0, right: 16.0),
child: Container(
child: Text('We need to make\nsure its you',
maxLines: 2,
style: TextStyle(
fontFamily: 'Circular_Std_Bold',
fontSize: 24.0,
color: Color(0xFF2E2E2E),
)),
),
),
),
],
),
),
Padding(
padding:
const EdgeInsets.only(left: 90.0, right: 16.0, top: 20.0),
child: Text(
'Please enter the OTP (One-Time Password) sent to your registered mobile number (ending in 6380). Do not share your OTP with anyone else.',
style: TextStyle(
fontFamily: 'Soleil_Regular',
fontSize: 14.0,
fontStyle: FontStyle.normal,
color: Color(0xFF2E2E2E),
)),
),
SizedBox(
width: 60.0,
height: 60.0,
),
Container(
// first
padding: EdgeInsets.all(16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(
margin: EdgeInsets.only(left: 16, right: 5),
//first
width: 46.0,
height: 48.0,
child: TextField(
textAlign: TextAlign.center,
// obscureText: isHideOTP,
enableSuggestions: false,
autocorrect: false,
autofocus: true,
focusNode: focusNodeOtp1,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp1 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp2.requestFocus();
}
},
),
),
Container(
margin: EdgeInsets.only(left: 5, right: 5),
// secound
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {},
child: TextField(
textAlign: TextAlign.center,
focusNode: focusNodeOtp2,
// obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp2 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp3.requestFocus();
}
},
)),
),
Container(
// Third
margin: EdgeInsets.only(left: 5, right: 5),
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [],
focusNode: focusNodeOtp3,
//obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp3 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp4.requestFocus();
}
},
)),
),
Container(
margin: EdgeInsets.only(left: 5, right: 5),
// Fourth
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [],
focusNode: focusNodeOtp4,
//obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp4 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp5.requestFocus();
}
},
)),
),
Container(
// Fifth
margin: EdgeInsets.only(left: 5, right: 5),
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [],
focusNode: focusNodeOtp5,
// obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp5 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp6.requestFocus();
}
},
)),
),
Container(
// Sixth
margin: EdgeInsets.only(left: 5, right: 5),
width: 46.0,
height: 48.0,
child: RawKeyboardListener(
autofocus: true,
focusNode: FocusNode(),
onKey: (event) {},
child: TextField(
textAlign: TextAlign.center,
inputFormatters: [],
focusNode: focusNodeOtp6,
//obscureText: isHideOTP,
autofocus: true,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold,
color: Colors.black,
),
decoration: InputDecoration(
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide(
color: Color(0xFF0072D8), width: 1.0),
),
),
onChanged: (value) {
setState(() {
otp6 = value;
otpError = "";
});
if (value.isNotEmpty) {
print('value is not null');
focusNodeOtp6.unfocus();
}
if (!otp1.isEmpty &&
!otp2.isEmpty &&
!otp3.isEmpty &&
!otp4.isEmpty &&
!otp5.isEmpty &&
!otp6.isEmpty) {
isTextFiledFocus = true;
} else {
isTextFiledFocus = false;
}
},
)),
),
/*IconButton(
onPressed: () {
setState(() {
isHideOTP = !isHideOTP;
});
},
icon:
Icon(isHideOTP ? Icons.visibility : Icons.visibility_off),
),*/
]),
),
Padding(
padding: const EdgeInsets.only(top: 32.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
width: 24,
height: 24,
color: Colors.green,
// child: Image.asset(
// 'images/Warning.png',
// ),
),
Padding(
padding: const EdgeInsets.only(left: 8.0),
child: Container(
child: Text(
'OTP is valid for 5 minutes only.',
style: TextStyle(
color: Color(0xFF4B4B4B),
fontSize: 12,
fontFamily: 'Soleil_Regular',
),
),
),
),
],
),
),
Container(
child: Padding(
padding: const EdgeInsets.only(top: 22),
child: GestureDetector(
onTap: () {},
child: Container(
child: Text(
'Did not get any OTP?',
style: TextStyle(
color: Color(0xFF0072D8),
fontSize: 16,
fontFamily: 'Circular_Std_Bold',
),
),
)),
),
),
SizedBox(
width: 125,
height: 125,
),
],
),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
floatingActionButton: Container(
decoration: BoxDecoration(
color: Colors.blueAccent,
borderRadius: BorderRadius.circular(10.0),
),
margin: EdgeInsets.only(left: 16.0, right: 16.0, bottom: 16.0),
width: double.infinity,
height: 50.0,
child: FlatButton(
shape:
RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
child: Text('Next ', style: TextStyle(fontSize: 16)),
onPressed: () {
FocusScopeNode currentFocus = FocusScope.of(context);
if (!currentFocus.hasPrimaryFocus) {
currentFocus.unfocus();
}
},
color: isTextFiledFocus ? Color(0xFF0072D8) : Color(0xFFC2C2C1),
textColor: Colors.white,
),
),
);
}
}
class Landing extends StatefulWidget {
Landing({Key? key}) : super(key: key);
#override
_LandingState createState() => _LandingState();
}
class _LandingState extends State<Landing> with SingleTickerProviderStateMixin {
final List<Widget> pages = [
Home(),
// Signin(),
Center(
child: Text("SignIn"),
)
];
late TabController _tabbarcontroller;
int _currentIndexNavBar = 0;
#override
void initState() {
super.initState();
_tabbarcontroller = new TabController(length: pages.length, vsync: this);
}
#override
void dispose() {
_tabbarcontroller.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: TabBarView(
controller: _tabbarcontroller,
children: pages,
),
),
bottomNavigationBar: BottomNavigationBar(
items: [
BottomNavigationBarItem(
label: "A",
icon: Icon(
Icons.ac_unit,
),
),
BottomNavigationBarItem(
label: "B",
icon: Icon(
Icons.face,
),
),
],
currentIndex: _currentIndexNavBar,
onTap: (value) {
setState(() {
_tabbarcontroller.index = value;
_currentIndexNavBar = value;
});
},
));
}
}
class Parent extends StatefulWidget {
Parent({Key? key}) : super(key: key);
#override
_ParentState createState() => _ParentState();
}
class _ParentState extends State<Parent> {
#override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Container(
height: 100,
width: 100,
color: Colors.red,
),
Expanded(
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Home(),
]),
))
]);
}
}

How to add validation in dynamic textformfield

I want to add validation in dynamic textformfield....i have added validation as per my knowledge but its not working properly.....when i created 4-5 textformfield and erase data from previous field its doesn't show any error when i click on submit button......validation is working properly only for currrent textformfield .....its not working properly for previous textformfield ....how can i slove it???
class PurchaseTicket extends StatefulWidget {
#override
int eventID;
PurchaseTicket(this.eventID);
_PurchaseTicketState createState() => _PurchaseTicketState();
}
class _PurchaseTicketState extends State<PurchaseTicket> {
// List<GlobalKey<FormState>> _formKeys = [GlobalKey<FormState>()];
//final _formKey = GlobalKey<FormState>();
List<TextEditingController> _controllers = new List();
List<TextEditingController> _controllers1 = new List();
List<FocusNode> _FocusNode1 = new List();
List<FocusNode> _FocusNode2 = new List();
FocusNode myFocusNode1 = new FocusNode();
FocusNode myFocusNode2 = new FocusNode();
TextEditingController mobileController = TextEditingController();
TextEditingController nameController = TextEditingController();
ScrollController controller = ScrollController();
var _count = 0;
List<Map<String, dynamic>> _values;
_register(BuildContext context) async {
bool validname;
bool validmobile;
for (var i = 0; i <= _controllers.length - 1; i++) {
print(_controllers[i].text.runtimeType);
if (_controllers[i].text.trim() == "" || _controllers[i].text == null) {
validname = false;
} else {
validname = true;
}
}
for (var i = 0; i <= _controllers1.length - 1; i++) {
if (_controllers1[i].text.trim() == '') {
validmobile = false;
} else {
validmobile = true;
}
}
if (nameController.text.trim() == '' || nameController.text.length < 1) {
showToast('Please Enter Name', context: context);
} else if (mobileController.text.trim() == '' ||
mobileController.text.length < 10) {
showToast('Enter Valid Mobile Number', context: context);
} else if (validname == false) {
showToast('Please Enter Name', context: context);
} else if (validmobile == false) {
showToast('Enter Valid Mobile Number', context: context);
} else {
print(
"$validmobile $validname ${nameController.text} ${mobileController.text}");
participateRegister(nameController.text, mobileController.text,
_controllers, _controllers1, widget.eventID, context);
}
}
// else if (mobileController.text.isNotEmpty &&
// nameController.text.isNotEmpty) {
// for (int i = 0; i < _controllers.length; i++) {
// if (validmobile = false) {
// showToast('Please Enter Name', context: context);
// }
// }
// } else if (mobileController.text.isNotEmpty &&
// nameController.text.isNotEmpty) {
// for (int i = 0; i < _controllers1.length; i++) {
// if (validmobile == false) {
// showToast('Enter Valid Mobile Number', context: context);
// }
// }
// }
// }
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Color(0xFFfbf0d4),
body: SingleChildScrollView(
child: Stack(children: [
Container(
height: MediaQuery.of(context).size.height * .50,
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
image: DecorationImage(
//image: NetworkImage(widget.eventData.splitImage[0]),
image: ExactAssetImage("assets/images/Group 4.png"),
fit: BoxFit.cover,
),
),
),
Container(
margin: EdgeInsets.only(
top: MediaQuery.of(context).size.height * 0.29,
),
height: MediaQuery.of(context).size.height * .7,
width: MediaQuery.of(context).size.width,
decoration: new BoxDecoration(
image: new DecorationImage(
image: ExactAssetImage("assets/images/body shape.png"),
fit: BoxFit.fill,
),
),
),
Container(
margin: EdgeInsets.only(
top: MediaQuery.of(context).size.height * 0.03,
),
child: InkWell(
child: new IconButton(
icon: new Icon(
Icons.arrow_back,
size: 20,
),
color: Colors.white,
onPressed: () => {Navigator.pop(context)}),
),
),
Padding(
padding: const EdgeInsets.only(
left: 30,
right: 30,
),
child: Container(
margin: EdgeInsets.only(
top: MediaQuery.of(context).size.width * .5),
child: Column(
children: [
Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20.0),
),
elevation: 10,
child: Container(
//color: Colors.white,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.all(Radius.circular(
20.0) // <--- border radius here
),
),
child: Column(
children: [
SizedBox(
//height: 10,
),
Center(
child: Container(
width: MediaQuery.of(context).size.width * .71,
height:
MediaQuery.of(context).size.height * .085,
child: new TextFormField(
controller: nameController,
focusNode: myFocusNode1,
style: TextStyle(
height: 1.5,
fontWeight: FontWeight.w500,
color: const Color(0xFFa5a5a5),
fontSize: 12),
cursorColor: const Color(0xFFa5a5a5),
keyboardType: TextInputType.text,
decoration: InputDecoration(
fillColor: Colors.white,
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: const Color(0xFFa5a5a5))),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0xFFa5a5a5)),
),
border: UnderlineInputBorder(),
labelText: 'Name',
labelStyle: TextStyle(
fontSize: 11,
fontWeight: FontWeight.w500,
color: myFocusNode1.hasFocus
? const Color(0xFFa5a5a5)
: const Color(0xFFa5a5a5))),
),
),
),
SizedBox(
// height: MediaQuery.of(context).size.height * .013,
),
Container(
width: MediaQuery.of(context).size.width * .71,
height: MediaQuery.of(context).size.height * .085,
child: new TextFormField(
maxLength: 10,
controller: mobileController,
focusNode: myFocusNode2,
style: TextStyle(
height: 1.5,
fontWeight: FontWeight.w500,
color: const Color(0xFFa5a5a5),
fontSize: 12),
cursorColor: const Color(0xFFa5a5a5),
keyboardType: TextInputType.number,
decoration: InputDecoration(
counterText: '',
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: const Color(0xFFa5a5a5))),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: const Color(0xFFa5a5a5)),
),
fillColor: Colors.white,
border: UnderlineInputBorder(),
labelText: 'Mobile No',
labelStyle: TextStyle(
fontSize: 11,
fontWeight: FontWeight.w500,
color: myFocusNode2.hasFocus
? const Color(0xFFa5a5a5)
: const Color(0xFFa5a5a5))),
validator: (value) {
if (value.length < 10 && value.isEmpty) {
return "Atleast 10 digit required";
}
return null;
},
),
),
SizedBox(
height: 10,
),
],
),
),
),
ListView.builder(
physics: const BouncingScrollPhysics(),
shrinkWrap: true,
itemCount: _count,
itemBuilder: (context, index) {
print(index);
return _row(index);
},
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
FloatingActionButton(
child: Icon(
Icons.add,
color: Colors.red,
size: 35,
),
backgroundColor: Color(0xFF9a7210),
onPressed: () async {
_controllers.add(new TextEditingController());
_controllers1.add(new TextEditingController());
_FocusNode1.add(new FocusNode());
_FocusNode2.add(new FocusNode());
// _formKeys.add(new GlobalKey<FormState>());
setState(() {
_count++;
});
},
),
],
),
SizedBox(
height: 20,
),
Center(
child: GestureDetector(
onTap: () {
_register(context);
},
child: Container(
height: 70,
width: 260,
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.centerLeft,
end: Alignment.centerRight,
colors: [
const Color(0xFFb48919),
const Color(0xFF9a7210),
],
),
border: Border.all(color: Colors.white, width: 4),
borderRadius: BorderRadius.all(Radius.circular(
70.0) // <--- border radius here
),
),
child: Center(
child: Text("Submit",
style: TextStyle(
fontWeight: FontWeight.bold,
letterSpacing: 1,
fontSize: 30,
color: Colors.white)),
),
),
),
),
SizedBox(
height: 30,
)
],
),
),
),
]),
));
}
_row(int index) {
return Column(
children: [
Row(
children: [
Expanded(
child: Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20.0),
),
elevation: 10,
child: Container(
//color: Colors.white,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.all(Radius.circular(
20.0) // <--- border radius here
),
),
child: Column(
children: [
SizedBox(
// height: 10,
),
Center(
child: Container(
width: MediaQuery.of(context).size.width * .71,
height: MediaQuery.of(context).size.height * .085,
child: new TextFormField(
autofocus: false,
controller: _controllers[index],
focusNode: _FocusNode1[index],
style: TextStyle(
height: 1.5,
fontWeight: FontWeight.w500,
color: const Color(0xFFa5a5a5),
fontSize: 12),
cursorColor: const Color(0xFFa5a5a5),
keyboardType: TextInputType.text,
decoration: InputDecoration(
fillColor: Colors.white,
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: const Color(0xFFa5a5a5))),
focusedBorder: UnderlineInputBorder(
borderSide:
BorderSide(color: Color(0xFFa5a5a5)),
),
border: UnderlineInputBorder(),
labelText: 'Name',
labelStyle: TextStyle(
fontSize: 11,
fontWeight: FontWeight.w500,
color: _FocusNode1[index].hasFocus
? const Color(0xFFa5a5a5)
: const Color(0xFFa5a5a5))),
),
),
),
SizedBox(
//height: MediaQuery.of(context).size.height * .013,
),
Container(
width: MediaQuery.of(context).size.width * .71,
height: MediaQuery.of(context).size.height * .085,
child: new TextFormField(
maxLength: 10,
autofocus: false,
controller: _controllers1[index],
focusNode: _FocusNode2[index],
style: TextStyle(
height: 1.5,
fontWeight: FontWeight.w500,
color: const Color(0xFFa5a5a5),
fontSize: 12),
cursorColor: const Color(0xFFa5a5a5),
keyboardType: TextInputType.number,
decoration: InputDecoration(
counterText: '',
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: const Color(0xFFa5a5a5))),
focusedBorder: UnderlineInputBorder(
borderSide:
BorderSide(color: const Color(0xFFa5a5a5)),
),
fillColor: Colors.white,
border: UnderlineInputBorder(),
labelText: 'Mobile No',
labelStyle: TextStyle(
fontSize: 11,
fontWeight: FontWeight.w500,
color: _FocusNode2[index].hasFocus
? const Color(0xFFa5a5a5)
: const Color(0xFFa5a5a5))),
),
),
SizedBox(
height: 10,
),
],
),
),
),
),
],
),
SizedBox(
height: 30,
)
],
);
}
}
Use Form , Here is the Example For you:
class MyApp extends StatefulWidget {
#override
State<StatefulWidget> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
GlobalKey<FormState> formKey = new GlobalKey();
String formFieldValue;
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: Form(
key: formKey,
child: Column(
children: [
TextFormField(
validator: (input) {
if (input.isEmpty) {
return 'Please type something';
}
return null;
},
onSaved: (input) => formFieldValue = input,
),
RaisedButton(
onPressed: submitForm,
child: Text(
'Submit'
),
)
],
),
)
);
}
submitForm() {
final formState = formKey.currentState;
if (formState.validate()) {
formState.save();
// then do something
}
}
}
Please follow below tutorial which Flutter team suggest to use for validation.
You can just put all text fields in a form and validate the all fields anytime.
https://flutter.dev/docs/cookbook/forms/validation

Flutter TextField hide by Keyboard

I'm a beginner in the flutter, I have a conflict, when I'm focusing on a TexFiled, the keyboard hidden over the TextField, and bottom button not showing i attached my conflict here
any solution for this
Thanks
code here
import 'dart:ui';
import 'package:crapp/pages/create_password/password_screen.dart';
import 'package:crapp/widgets/components/alert.dart';
import 'package:crapp/widgets/components/page_animation.dart';
import 'package:crapp/widgets/theme/constants.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:crapp/provider/theme_provider.dart';
class PasswordScreen extends StatefulWidget {
#override
_PasswordScreenState createState() => _PasswordScreenState();
}
class _PasswordScreenState extends State< PasswordScreen > {
final _controller = TextEditingController();
//validation controller
TextEditingController sQuastionController = new TextEditingController();
TextEditingController answerQController = new TextEditingController();
TextEditingController passController = new TextEditingController();
TextEditingController conPassController = new TextEditingController();
final TextEditingController _pass = TextEditingController();
final TextEditingController _confirmPass = TextEditingController();
bool _isButtonEnabled = false;
//final _controller = TextEditingController();
bool isConfirm=false;
check (BuildContext context){
if(sQuastionController.text.isNotEmpty &&
answerQController.text.isNotEmpty &&
conPassController.text.isNotEmpty &&
passController.text.isNotEmpty){
setState(() {
_isButtonEnabled = true;
});
} else {
setState(() {
_isButtonEnabled = false;
});
}
}
checks (BuildContext context){
if(passController.text.isEmpty){
showDialog<void>(
context: context,
builder: (BuildContext dialogContext) {
return Alert(title: "Alert !!!",subTile: "Password must be 10 characters !",);
}
);
}else if(passController.text.length > 0 && passController.text.length < 10){
isConfirm = true;
showDialog<void>(
context: context,
builder: (BuildContext dialogContext) {
return Alert(title: "Alert !!!",subTile: "Password doesn't match !",);
}
);
}
}
checkChanged(){
if( secretVal != null
)
{
setState(() {
isSave = true;
});
}else{
isSave =false;
}
} bool isSave=false;
final GlobalKey<FormState> formKey = GlobalKey<FormState>();
#override
Widget build(BuildContext context) {
/* double height = MediaQuery.of(context).size.height;
double width = MediaQuery.of(context).size.width;*/
Provider.of<ThemeProvider>(context).themeMode == ThemeMode.dark
? 'DarkTheme'
: 'LightTheme';
return Scaffold(
resizeToAvoidBottomInset: false,
body: SafeArea(
child: Column(
children: <Widget>[
Expanded(
child: _signUp(),
),
],
),
), bottomNavigationBar: BottomAppBar(
elevation: 4,
child: Container(
height: 70,
child: Container(
padding: EdgeInsets.symmetric(horizontal: 16),
child: Row(
children: [
Expanded(
child: MaterialButton(
height: 44,
onPressed: () {
FocusScope.of(context).requestFocus(FocusNode());
//check();
},
shape: RoundedRectangleBorder(
borderRadius:
BorderRadius.circular(4)),
color: Color(0xFF2A3476),
elevation: 0,
highlightElevation: 0,
child: Container(
child: Text(
"Save",
style: TextStyle(
color: Color(0xFF2A3476),
fontSize: 15,
fontFamily: 'medium'),
),
),
),
),
],
),
),
),
),
/* bottomNavigationBar: Container(
padding: EdgeInsets.all(25.0),
decoration: BoxDecoration(color: Colors.white,
),
child: Row(
children: [
Expanded(
child: MaterialButton(
height: 44,
onPressed: () {
FocusScope.of(context).requestFocus(FocusNode());
*//* Navigator.push(context, SlidePageRoute(page:PasswordScreen()));*//*
},
shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(8.0))),
color: _isButtonEnabled ? Color(0xFF2A3476) : Color(0x201E1E99),
elevation: 0,
highlightElevation: 0,
child: Container(
child: Text(
"Next",
style: TextStyle(color: m_fillColor,fontSize: 18,fontWeight: FontWeight.w600 ,
fontFamily: "regular",),
),
),
),
),
],
),
)*/
);
}
Widget _signUp() {
return Container(
constraints: BoxConstraints.expand(
height: MediaQuery.of(context).size.height,
width: MediaQuery.of(context).size.width,
),
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
Color(0xFF2A3476),
Color(0xFF2A3476),
],
begin: Alignment.topLeft,
end: Alignment.centerRight,
),
),
child: Form(
key: formKey,
child: Container(
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding:
const EdgeInsets.symmetric(vertical: 36.0, horizontal: 24.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Create Password",
style: TextStyle(
color: Colors.white,
fontSize: 30.0,fontFamily: "medium",
fontWeight: FontWeight.w800,
),
),
],
),
),
Container(
width: double.infinity,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(30),
topRight: Radius.circular(30),
),
),
child: Padding(
padding: const EdgeInsets.all(24.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Steps to set your",
style: TextStyle(
fontSize: 22,
fontFamily: "regular",
fontWeight: FontWeight.w300,
color: Colors.black,
),
),
Text(
"password",
style: TextStyle(
fontSize: 22,
fontFamily: "regular",
fontWeight: FontWeight.w300,
color: Colors.black,
),
),
SizedBox(
height: 20.0,
), Text(
'Secret Question',
style:
TextStyle( fontSize: 15,
fontFamily: "regular",),
), SizedBox(
height: 8.0,
),
Row(
children: [
Expanded(child: InkWell(
onTap: (){
FocusScope.of(context).requestFocus(FocusNode());
secretDialogue();
},
child: Stack(
children: <Widget>[
TextField(
/* textInputAction: TextInputAction.next,*/
controller: sQuastionController,
enabled: false,
onChanged: (val) {
check(context);
},
decoration: InputDecoration(
labelText: secretVal==null?"Select One":secretVal,
contentPadding: EdgeInsets.all(8),
border: OutlineInputBorder(
borderRadius:
BorderRadius.circular(8.0),
borderSide: BorderSide.none,
),
filled: true,
fillColor: Color(0xFFE1E8F7),
hintText: "",
/* prefixIcon: Icon(
Icons.people_outline_rounded,
color: Colors.grey[600],
)*/
),
),
Positioned.directional(
textDirection: Directionality.of(context),
end: 0,
top: 0,
bottom: 0,
child: Padding(
padding: const EdgeInsets.all(8.0),
child:Image.asset(
"assets/icons/ic_drop_arrow.png",
scale: 9,
)),
)
],
),
),
),
],
),
SizedBox(
height: 20.0,
),
Text(
'Answer',
style:
TextStyle( fontSize: 15,
fontFamily: "regular",),
),
SizedBox(
height: 8.0,
),
TextField(
/* keyboardType: TextInputType.emailAddress,*/
/* textInputAction: TextInputAction.next,*/
controller: answerQController,
onChanged: (val){
check(context);
},
decoration: InputDecoration(
contentPadding: EdgeInsets.all(8),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide.none,
),
filled: true,
fillColor: Color(0xFFE1E8F7),
hintText: "",
/*prefixIcon: Icon(
Icons.people_outline_rounded,
color: Color(0xFFE1E8F7),
)*/),
),
SizedBox(
height: 20.0,
),
Text(
'Password',
style:
TextStyle( fontSize: 15,
fontFamily: "regular",),
),
SizedBox(
height: 8.0,
),
TextFormField(
/* keyboardType: TextInputType.emailAddress,*/
/* textInputAction: TextInputAction.next,*/
controller: passController,
onChanged: (val){
check(context);
},
//password validation
/* validator: (val){
if(val!.isEmpty)
return 'Empty';
return null;
},*/
decoration: InputDecoration(
contentPadding: EdgeInsets.all(8),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide.none,
),
filled: true,
fillColor: Color(0xFFE1E8F7),
hintText: "************",
),
),
SizedBox(
height: 20.0,
),
Text(
'Confirm Password',
style:
TextStyle( fontSize: 15,
fontFamily: "regular",),
),
SizedBox(
height: 8.0,
),
TextFormField(
textInputAction: TextInputAction.done,
controller: conPassController,
onChanged: (val){
check(context);
},
//password validation
/* validator: (val){
if(val!.isEmpty)
return 'Empty';
if(val != _pass.text)
return 'Not Match';
return null;
},*/
decoration: InputDecoration(
contentPadding: EdgeInsets.all(8),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide.none,
),
filled: true,
fillColor: Color(0xFFE1E8F7),
hintText: "************",
),
),
SizedBox(
height: 20.0,
),
SizedBox(
height: 8.0,
),
SizedBox(
height:200.0,
),
],
),
),
),
],
),
),
),
),
);
}
//
//Secret Qu Alert
List secretList =[
"-What’s your favorite team?",
"-What’s your astrological sign?",
"-What’s your favorite movie?",
"-What city were you born in?",
"-What was your first car?",
];
var secretVal;
void secretDialogue(){
showDialog<void>(
context: context,
// false = user must tap button, true = tap outside dialog
builder: (BuildContext dialogContext) {
return StatefulBuilder(
builder: (context,setState){
return Dialog(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
insetPadding: EdgeInsets.all(20),
child: Container(
padding: EdgeInsets.symmetric(vertical: 10),
child: Column(
mainAxisSize: MainAxisSize.min,
children: List.generate(secretList.length, (index){
return InkWell(
onTap: (){
setState(() {
secretVal = secretList[index];
Navigator.pop(context);
});
},
child: Container(
height: 50,
padding: EdgeInsets.symmetric(horizontal: 20),
alignment: Alignment.centerLeft,
child: Text(secretList[index],
style: TextStyle(
fontSize: 18,
fontFamily: "medium",
),),
),
);
})
),
),
);
}
);
},
);
}
}
Wrap your Column by SingleChildScrollView. It will solve your problem.
like this..
body: SafeArea(
child: SingleChildScrollView(
child: Column(
Also I think after this there is no need of
resizeToAvoidBottomInset: false,
in Scaffold.
Please check out and I have found some inconsistency in code, refactored some of them
import 'dart:ui';
import 'package:crapp/pages/create_password/password_screen.dart';
import 'package:crapp/widgets/components/alert.dart';
import 'package:crapp/widgets/components/page_animation.dart';
import 'package:crapp/widgets/theme/constants.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:crapp/provider/theme_provider.dart';
class PasswordScreen extends StatefulWidget {
#override
_PasswordScreenState createState() => _PasswordScreenState();
}
class _PasswordScreenState extends State< PasswordScreen > {
final _controller = TextEditingController();
//validation controller
TextEditingController sQuastionController = new TextEditingController();
TextEditingController answerQController = new TextEditingController();
TextEditingController passController = new TextEditingController();
TextEditingController conPassController = new TextEditingController();
final TextEditingController _pass = TextEditingController();
final TextEditingController _confirmPass = TextEditingController();
bool _isButtonEnabled = false;
//final _controller = TextEditingController();
bool isConfirm = false;
check(BuildContext context) {
if (sQuastionController.text.isNotEmpty &&
answerQController.text.isNotEmpty &&
conPassController.text.isNotEmpty &&
passController.text.isNotEmpty) {
setState(() {
_isButtonEnabled = true;
});
} else {
setState(() {
_isButtonEnabled = false;
});
}
}
void initState() {
SystemChannels.textInput.invokeMethod('TextInput.hide');
super.initState();
}
checks (BuildContext context){
if(passController.text.isEmpty){
showDialog<void>(
context: context,
builder: (BuildContext dialogContext) {
return Alert(title: "Alert !!!",subTile: "Password must be 10 characters !",);
}
);
}else if(passController.text.length > 0 && passController.text.length < 10){
isConfirm = true;
showDialog<void>(
context: context,
builder: (BuildContext dialogContext) {
return Alert(title: "Alert !!!",subTile: "Password doesn't match !",);
}
);
}
}
checkChanged() {
if (secretVal != null) {
setState(() {
isSave = true;
});
} else {
isSave = false;
}
}
bool isSave = false;
final GlobalKey<FormState> formKey = GlobalKey<FormState>();
#override
Widget build(BuildContext context) {
/* double height = MediaQuery.of(context).size.height;
double width = MediaQuery.of(context).size.width;*/
Provider.of<ThemeProvider>(context).themeMode == ThemeMode.dark
? 'DarkTheme'
: 'LightTheme';
return Scaffold(
// resizeToAvoidBottomInset: false,
body: _signUp(),
bottomNavigationBar: BottomAppBar(
elevation: 4,
child: Container(
height: 70,
child: Container(
padding: EdgeInsets.symmetric(horizontal: 16),
child: Row(
children: [
Expanded(
child: MaterialButton(
height: 44,
onPressed: () {
FocusScope.of(context).requestFocus(FocusNode());
//check();
},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(4)),
color: Color(0xFF2A3476),
elevation: 0,
highlightElevation: 0,
child: Container(
child: Text(
"Save",
style: TextStyle(
color: Color(0xFF2A3476),
fontSize: 15,
fontFamily: 'medium'),
),
),
),
),
],
),
),
),
),
/* bottomNavigationBar: Container(
padding: EdgeInsets.all(25.0),
decoration: BoxDecoration(color: Colors.white,
),
child: Row(
children: [
Expanded(
child: MaterialButton(
height: 44,
onPressed: () {
FocusScope.of(context).requestFocus(FocusNode());
*/ /* Navigator.push(context, SlidePageRoute(page:PasswordScreen()));*/ /*
},
shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(8.0))),
color: _isButtonEnabled ? Color(0xFF2A3476) : Color(0x201E1E99),
elevation: 0,
highlightElevation: 0,
child: Container(
child: Text(
"Next",
style: TextStyle(color: m_fillColor,fontSize: 18,fontWeight: FontWeight.w600 ,
fontFamily: "regular",),
),
),
),
),
],
),
)*/
);
}
Widget _signUp() {
return Container(
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
Color(0xFF2A3476),
Color(0xFF2A3476),
],
begin: Alignment.topLeft,
end: Alignment.centerRight,
),
),
child: SingleChildScrollView(
child: Form(
key: formKey,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.symmetric(
vertical: 36.0, horizontal: 24.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Create Password",
style: TextStyle(
color: Colors.white,
fontSize: 30.0,
fontFamily: "medium",
fontWeight: FontWeight.w800,
),
),
],
),
),
Container(
width: double.infinity,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.only(
topLeft: Radius.circular(30),
topRight: Radius.circular(30),
),
),
child: Padding(
padding: const EdgeInsets.all(24.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Steps to set your",
style: TextStyle(
fontSize: 22,
fontFamily: "regular",
fontWeight: FontWeight.w300,
color: Colors.black,
),
),
Text(
"password",
style: TextStyle(
fontSize: 22,
fontFamily: "regular",
fontWeight: FontWeight.w300,
color: Colors.black,
),
),
SizedBox(
height: 20.0,
),
Text(
'Secret Question',
style: TextStyle(
fontSize: 15,
fontFamily: "regular",
),
),
SizedBox(
height: 8.0,
),
Row(
children: [
Expanded(
child: InkWell(
onTap: () {
FocusScope.of(context)
.requestFocus(FocusNode());
secretDialogue();
},
child: Stack(
children: <Widget>[
TextField(
/* textInputAction: TextInputAction.next,*/
controller: sQuastionController,
enabled: false,
onChanged: (val) {
check(context);
},
decoration: InputDecoration(
labelText: secretVal == null
? "Select One"
: secretVal,
contentPadding: EdgeInsets.all(8),
border: OutlineInputBorder(
borderRadius:
BorderRadius.circular(8.0),
borderSide: BorderSide.none,
),
filled: true,
fillColor: Color(0xFFE1E8F7),
hintText: "",
/* prefixIcon: Icon(
Icons.people_outline_rounded,
color: Colors.grey[600],
)*/
),
),
Positioned.directional(
textDirection: Directionality.of(context),
end: 0,
top: 0,
bottom: 0,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Image.asset(
"assets/icons/ic_drop_arrow.png",
scale: 9,
)),
)
],
),
),
),
],
),
SizedBox(
height: 20.0,
),
Text(
'Answer',
style: TextStyle(
fontSize: 15,
fontFamily: "regular",
),
),
SizedBox(
height: 8.0,
),
GestureDetector(
onTap: () {
FocusScope.of(context).requestFocus(new FocusNode());
},
child: TextField(
/* keyboardType: TextInputType.emailAddress,*/
/* textInputAction: TextInputAction.next,*/
controller: answerQController,
onChanged: (val) {
check(context);
},
decoration: InputDecoration(
contentPadding: EdgeInsets.all(8),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide.none,
),
filled: true,
fillColor: Color(0xFFE1E8F7),
hintText: "",
/*prefixIcon: Icon(
Icons.people_outline_rounded,
color: Color(0xFFE1E8F7),
)*/
),
),
),
SizedBox(
height: 20.0,
),
Text(
'Password',
style: TextStyle(
fontSize: 15,
fontFamily: "regular",
),
),
SizedBox(
height: 8.0,
),
GestureDetector(
onTap: () {
FocusScope.of(context).requestFocus(new FocusNode());
},
child: TextFormField(
/* keyboardType: TextInputType.emailAddress,*/
/* textInputAction: TextInputAction.next,*/
controller: passController,
onChanged: (val) {
check(context);
},
//password validation
/* validator: (val){
if(val!.isEmpty)
return 'Empty';
return null;
},*/
decoration: InputDecoration(
contentPadding: EdgeInsets.all(8),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide.none,
),
filled: true,
fillColor: Color(0xFFE1E8F7),
hintText: "************",
),
),
),
SizedBox(
height: 20.0,
),
Text(
'Confirm Password',
style: TextStyle(
fontSize: 15,
fontFamily: "regular",
),
),
SizedBox(
height: 8.0,
),
GestureDetector(
onTap: () {
FocusScope.of(context).requestFocus(new FocusNode());
},
child: TextFormField(
textInputAction: TextInputAction.done,
controller: conPassController,
onChanged: (val) {
check(context);
},
//password validation
/* validator: (val){
if(val!.isEmpty)
return 'Empty';
if(val != _pass.text)
return 'Not Match';
return null;
},*/
decoration: InputDecoration(
contentPadding: EdgeInsets.all(8),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8.0),
borderSide: BorderSide.none,
),
filled: true,
fillColor: Color(0xFFE1E8F7),
hintText: "************",
),
),
),
SizedBox(
height: 20.0,
),
SizedBox(
height: 8.0,
),
SizedBox(
height: 200.0,
),
],
),
),
),
],
),
),
),
);
}
//
//Secret Qu Alert
List secretList = [
"-What’s your favorite team?",
"-What’s your astrological sign?",
"-What’s your favorite movie?",
"-What city were you born in?",
"-What was your first car?",
];
var secretVal;
void secretDialogue() {
showDialog<void>(
context: context,
// false = user must tap button, true = tap outside dialog
builder: (BuildContext dialogContext) {
return StatefulBuilder(builder: (context, setState) {
return Dialog(
shape:
RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
insetPadding: EdgeInsets.all(20),
child: Container(
padding: EdgeInsets.symmetric(vertical: 10),
child: Column(
mainAxisSize: MainAxisSize.min,
children: List.generate(secretList.length, (index) {
return InkWell(
onTap: () {
setState(() {
secretVal = secretList[index];
Navigator.pop(context);
});
},
child: Container(
height: 50,
padding: EdgeInsets.symmetric(horizontal: 20),
alignment: Alignment.centerLeft,
child: Text(
secretList[index],
style: TextStyle(
fontSize: 18,
fontFamily: "medium",
),
),
),
);
})),
),
);
});
},
);
}
}

updating the text in the controller not working after converting the class from stateless to stateful

the code works fine when it's statelesswidget but after converting it to statefulwidget the textformfiled
stopped showing the text value from firestore.
when entering data the filed works just fine and the value stored in the firebase but when editing the the data the filed not showing the value to be edited and when entering the data in the filed new record is being stored in the firebase
class PostView extends StatefulWidget {
PostView({Key key, this.edittingPost}) : super(key: key);
final Post edittingPost;
#override
State<StatefulWidget> createState() {
return CreatePostView();
}
}
class CreatePostView extends State<PostView>{
final airlineController = TextEditingController();
final paxController = TextEditingController();
final infantController = TextEditingController();
final transitController = TextEditingController();
final dateController = TextEditingController();
Post edittingPost;
#override
Widget build(BuildContext context) {
return ViewModelBuilder<CreatePostViewModel>.reactive(
viewModelBuilder: () => CreatePostViewModel(),
onModelReady: (model) {
// update the text in the controller
airlineController.text = edittingPost?.airline ?? '';
paxController.text = edittingPost?.pax ?? '';
infantController.text = edittingPost?.infant ?? '';
transitController.text = edittingPost?.transit ?? '';
dateController.text = edittingPost?.date ?? '';
model.setEdittingPost(edittingPost);
},
builder: (context, model, child) => Scaffold(
floatingActionButton: FloatingActionButton(
child: !model.busy
? Icon(Icons.add)
: CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation(Colors.white),
),
onPressed: () {
if (!model.busy) {
model.addPost(date: dateController.text, airline: airlineController.text, pax: paxController.text,
infant: infantController.text, transit: transitController.text);
}
},
backgroundColor:
!model.busy ? Theme.of(context).primaryColor : Colors.grey[600],
),
body: SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 30.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
verticalSpace(40),
Text(
'Create Post',
style: TextStyle(fontSize: 26),
),
verticalSpaceMedium,
Container(
alignment: Alignment.centerLeft,
decoration: kBoxDecorationStyle,
height: 55.0,
child: TextFormField(
style: TextStyle(
color: Colors.white,
fontFamily: 'OpenSans',
),
decoration: InputDecoration(
border: InputBorder.none,
contentPadding:
EdgeInsets.only(top: 14.0),
prefixIcon: Icon(
Icons.calendar_today,
color: Colors.white,
),
hintText: 'Date of Flight',
hintStyle: kHintTextStyle),
controller: dateController,
onTap: () async{
DateTime date = DateTime(1900);
FocusScope.of(context).requestFocus(FocusNode());
date = await showDatePicker(
context: context,
initialDate:DateTime.now(),
firstDate:DateTime(1900),
lastDate: DateTime(2100));
dateController.text = date.toIso8601String();},),
),
verticalSpaceMedium,
Container(
alignment: Alignment.centerLeft,
decoration: kBoxDecorationStyle,
height: 55.0,
child: TextFormField(
style: TextStyle(
color: Colors.white,
fontFamily: 'OpenSans',
),
decoration: InputDecoration(
border: InputBorder.none,
contentPadding:
EdgeInsets.only(top: 14.0),
prefixIcon: Icon(
Icons.airplanemode_active,
color: Colors.white,
),
hintText: 'Airline',
hintStyle: kHintTextStyle,
),
controller: airlineController,
)),
verticalSpaceMedium,
Container(
alignment: Alignment.centerLeft,
decoration: kBoxDecorationStyle,
height: 55.0,
child: TextFormField(
keyboardType: TextInputType.number,
style: TextStyle(
color: Colors.white,
fontFamily: 'OpenSans',
),
decoration: InputDecoration(
border: InputBorder.none,
contentPadding:
EdgeInsets.only(top: 14.0),
prefixIcon: Icon(
Icons.airline_seat_recline_extra,
color: Colors.white,
),
hintText: 'Pax',
hintStyle: kHintTextStyle,
),
controller: paxController,
)),
verticalSpaceMedium,
Container(
alignment: Alignment.centerLeft,
decoration: kBoxDecorationStyle,
height: 55.0,
child: TextFormField(
keyboardType: TextInputType.number,
style: TextStyle(
color: Colors.white,
fontFamily: 'OpenSans',
),
decoration: InputDecoration(
border: InputBorder.none,
contentPadding:
EdgeInsets.only(top: 14.0),
prefixIcon: Icon(
Icons.child_friendly,
color: Colors.white,
),
hintText: 'Infant',
hintStyle: kHintTextStyle,
),
controller: infantController,
)),
verticalSpaceMedium,
Container(
alignment: Alignment.centerLeft,
decoration: kBoxDecorationStyle,
height: 55.0,
child: TextFormField(
keyboardType: TextInputType.number,
style: TextStyle(
color: Colors.white,
fontFamily: 'OpenSans',
),
decoration: InputDecoration(
border: InputBorder.none,
contentPadding:
EdgeInsets.only(top: 14.0),
prefixIcon: Icon(
Icons.transit_enterexit,
color: Colors.white,
),
hintText: 'Transit',
hintStyle: kHintTextStyle,
),
controller: transitController,
)),
],
),
),
)),
);
}
}
If you want see change text from textfromField - you have to use setState() where you will asssigned new value to variable.