Flutter
autovalidateMode
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.
Örnek çözümü göster
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;
},
),
],
),
),
),
);
}
}
Kendini test et
-
autovalidateMode.onUserInteraction ne zaman validator çalıştırır?
- Asla çalıştırmaz
- Kullanıcı alana dokunduktan sonra her değişiklikte
- Yalnızca sayfa açılışında
- Yalnızca butona basınca
Cevabı göster
Kullanıcı alana dokunduktan sonra her değişiklikte — onUserInteraction, kullanıcı alana ilk dokunuşundan sonra her değişiklikte validator çalıştırır; böylece anlık geri bildirim verilir.
-
autovalidateMode'u always yap
Form(
autovalidateMode: AutovalidateMode.____,
child: ...,
)
Cevabı göster
Form(
autovalidateMode: AutovalidateMode.always,
child: ...,
)
-
autovalidateMode parçaları
- 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
Sıradaki ders: Özet - Form doğrulama
