Flutter uygulamalarında asenkron kod yazmak için kullandığımız Future veri tipiyle ve async anahtar kelimesiyle birlikte HTTP istekleri, yerel veritabanı işlemleri, CRUD operasyonları, dosya işlemleri ve buna benzer işlemler Flutter’da bulunan single thread yapısını bloke etmeden gerçekleştirilebiliyor. Asenkron işlem ve senkron işlemlerin tanımlarını inceleyelim.


Senkron işlem: Senkron işlemler, tamamlanana kadar diğer operasyonları bloke eder ve işlenmesini engeller.

Asenkron işlem: Asenkron işlemler, tamamlanana kadar diğer operasyonları engellemez ve işlenmelerini engellemez.


Future nedir?

Future, bir asenkron operasyonun sonucunu içerir ve iki farklı durumu vardır: Tamamlanmış ve tamamlanmamış Future operasyonları. Tamamlanmamış Future operasyonları hala devam eden işlemlere verilen isimdir. Bir değer üretmemiş durumda olan operasyonlar eğer bir değer üretirse, tamamlanmış bir operasyon olur. Bu üretilen değer duruma göre istediğiniz değer olabilir veya bir exception, error vb. şeyler de olabilir.

Future nasıl kullanılır?

Bunu gösterebilmek için basit bir uygulama yapmayı planlıyorum. Kullanacağım API basit bir şekilde veri çekebilmek için World Clock olacak. Kullanacağımız bir paket olacak. HTTP paketi ile birlikte API istekleri atacağız.

getTime fonksiyonu

Öncelikle ne tip veri döndüreceğimizi belirleyip, async anahtarı ile birlikte fonksiyonumuzu oluşturalım.

Future<String> getTime() async {}

İstek atacağımız URL’yi ekleyelim.

  var url = "http://worldclockapi.com/api/json/est/now";

Daha sonra belirttiğimiz URL’ye HTTP isteği atalım.

  var response = await http.get(url);

Nedir bu await? Daha sonra açıklayacağım. StatusCode 200 olma durumunu ve JSON parçalama kodlarını da yazdıktan sonra getTime fonksiyonumuzu tamamlayalım.

Flutter http isteği

State ile bağlantı

Daha sonra State içerisinde kodlarımızı yazalım ve servis dosyamızdaki fonksiyonun döndürdüğü değeri almasını sağlayalım. Flutter’da eğer bir State yönetim kütüphanesi kullanmıyorsanız, UI üzerinde göstereceğiniz verileri önceden hazırlamak için genellikle initState kullanılır.

State içerisinde bir fetch fonksiyonu hazırlayıp onu asenkron yaptıktan sonra, getTime ile olan fonksiyonu burada çağıralım ve döndüreceği sonucu da setState ile ekrana basalım.

Flutter Future kullanımı

Neticesinde Future kullanarak, network üzerinden elde ettiğimiz bir veriyi ekrana basabildik. Peki yukarıda beklediğimiz sorunun yanıtını vermeye gelelim ayrıca diğer anahtar sözcüklere de değinelim.

Async ve Await anahtar sözcükleri nedir?

Async anahtar sözcüğü ile herhangi bir fonksiyonu asenkron hale getirebildiğimizden yukarıda bahsetmiştik. Async ile asenkron hale gelen fonksiyonlar yalnızca Future<T> tipinde değerler döndürebilir. Future<void> olabilir.

Future<T> ile döndürülen değerler de yalnızca await anahtar sözcüğüyle erişilebilir. Await anahtar sözcüğünü de kullanmak için bir async fonksiyon gerekir. Tam olarak bu yüzden setState gibi bir yöntem ile elde ettiğimiz veriyi ekrana basabiliriz. Daha önce söylediğim gibi, setState basit fakat çok güçlü bir fonksiyondur. 🙂

Async ve Async* arasındaki fark nedir?

Yeri gelmişken bundan da bahsetmek istiyorum. Async ve Async* anahtar sözcükleri aynı iş yapsa da aralarında ufak bir farklılık vardır. Async yalnızca bir tane veri döndürürken, Async* birden fazla veriyi farklı zamanlarda döndürür yani bir Stream’dir.

Future ve FutureBuilder arasındaki bağlantı nedir?

Daha önce hatırladığınız üzere FutureBuilder hakkında birçok yazı yazmıştım. FutureBuilder bir Widget’tır ve yukarıda oluşturduğumuz fonksiyonları daha da kısaltarak ve rahatça bir şekilde yazmamıza olanak sağlar. Aynı zamanda ConnectionState’i de yöneterek kullanıcı deneyimine katkıda bulunacak bildirimleri ve uyarıları göstermemize olanak sağlar.

Doğru FutureBuilder kullanımı

Doğru FutureBuilder kullanımı Flutter uygulamalarında önemlidir. Bazı durumlara dikkat çekmek istiyorum ve yeniden hatırlatmak istiyorum. FutureBuilder şunlara sahip olmalıdır:

  • FutureBuilder, yalnızca bir defa tetiklenmesi gerekir ve her ne olursa olsun bir Widget döndürmelidir.
  • Future fonksiyonunda alınacak veri daima initState içerisinde önceden hazırlanmalıdır.

Tam olarak yukarıda belirttiğim durumlara uygun olarak yazdığımız basit uygulamamızın State içerisindeki kodlarını FutureBuilder’a uygun olarak çevirebilirsiniz. Eğer çeviremeyecek olan varsa da denemelerini tavsiye ediyorum. Parmaklar klavyeye değmedikçe Flutter öğrenmek çok zor. 🙂

FutureBuilder


Sonuç

Flutter uygulamalarında Future nasıl kullanılır, async, async*, await gibi anahtar sözcükler nasıl kullanılır, FutureBuilder nasıl kullanılır öğrenmiş olduk. Sonraki yazılarımın konusu Navigator 2.0, Dart ile web server yazmak gibi daha derin konular olacak. O zamana dek blogumu takipte kalın ve öğrenmeye devam edin!

Flutter ile HTTP istekleri nasıl atılır daha önce merak ettiniz mi? Bu yazıma göz atmayı unutmayın.


Okuyucuya Not

Merhaba okuyucu! Blogum son zamanlarda yüksek trafik almaya başladı ve bu durumdan memnunum fakat aynı zamanda siz ziyaretçileri tatmin edememekten endişeliyim. 🙂 Eğer yazılarım ile ilgili bir tavsiyeniz olursa mail adresimden bana ulaşabilir veya Twitter üzerinden direct message gönderebilirsiniz. Github’ta örnek olarak yaptığım projelere göz atmak isterseniz de bu linki kullanabilirsiniz. Umarım bu ziyaretinizle size bir şeyler katabilmişimdir.

Sağlıcakla kalın!

Tags:

1 Comment

Comments are closed.