I am making a global TextFormField widget for the App. But it is not returning data in the controller. My Global text form field Widget: Kindly tell me what I am doing wrong. I am initializing the controller in the SignUp person widget. I also want to validate the text form field in the validator.
import 'package:flutter/material.dart';
class GlobalTextField extends StatelessWidget {
final Widget fieldIcon;
final String fieldText;
final TextEditingController fieldController;
final bool isEnabled;
const GlobalTextField(
this.fieldIcon,
this.fieldText,
this.fieldController, [
this.isEnabled,
]);
@override
Widget build(BuildContext context) {
return TextFormField(
controller: fieldController,
enabled: isEnabled ?? true,
decoration: InputDecoration(
hintText: fieldText,
prefixIcon: fieldIcon,
hintStyle: TextStyle(color: Colors.grey),
filled: true,
fillColor: Colors.white70,
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color.fromRGBO(198, 57, 93, 1)),
),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Color.fromRGBO(198, 57, 93, 1)),
),
),
cursorColor: Color.fromRGBO(198, 57, 93, 1),
);
}
}
I used it like
import 'package:flutter/material.dart';
import 'package:neighbourhood_watch/ui/widgets/button_global.dart';
import 'package:neighbourhood_watch/ui/widgets/textfield_global.dart';
import 'package:neighbourhood_watch/widgets/user_image_picker.dart';
import 'dart:io';
class SignUpPerson extends StatefulWidget {
@override
_SignUpPersonState createState() => _SignUpPersonState();
}
class _SignUpPersonState extends State<SignUpPerson> {
TextEditingController username = new TextEditingController();
TextEditingController description = new TextEditingController();
TextEditingController contact = new TextEditingController();
TextEditingController password = new TextEditingController();
TextEditingController area = new TextEditingController();
TextEditingController email = new TextEditingController();
final _formKey = GlobalKey<FormState>();
File _userImageFile;
void _pickedImage(File image) {
_userImageFile = image;
}
@override
Widget build(BuildContext context) {
double width = MediaQuery.of(context).size.width;
double height = MediaQuery.of(context).size.height;
return Scaffold(
backgroundColor: Colors.white,
body: SafeArea(
child: Container(
height: height,
width: width,
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
height: height * 0.05,
width: width,
),
Container(
height: height * 0.25,
width: width,
child: Image.asset(
'assets/images/nhwlogo_global.png',
fit: BoxFit.contain,
),
),
Text(
'Create an Account',
style: TextStyle(
fontSize: 22,
fontWeight: FontWeight.bold,
),
),
SizedBox(
height: 30.0,
),
Container(
height: height * 0.12,
width: width * 0.5,
child: UserImagePicker(
imagePickFn: _pickedImage,
),
),
SizedBox(
height: 10.0,
),
Padding(
padding: const EdgeInsets.only(left: 25.0, right: 25.0),
child: GlobalTextField(
Icon(
Icons.person,
color: Color.fromRGBO(198, 57, 93, 1),
),
'Username',
username),
),
SizedBox(
height: 15.0,
),
Padding(
padding: const EdgeInsets.only(left: 25.0, right: 25.0),
child: GlobalTextField(
Icon(
Icons.edit,
color: Color.fromRGBO(198, 57, 93, 1),
),
'Description',
description),
),
SizedBox(
height: 15.0,
),
Padding(
padding: const EdgeInsets.only(left: 25.0, right: 25.0),
child: GlobalTextField(
Icon(
Icons.call,
color: Color.fromRGBO(198, 57, 93, 1),
),
'Contact No.',
contact),
),
SizedBox(
height: 15.0,
),
Form(
key: _formKey,
child: Padding(
padding: const EdgeInsets.only(left: 25.0, right: 25.0),
child: GlobalTextField(
Icon(
Icons.cake,
color: Color.fromRGBO(198, 57, 93, 1),
),
'Date of Birth',
password),
),
),
SizedBox(
height: 15.0,
),
Padding(
padding: const EdgeInsets.only(left: 25.0, right: 25.0),
child: GlobalTextField(
Icon(
Icons.location_on,
color: Color.fromRGBO(198, 57, 93, 1),
),
'Area',
area),
),
SizedBox(
height: 15.0,
),
Padding(
padding: const EdgeInsets.only(left: 25.0, right: 25.0),
child: GlobalTextField(
Icon(
Icons.email,
color: Color.fromRGBO(198, 57, 93, 1),
),
'Email',
email),
),
SizedBox(
height: 15.0,
),
Padding(
padding: const EdgeInsets.only(left: 25.0, right: 25.0),
child: GlobalTextField(
Icon(
Icons.lock,
color: Color.fromRGBO(198, 57, 93, 1),
),
'Password',
password),
),
SizedBox(
height: 15.0,
),
Padding(
padding: const EdgeInsets.only(left: 25.0, right: 25.0),
child: GlobalTextField(
Icon(
Icons.lock,
color: Color.fromRGBO(198, 57, 93, 1),
),
'Confirm Password',
password),
),
SizedBox(
height: 70.0,
),
GlobalButton('CONTINUE', () {
print('userName: ${username}');
}, width * 0.7),
SizedBox(
height: 50.0,
),
Text(
'By creating an account you agree to our',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
Text(
'Terms of Service and Privacy Policy',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Color.fromRGBO(198, 57, 93, 1),
),
),
SizedBox(
height: 50.0,
),
],
),
),
),
),
);
}
}
thanks to all the developers. This is because I am using the const GlobalTextWidget constructor, I just remove the const keyword and it is now working fine.