Flutter'da state yönetimi, uygulamanın durumunun değiştiği zamanlarda kullanıcı arayüzünün güncellenmesini sağlamak için kullanılan bir yöntemdir. Bu, kullanıcı etkileşimleri veya uygulama verileri gibi değişkenlerin güncellendiğinde, bunları yansıtan widget'ların otomatik olarak yeniden oluşturulmasını içerir.
Örnek olarak, bir sayaç uygulaması üzerinden Flutter'da state yönetimini gösterebiliriz. Bu örnekte, bir düğmeye her tıklandığında sayaç değeri artar ve bu değer arayüzde gösterilir.
Öncelikle, bir stateful widget oluşturarak başlayalım. Bu widget, içerisinde sayaç değerini tutacak bir state alanı bulunduracak ve arayüzü oluşturacaktır.
import 'package:flutter/material.dart';
class CounterApp extends StatefulWidget {
@override
_CounterAppState createState() => _CounterAppState();
}
class _CounterAppState extends State<CounterApp> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Counter App'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'Counter value:',
),
Text(
'$_counter',
style: TextStyle(fontSize: 24),
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}
Yukarıdaki örnekte, CounterApp adında bir stateful widget oluşturduk. Widget, _CounterAppState sınıfını kullanır ve _counter adında bir state değişkeni içerir. _incrementCounter fonksiyonu, düğmeye tıklandığında _counter değerini artırmak için kullanılır. Bu fonksiyon, setState yöntemi ile _counter'ı güncelleyerek widget'ın yeniden oluşturulmasını sağlar.
Bu örneği kullanmak için, bir MaterialApp içinde CounterApp widget'ını çağırabilirsiniz:
void main() {
runApp(MaterialApp(
home: CounterApp(),
));
}
Bu şekilde, uygulama başlatıldığında sayaç değeri 0 olarak görüntülenir. Her tıklamada, sayaç değeri artar ve güncellenmiş değer arayüzde görüntülenir.
Bu basit örnekte, stateful widget kullanarak basit bir state yönetimi örneği oluşturduk. Flutter'da state yönetimi, daha karmaşık durumlar için daha gelişmiş paketler ve mimarilerle genişletilebilir, ancak temel prensip widget'ların durumu güncelleyerek arayüzü yeniden oluşturmasıdır.