Flutter ile Form ve Validation Yapımı

Flutter, özellikle mobil uygulama geliştirme sürecinde yüksek performans ve geliştirme kolaylığı sunmaktadır. Tasarımlarınızı hızlıca oluşturmanızı ve kullanıcı arayüzü bileşenlerini etkin bir şekilde kullanmanızı sağlar. Bu yazıda, Flutter ile form oluşturma ve validation (doğrulama) süreçlerini ele alacağız.

Flutter ile Form Oluşturma

Form oluşturmak için öncelikle Form ve TextFormField widget'larını kullanacağız. Form widget'ı, form elemanlarını gruplamak için kullanılırken, TextFormField kullanıcıdan metin girişi almak için kullanılır.

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Form Örneği')),
        body: MyForm(),
      ),
    );
  }
}

class MyForm extends StatefulWidget {
  @override
  _MyFormState createState() => _MyFormState();
}

class _MyFormState extends State {
  final _formKey = GlobalKey();

  @override
  Widget build(BuildContext context) {
    return Form(
      key: _formKey,
      child: Column(
        children: [
          TextFormField(
            decoration: InputDecoration(labelText: 'İsim'),
            validator: (value) {
              if (value == null || value.isEmpty) {
                return 'Lütfen isminizi girin';
              }
              return null;
            },
          ),
          TextFormField(
            decoration: InputDecoration(labelText: 'Email'),
            validator: (value) {
              if (value == null || value.isEmpty) {
                return 'Lütfen bir email girin';
              }
              if (!RegExp(r'^[^@]+@[^@]+\.[^@]+').hasMatch(value)) {
                return 'Geçersiz email adresi';
              }
              return null;
            },
          ),
          ElevatedButton(
            onPressed: () {
              if (_formKey.currentState!.validate()) {
                ScaffoldMessenger.of(context)
                    .showSnackBar(SnackBar(content: Text('Form geçerli')));
              }
            },
            child: Text('Gönder'),
          ),
        ],
      ),
    );
  }
}

Formda Validation Kullanımı

Form elemanlarını doğrulamak için, her bir TextFormField içinde validator parametresi kullandık. Kullanıcıdan gelen girdileri kontrol ederek, uygun mesajlar iletmekteyiz. Eğer giriş geçerli ise, formun gönderilmesine izin veriyor, değilse kullanıcının hata mesajı görmesini sağlıyoruz.

Sonuç

Flutter ile form oluşturma ve validation işlemleri oldukça basittir. Belirtilen adımları takip ederek kullanıcı dostu formlar geliştirebilirsiniz. Geçerli veriler ile çalıştığınızda, uygulamanızın kalitesini artırırken, kullanıcı deneyimini de olumlu yönde etkilersiniz. Flutter'ın sunduğu bu kolaylıklar, mobil uygulama geliştirme sürecinizi hızlandıracaktır.