TextField, kullanıcıdan metin girişi almak için kullanılan bir bileşendir. Flutter’da TextField bileşenini kullanarak kullanıcıdan metin girişi alabilir ve girilen metni işleyebilirsiniz.

import ‘package:flutter/material.dart’;

void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
TextEditingController _textEditingController = TextEditingController();

@override
Widget build(BuildContext context) {
return MaterialApp(
title: ‘TextField Example’,
home: Scaffold(
appBar: AppBar(
title: Text(‘TextField Example’),
),
body: Center(
child: Padding(
padding: EdgeInsets.all(16.0),
child: TextField(
controller: _textEditingController,
decoration: InputDecoration(
labelText: ‘Enter your name’,
border: OutlineInputBorder(),
),
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
String enteredText = _textEditingController.text;
print(‘Entered text: $enteredText’);
},
child: Icon(Icons.check),
),
),
);
}
}

TextField‘ın controller özelliğine bir TextEditingController atanmıştır. TextEditingController, TextField‘a girilen metni kontrol etmek ve erişmek için kullanılır.

TextField‘ın decoration özelliği ile görüntüsü özelleştirilmiştir. InputDecoration sınıfı kullanılarak bir etiket (labelText) ve bir kenarlık (border) belirtilmiştir. border özelliği OutlineInputBorder() ile tanımlanmıştır.

Örnekte, TextField bileşeni bir Padding bileşeni ile sarmalanmıştır. Bu, bileşene kenar boşlukları eklemek için kullanılan bir yöntemdir.

Scaffold bileşenine bir floatingActionButton eklenmiştir. Bu düğme, TextField‘a girilen metni almak için kullanılır. Düğmeye tıklandığında _textEditingController.text ile TextField‘a girilen metin alınır ve konsola yazdırılır.

Bu örnek, temel olarak TextField‘ın nasıl kullanılacağını göstermektedir. İsteğinize bağlı olarak TextField‘ı daha fazla özelleştirebilir ve girilen metni işlemek için farklı yöntemler kullanabilirsiniz.