validator
- Flutter course
- Intermediate
- Lesson 32/99
- 4 min
Validate a field with the validator callback.
What is validator?
validator is a callback given to a TextFormField. It is called when the user fills the field and returns an error message (String) or null. null means valid.
TextFormField(
validator: (value) {
if (value!.isEmpty) return 'Cannot be empty';
return null;
},
)The error message appears below the field.
errorText display
The String returned by the validator is shown as errorText under the TextFormField's decoration. Each time the user types, the validator runs again and the error message updates.
validator: (value) {
if (value!.length < 3) {
return 'At least 3 characters';
}
return null;
}The error message appears in red automatically.
Practice Empty field check with validator
In Ekrani stateful widget, declare _formKey. Place a TextFormField inside a Form; the validator should return 'Boş bırakılamaz' for empty value. On button press, call _formKey.currentState!.validate() and if the result is true, print 'geçerli'. In main, call print('form hazır').
Starter code
import 'package:flutter/material.dart';
void main() {
print('form hazır');
runApp(MaterialApp(home: Ekrani()));
}
class Ekrani extends StatefulWidget {
@override
_EkraniState createState() => _EkraniState();
}
class _EkraniState extends State<Ekrani> {
// _formKey ekle
@override
Widget build(BuildContext context) {
return Scaffold(
body: Padding(
padding: EdgeInsets.all(16),
child: Form(
key: _formKey,
child: Column(
children: [
// validator ekleyin
TextFormField(),
ElevatedButton(
onPressed: () {
// validate çağır
},
child: Text('Kontrol et'),
),
],
),
),
),
);
}
}Sample solution
import 'package:flutter/material.dart';
void main() {
print('form hazır');
runApp(MaterialApp(home: Ekrani()));
}
class Ekrani extends StatefulWidget {
@override
_EkraniState createState() => _EkraniState();
}
class _EkraniState extends State<Ekrani> {
final _formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return Scaffold(
body: Padding(
padding: EdgeInsets.all(16),
child: Form(
key: _formKey,
child: Column(
children: [
TextFormField(
validator: (deger) {
if (deger!.isEmpty) {
return 'Boş bırakılamaz';
}
return null;
},
),
ElevatedButton(
onPressed: () {
if (_formKey.currentState!.validate()) {
print('geçerli');
}
},
child: Text('Kontrol et'),
),
],
),
),
),
);
}
}Expected output
form hazır
Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 What should the validator callback return for a valid value?
- null Correct answer
- An error message String
- true
- false
Explanation: validator returns null if the value is valid; it returns an error message String if invalid.
2 Return an error message in validator
validator: (deger) {
if (deger!.isEmpty) {
____ 'Boş bırakılamaz';
}
return null;
}validator: (deger) {
if (deger!.isEmpty) {
return 'Boş bırakılamaz';
}
return null;
}Explanation: validator returns an error message String with return on invalid value; it returns null if valid.
3 validator parts
| Term | Meaning |
|---|---|
validator |
Callback that validates the field |
null dönüşü |
Means the value is valid |
String dönüşü |
Means an error message |
errorText |
Where the error is shown |