I have a few rules for validator e-mail and password of my registration page and I want to check them. But it's not working.
import 'package:flutter/material.dart';
class register extends StatefulWidget {
register({Key? key}) : super(key: key);
@override
_registerState createState() => _registerState();
}
class _registerState extends State<register> {
late TextEditingController textController1;
late TextEditingController textController2;
late bool passwordVisibility1;
late TextEditingController textController3;
late bool passwordVisibility2;
final scaffoldKey = GlobalKey<ScaffoldState>();
String email = '';
String password = '';
String error = '';
@override
void initState() {
super.initState();
textController1 = TextEditingController();
textController2 = TextEditingController();
passwordVisibility1 = false;
textController3 = TextEditingController();
passwordVisibility2 = false;
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Stack(
children: [
Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height * 1,
decoration: BoxDecoration(
color: Color(0xFFEEEEEE),
image: DecorationImage(
fit: BoxFit.cover,
image: Image.asset(
'assets/img/backgraund_page.jpg',
).image,
),
),
),
Align(
alignment: AlignmentDirectional(0, -0.8),
child: Image.asset(
'assets/logo/Aet_page-0001-removebg-preview.png',
width: 250,
height: 170,
fit: BoxFit.contain,
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(0, 300, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width,
height: 565,
decoration: const BoxDecoration(
color: Color(0xFFEEEEEE),
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(0),
bottomRight: Radius.circular(0),
topLeft: Radius.circular(50),
topRight: Radius.circular(50),
),
),
child: Stack(
children: [
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 70, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 50,
decoration: const BoxDecoration(
color: Color(0xFFEEEEEE),
),
child: TextFormField(
validator: (val) =>
val!.isEmpty ? 'Enter an email' : null,
onChanged: (val) {
setState(() {
email = val;
});
},
controller: textController1,
obscureText: false,
decoration: const InputDecoration(
hintText: 'E-Posta',
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
),
keyboardType: TextInputType.emailAddress,
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 120, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 50,
decoration: const BoxDecoration(
color: Color(0xFFEEEEEE),
),
child: TextFormField(
validator: (val) => val!.length < 6
? 'Ender a password 6 chars long'
: null,
onChanged: (val) {
setState(() {
password = val;
});
},
controller: textController2,
obscureText: !passwordVisibility1,
decoration: InputDecoration(
hintText: 'Password',
enabledBorder: const UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
focusedBorder: const UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
suffixIcon: InkWell(
onTap: () => setState(
() =>
passwordVisibility1 = !passwordVisibility1,
),
child: Icon(
passwordVisibility1
? Icons.visibility_outlined
: Icons.visibility_off_outlined,
color: Color(0xFF757575),
size: 22,
),
),
),
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 170, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 50,
decoration: BoxDecoration(
color: Color(0xFFEEEEEE),
),
child: TextFormField(
controller: textController3,
obscureText: !passwordVisibility2,
decoration: InputDecoration(
hintText: 'Confirm Password',
enabledBorder: const UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
focusedBorder: const UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
suffixIcon: InkWell(
onTap: () => setState(
() =>
passwordVisibility2 = !passwordVisibility2,
),
child: Icon(
passwordVisibility2
? Icons.visibility_outlined
: Icons.visibility_off_outlined,
color: Color(0xFF757575),
size: 22,
),
),
),
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 120, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 1,
decoration: BoxDecoration(
color: Color(0xFFEEEEEE),
border: Border.all(
color: Color(0xFFB9B7B7),
),
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 170, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 1,
decoration: BoxDecoration(
color: Color(0xFFEEEEEE),
border: Border.all(
color: Color(0xFFB9B7B7),
),
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 220, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 1,
decoration: BoxDecoration(
color: Color(0xFFEEEEEE),
border: Border.all(
color: Color(0xFFB9B7B7),
),
),
),
),
Padding(
// ignore: prefer_const_constructors
padding: EdgeInsetsDirectional.fromSTEB(40, 270, 0, 0),
// ignore: deprecated_member_use
child: SizedBox(
height: 40,
width: MediaQuery.of(context).size.width * 0.8,
child: RaisedButton(
onPressed: () {
print(email);
print(password);
},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
),
color: Color(0xFF36A8D3),
child: const Center(
child: Text(
"Sign In",
style: TextStyle(color: Colors.white),
),
),
),
),
),
const Padding(
padding: EdgeInsetsDirectional.fromSTEB(65, 512, 0, 0),
child: Text(
'Are you already a member?',
style: TextStyle(
fontFamily: 'Poppins',
fontSize: 15,
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(265, 512, 0, 0),
child: InkWell(
onTap: () async {
await Navigator.push(
context,
MaterialPageRoute(
builder: (context) => loginpage(),
),
);
},
child: const Text(
'Login In',
style: TextStyle(
fontFamily: 'Poppins',
color: Colors.blue,
fontSize: 15,
),
),
),
),
],
),
),
),
],
),
),
);
}
}
hello everyone, above are the codes for my registration page. With Validator I have a few rules required for e-mail password and I want to check these rules, but the validator is not working at all. How can I fix this. Can you help me?
CodePudding user response：
You have to wrap your TextFormField with Form.
import 'package:flutter/material.dart';
class register extends StatefulWidget {
register({Key? key}) : super(key: key);
@override
_registerState createState() => _registerState();
}
class _registerState extends State<register> {
late TextEditingController textController1;
late TextEditingController textController2;
late bool passwordVisibility1;
late TextEditingController textController3;
late bool passwordVisibility2;
final scaffoldKey = GlobalKey<ScaffoldState>();
final formKey = GlobalKey<FormState>();
String email = '';
String password = '';
String error = '';
@override
void initState() {
super.initState();
textController1 = TextEditingController();
textController2 = TextEditingController();
passwordVisibility1 = false;
textController3 = TextEditingController();
passwordVisibility2 = false;
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Stack(
children: [
Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height * 1,
decoration: BoxDecoration(
color: Color(0xFFEEEEEE),
image: DecorationImage(
fit: BoxFit.cover,
image: Image.asset(
'assets/img/backgraund_page.jpg',
).image,
),
),
),
Align(
alignment: AlignmentDirectional(0, -0.8),
child: Image.asset(
'assets/logo/Aet_page-0001-removebg-preview.png',
width: 250,
height: 170,
fit: BoxFit.contain,
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(0, 300, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width,
height: 565,
decoration: const BoxDecoration(
color: Color(0xFFEEEEEE),
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(0),
bottomRight: Radius.circular(0),
topLeft: Radius.circular(50),
topRight: Radius.circular(50),
),
),
child: Form(
key: formKey,
child: Stack(
children: [
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 70, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 50,
decoration: const BoxDecoration(
color: Color(0xFFEEEEEE),
),
child: TextFormField(
validator: (val) =>
val!.isEmpty ? 'Enter an email' : null,
onChanged: (val) {
setState(() {
email = val;
});
},
controller: textController1,
obscureText: false,
decoration: const InputDecoration(
hintText: 'E-Posta',
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
),
keyboardType: TextInputType.emailAddress,
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 120, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 50,
decoration: const BoxDecoration(
color: Color(0xFFEEEEEE),
),
child: TextFormField(
validator: (val) => val!.length < 6
? 'Ender a password 6 chars long'
: null,
onChanged: (val) {
setState(() {
password = val;
});
},
controller: textController2,
obscureText: !passwordVisibility1,
decoration: InputDecoration(
hintText: 'Password',
enabledBorder: const UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
focusedBorder: const UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
suffixIcon: InkWell(
onTap: () => setState(
() =>
passwordVisibility1 = !passwordVisibility1,
),
child: Icon(
passwordVisibility1
? Icons.visibility_outlined
: Icons.visibility_off_outlined,
color: Color(0xFF757575),
size: 22,
),
),
),
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 170, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 50,
decoration: BoxDecoration(
color: Color(0xFFEEEEEE),
),
child: TextFormField(
controller: textController3,
obscureText: !passwordVisibility2,
decoration: InputDecoration(
hintText: 'Confirm Password',
enabledBorder: const UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
focusedBorder: const UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0x00000000),
width: 1,
),
),
suffixIcon: InkWell(
onTap: () => setState(
() =>
passwordVisibility2 = !passwordVisibility2,
),
child: Icon(
passwordVisibility2
? Icons.visibility_outlined
: Icons.visibility_off_outlined,
color: Color(0xFF757575),
size: 22,
),
),
),
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 120, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 1,
decoration: BoxDecoration(
color: Color(0xFFEEEEEE),
border: Border.all(
color: Color(0xFFB9B7B7),
),
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 170, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 1,
decoration: BoxDecoration(
color: Color(0xFFEEEEEE),
border: Border.all(
color: Color(0xFFB9B7B7),
),
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(40, 220, 0, 0),
child: Container(
width: MediaQuery.of(context).size.width * 0.8,
height: 1,
decoration: BoxDecoration(
color: Color(0xFFEEEEEE),
border: Border.all(
color: Color(0xFFB9B7B7),
),
),
),
),
Padding(
// ignore: prefer_const_constructors
padding: EdgeInsetsDirectional.fromSTEB(40, 270, 0, 0),
// ignore: deprecated_member_use
child: SizedBox(
height: 40,
width: MediaQuery.of(context).size.width * 0.8,
child: RaisedButton(
onPressed: () {
if(!formKey.currentState!.validate()) return;
print(email);
print(password);
},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
),
color: Color(0xFF36A8D3),
child: const Center(
child: Text(
"Sign In",
style: TextStyle(color: Colors.white),
),
),
),
),
),
const Padding(
padding: EdgeInsetsDirectional.fromSTEB(65, 512, 0, 0),
child: Text(
'Are you already a member?',
style: TextStyle(
fontFamily: 'Poppins',
fontSize: 15,
),
),
),
Padding(
padding: EdgeInsetsDirectional.fromSTEB(265, 512, 0, 0),
child: InkWell(
onTap: () async {
await Navigator.push(
context,
MaterialPageRoute(
builder: (context) => loginpage(),
),
);
},
child: const Text(
'Login In',
style: TextStyle(
fontFamily: 'Poppins',
color: Colors.blue,
fontSize: 15,
),
),
),
),
],
),
),
),
),
],
),
),
);
}
}