Menggunakan ObservedObject dan EnvironmentObject di SwiftUI

Membuat sistematika dalam modifikasi data di SwiftUI

Photo by CHUTTERSNAP on Unsplash

ObservedObject dan EnvironmentObject adalah 2 macam property wrapper yang membantu dalam memodifikasi data (mengedit dan menampilkannya). Tapi sebelumnya kita mulai dulu dengan wrapper sederhana berikut ini:

@State var nama = ""

Yup, State adalah wrapper yang dapat langsung memberikan perubahan tampilan (baca : refresh) pada view apabila terjadi perubahan data dalam view tersebut. Umumnya digunakan untuk data jenis String atau Integer, namun sebenarnya bisa untuk tipe lain tapi untuk kasus tertentu. Untuk penggunaan State jumlah sedikit dalam satu view tidak akan ada masalah apabila bentuknya seperti mengisi nama, umur, hobi, lalu variabel boolean untuk mengganti warna dengan menggunakan Conditional Modifier. Jika kita melakukan hal itu maka akan ada total 4 State dalam satu view.

Masalah Menggunanakan State sebagai Wrapper

Namun bagaimana kalau kita ingin membuat halaman yang berbentuk seperti form isian? yang isinya bisa terdiri dari banyak textfield, gambar, atau mungkin bagian-bagian tertentu yang dapat berubah warna sesuai pilihan yang dipilih? Tentu saja kita harus membuat begitu banyak State dalam satu view. Ya, sebenarnya bisa-bisa aja kita melakukan itu, akan tetapi di SwiftUI ini, kita belajar untuk menggambar tampilan melalui penulisan kode, jadi biarlah seperti itu. Sebisa mungkin kita usahakan menjauhkan struct view dari baris-baris kode yang tidak berhubungan langsung terhadap visual. Jadi apa yang bisa dilakukan?

Kita pasti sudah mengenal dengan konsep OOP (Object Oriented Programming) dimana kita hanya perlu menginisialisasikan variabel, fungsi atau apapun itu sekali. Lalu kita dapat menggunakannya di class manapun hanya dengan memanggil class yang bersangkutan. Namun bagaimana menerapkan cara ini pada SwiftUI? Sebab kita tahu bahwa State tidak bisa digunakan untuk struct yang berbeda. karena itu lah kita dapat memanfaatkan ObservableObject. Dengan menggunakan konsep sama seperti OOP, namun dikhususkan untuk property wrapper.

Mengenal Observed Object

Kita ambil contoh kita akan membuat form berisi nama, tempat lahir, usia, dan hobi. Pertama yang perlu dilakukan adalah membuat kelas dengan tipe ObservableObject yang menampung semua variabel itu.

class DataDiri : ObservableObject {
// variabel disini
}

Setelah itu kita akan meletakkan variabel-variabel di atas dengan wrapper Published, seperti berikut :

class DataDiri : ObservableObject {
@Published var nama = ""
@Publishd var tempatLahir = ""
@Published var usia = ""
@Published var hobi = ""
}

Published akan bertindak seperti halnya State tapi untuk eksternal. Jadi untuk menggunakannya di view yang diinginkan, kita cukup memanggilnya dengan ObservedObject.

@ObservedObject var dataDiri = DataDiri()

Dengan begitu kita bisa menggunakan semua variabel dalam kelas tersebut. di struct utama hanya dengan 1 baris kode.

Menggunakan Environment Object

Namun sekarang bagaimana jika kita ingin menampilkan data tersebut di view lain? Tentu kita bisa menyalurkan data melalui Binding, tapi itu tidak akan efektif, apalagi jika harus mengirim data ke halaman sebelumnya, justru akan lebih repot.

Karena itu kita memerlukan bantuan EnvironmentObject, dengan tujuan untuk mempermudah dalam perpindahan data antar views. Cara ini akan berguna sangat berguna jika dikombinasikan dengan ObservableObject. Untuk cara pakainya, kita perlu membuka root aplikasi, yaitu yang berada di SceneDelegate.swift (jika kalian menggunakan UIKit Lifecycle). Setelah itu, kita inisialisasi kelas DataDiri yang telah dibuat.

let dataDiri = DataDiri()
let contentView = ContentView().environmentObject(dataDiri)

Pada ContentView(), kita tambahkan atribut .environmentObject dengan tujuan “menyisipkan” kelas DataDiri ke dalam ContentView.

Pada struct-nya sendiri, kita cukup memanggilnya dengan mengubah

@ObservedObject var dataDiri = DataDiri()

menjadi

@EnvironmentObject var dataDiri : DataDiri

Cukup dengan menambahkan baris ini saja , maka kita bisa menggunakan isi dari DataDiri() di struct ContentView(). Sebenarnya juga, kita bisa menggunakan baris kode di atas di struct view manapun, tanpa harus dioper terlebih dahulu. Cukup mudah bukan?. Nah, mulai sekarang kode kalian akan lebih terstruktur, dan bisa dibilang tidak “redundant” dalam penggunaan variabel-variabelnya. Sekian dari artikel ini, semoga kalian paham dengan penggunaan ObservedObject dan EnvironmentObject dalam SwiftUI, serta dapat mempermudah kalian dalam pembuatan app.

Baca juga : CRUD dengan Core Data di SwiftUI