1-) FLUTTER - input widgetler TextField vs
**** TEXTFORMFİELD KULLANIMI ****
child: Material( border: InputBorder.none,
|
|
email_validator: '^2.0.1'
import 'package:email_validator/email_validator.dart';
import 'package:flutter/material.dart';
import 'package:email_validator/email_validator.dart';
class TextFormFieldPage extends StatefulWidget {
const TextFormFieldPage({Key? key}) : super(key: key);
@override
_TextFormFieldPageState createState() => _TextFormFieldPageState();
}
class _TextFormFieldPageState extends State<TextFormFieldPage> {
String _mail = "";
final _globalKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return Container(
child: Padding(
padding: EdgeInsets.all(16),
child: Center(
child: Form(
key: _globalKey,
autovalidateMode: AutovalidateMode.always,
child: Column(
children: [
TextFormField(
// initialValue: "Rambo",
onSaved: (deger) {
_mail = deger!;
},
keyboardType: TextInputType.emailAddress,
decoration: InputDecoration(
errorStyle: TextStyle(color: Colors.orange),
labelText: "username",
hintText: "userhinttex",
border: OutlineInputBorder(),
),
validator: (deger) {
if(deger!.isEmpty){
return "mail boş olamaz";
}else if (!EmailValidator.validate(deger!)) {
return "geçersiz mail";
} else {
return null;
}
},
),
ElevatedButton(
onPressed: () {
bool _validate = _globalKey.currentState!.validate();
if (_validate) { // tüm kontroller doğruysa demek
_globalKey.currentState!.save();
String sonuc = "mail : "+_mail;
print(sonuc);
// işlemler bitince temizlemek için
_globalKey.currentState!.reset();
}
},
child: Text("Onayla"))
],
),
),
),
),
);
}
}
**** TEXTFİELD KULLANIMI ****
class _TextFieldPageState extends State<TextFieldPage> {
late TextEditingController _emailController;
@override
void initState() {
super.initState();
_emailController = new TextEditingController(text: "rambo@gmail.com");
}
@override
void dispose() {
_emailController.dispose(); // sayfa kapandıgında yoket
super.dispose();
}
Padding(
padding: EdgeInsets.all( 15),
child: TextField(
controller: _emailController,
keyboardType: TextInputType.number,// sadece sayı girilebilir
textInputAction: TextInputAction.next,// okey butonunu sağ ok işareti yapar
autofocus: true, // direkt bu seçili gelir
maxLength: 20, // en fazla 20 karakter girilir demek
onChanged: (String deger){ // text değiştiği anda son hali tetiklenir
print(deger);
},
onSubmitted: (String deger){ // ileri ok buttonuna basınca demek
print("submit : "+deger);
},
decoration: InputDecoration(
labelText: "Ad", // üstte küçük label oluşturur
prefixIcon: Icon(Icons.email), // textin başındaki icon
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(18.0))
),
),
),
)
ElevatedButton(
onPressed: () {
print(_emailController.text);
setState(() {
_emailController.text = "yeni@gmail.com";
});
},
child: Text("Veri al/yaz"),
)
****DİĞER FocusNode üzerine gelince şunu yap dedik****
class _TextFieldPageState extends State<TextFieldPage> {
late TextEditingController _emailController;
late FocusNode _focusNode;
int maxLineCount =1;
@override
void initState() {
super.initState();
_emailController = new TextEditingController(text: "rambo@gmail.com");
_focusNode = new FocusNode();
_focusNode.addListener(() {
setState(() {
if(_focusNode.hasFocus){
maxLineCount=3;
}else{
maxLineCount=1;
}
});
});
}
child: TextField(
focusNode: _focusNode,
maxLines: maxLineCount,
...
****DİĞER1****
Padding(
padding: EdgeInsets.all( 15),
child: TextField(
keyboardType: TextInputType.number,// sadece sayı girilebilir
textInputAction: TextInputAction.next,// okey butonunu sağ ok işareti yapar
autofocus: true, // direkt bu seçili gelir
//maxLines: 3, // 3 satırlık genişler
maxLength: 20, // en fazla 20 karakter girilir demek
onChanged: (String deger){ // text değiştiği anda son hali tetiklenir
print(deger);
},
onSubmitted: (String deger){ // ileri ok buttonuna basınca demek
print("submit : "+deger);
},
decoration: InputDecoration(
labelText: "Ad", // üstte küçük label oluşturur
// hintText: "Adınızı giriniz", // bildiğimiz hint
//icon: Icon(Icons.add)
prefixIcon: Icon(Icons.email), // textin başındaki icon
suffixIcon: Icon(Icons.access_alarm), // textin en sağındaki icon
border: OutlineInputBorder(
borderRadius: BorderRadius.all(Radius.circular(18.0))
),
// filled: true, // iç rengini değiştirmek için true yaparız
// fillColor: Colors.orange // iç rengini değiştirir
),
),
),