autovalidateMode
- Flutter kursu
- Orta seviye
- Ders 34/99
- 4 dk
autovalidateMode ile anlık doğrulama yapmayı öğrenirsin.
autovalidateMode nedir?
autovalidateMode, formun ne zaman validator çalıştıracağını belirler. Üç değer alır: disabled (kapalı), always (her zaman) ve onUserInteraction (kullanıcı etkileşiminde).
Form(
autovalidateMode: AutovalidateMode.always,
child: ...,
)Bu sayede hata mesajları anlık olarak gösterilir.
always ve onUserInteraction
AutovalidateMode.always form her build edildiğinde validator çalıştırır. AutovalidateMode.onUserInteraction ise kullanıcı alanı değiştirdikten sonra çalışmaya başlar.
Form(
autovalidateMode: AutovalidateMode.onUserInteraction,
child: ...,
)always daha agresif, onUserInteraction daha kullanıcı dostudur.
Uygulama autovalidateMode ile anlık doğrulama
Ekrani stateful widget'ında _formKey tanımla. Form'a autovalidateMode: AutovalidateMode.always ver. İçine bir TextFormField koy; validator boş değer için 'Boş' döndürsün. main'de print('form açıldı') çağır.
Başlangıç kodu
import 'package:flutter/material.dart';
void main() {
print('form açıldı');
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(
// autovalidateMode ekle
child: Column(
children: [
// validator ile TextFormField ekle
TextFormField(),
],
),
),
),
);
}
}Örnek çözüm
import 'package:flutter/material.dart';
void main() {
print('form açıldı');
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,
autovalidateMode: AutovalidateMode.always,
child: Column(
children: [
TextFormField(
validator: (deger) {
if (deger!.isEmpty) {
return 'Boş';
}
return null;
},
),
],
),
),
),
);
}
}Beklenen çıktı
form açıldı
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 autovalidateMode.onUserInteraction ne zaman validator çalıştırır?
- Asla çalıştırmaz
- Kullanıcı alana dokunduktan sonra her değişiklikte Doğru cevap
- Yalnızca sayfa açılışında
- Yalnızca butona basınca
Açıklama: onUserInteraction, kullanıcı alana ilk dokunuşundan sonra her değişiklikte validator çalıştırır; böylece anlık geri bildirim verilir.
2 autovalidateMode'u always yap
Form(
autovalidateMode: AutovalidateMode.____,
child: ...,
)Form(
autovalidateMode: AutovalidateMode.always,
child: ...,
)Açıklama: autovalidateMode: AutovalidateMode.always, form her build edildiğinde validator çalıştırır; hatalar anlık gösterilir.
3 autovalidateMode parçaları
| Kavram | Anlamı |
|---|---|
autovalidateMode |
Validator'ın ne zaman çalışacağını belirler |
always |
Her build'de validator çalışır |
onUserInteraction |
Kullanıcı dokunduktan sonra çalışır |
disabled |
Validator kapalıdır |