SwiftUI API Call & Working with JSON-2

Herkese merhaba, bu yazıda bir önceki yazıda geliştirdiğimiz generic network layer ile SwiftUI kütüphanesini kullanarak todo list api servisini kullanarak todo list dönen url’e request attıktan sonra response alana kadar loading view gösterimi, request atıldıktan sonra response başarılı ise ekranda todo list gösterimi, hata durumunda ise error view gösterimi yapacağız. Özetle bir servise request atıldığı zaman oluşabilecek durumları sırayla handle ederek son kullanıcının herhangi bir uygulamayı kullanırken karşılaşabileceği durumlar için geliştirmeler yapacağız. Bir önceki yazıya buradan ulaşabilirsiniz.

Haydi başlayalım!

Oluşturduğumuz TodoModel bize servisten dönen listedeki todo itemların modelidir.

StateObject: View yenilendiğinde yaratılmış objenin kaybolmamasını sağlar.

Main view olarak bu örneğimizde ContentView’ı kullanıyoruz. ContentView içerisinde TodoListViewModel tipinde viewModel state object tutuyoruz. Yazdığımız if-statementlar ile ilk olarak isLoading kontrolü yapıyoruz, bu bize loading view’ı göstermemizi sağlıyor. Diğer kontrolümüz viewModel içerisinde nil olmayan bir errorMessage olup olmadığıdır, bu da eğer servise giden requestten error aldıysak nil olmayacak ve ekrana error view basmamızı sağlayacaktır. Bu iki durum dışındaki tüm caselerde ise listeyi ekrana basmasını istiyoruz, bunu da TodoListView adı verdiğimiz view ile sağlayacağız. Şimdi bunları daha detaylı inceleyelim!

TodoListViewModel class’ı ObservableObject protocolünü uygular.

ObservableObject: SwiftUI view’larının objedeki değişiklikleri takip edebilmesini sağlar. Yukarıdaki kod bloğunda TodoListViewModel observable bir object olarak tanımlanmıştır. İçerisinde Published olarak tanımlanmış todoList array, isLoading ve errorMessage propertyleri bulunur.

Published: ObservableObject içerisindeki propertylerde gerçekleşen değişikliklerden haberdar olunması için kullanılır. TodoListViewModel bir ObservableObject olduğu için SwiftUI viewları bu objeyi takip edebilir ancak içerisindeki propertylerdeki değişiklikleri bilemez, bu değişikliklerden haberdar olabilmeleri için de Published ifadesi gereklidir. Bu ifade tanımlandıktan sonra property dinlenebildiği için son değerine göre SwiftUI view’ları bu property’nin etkilediği yerleri otomatik olarak yeniler.

Böylece ContentView bir SwiftUI view’ı olarak ObservableObject’leri dinleyebildiği için ve bu ObservableObject içerisinde Published olarak tanımlı olan propertylerdeki değişiklikleri alarak body içerisine yazdığımız if-statementlar sayesinde ekstra bir kod satırı yazıp ekranı yenileme işlemi yapmaya gerek kalmadan ekranda loading view, error view ya da todo list gösterimini yönetebiliyoruz.

TodoListViewModel initialize edildiği anda fetchTodoList methodu çağırılır. isLoading = true set edilerek ekrana ilk olarak servisten response alınana kadar ContentView içerisindeki if isLoading == true statementı çalışır ve loading view basılması sağlanır. Servisten response döndüğü anda success ya da error farketmez isLoading = false set edilir ve loading view gösterimi sonlanır. Eğer servisten error döndü ise errorMessage set edileceği için nil olmayacak ve bu şekilde ContentView içerisindeki ikinci if statement çalışacak ve ekranda error view gösterilecektir. Eğer servisten error dönmedi ve success alındı ise todoList array’ine gelen response set edilir bu işlem de ContentView içerisindeki else statement’ını çalıştıracaktır ve ekrana todo list basılması beklenir.

Ekranda loading view gözükmesi adına 2.0 saniye gecikme koydum. Siz bunu değiştirebilirsiniz. Yine aynı şekilde error dönmesi için url’i bozarak error elde eder ve ekrana error view basıldığının sağlamasını yapabilirsiniz.

TodoListView’da todoList arrayi bekliyoruz. ContentView içerisinde TodoListView’ı çağırırken todoList’i init içerisinde veriyoruz. List ekranda listeleme yapmamızı sağlar. List içerisinde ForEach ile todoList array’inde dönerek her bir todo item için TodoListRowView basılır.

TodoListRow ise içerisinde bir adet todo model beklemektedir. Title ve userId propertyleri ekrana basılır.

TodoListRow’u burada UITableViewCell gibi düşünebilirsiniz.

_Previewslar Xcode üzerinde preview çıktısını aynı anda alabilmeniz adına oluşturulur. İçerisindeki kodu manipüle etmek size kalmış. Örnek olması açısından ekledim.

Success ve error caseleri için simülatör ekran görüntüleri bu şekilde.

Projeye buradan ulaşabilirsiniz.

Herkese keyifli araştırmalar ve okumalar…