UIKit — apa itu, konsep kunci dan arsitektur

Apa itu UIKit?

UIKit — adalah framework dari Apple yang menyediakan kelas untuk membuat dan mengelola antarmuka pengguna di iOS, iPadOS, dan macOS (melalui Mac Catalyst). Ini bekerja di atas Core Animation, Core Graphics, dan Quartz Core, mengabstraksi rendering tingkat rendah ke objek tingkat tinggi — tombol, label, gambar, dan wadah. UIKit muncul bersama iPhone OS 1 pada tahun 2007 dan tetap menjadi framework utama untuk pengembangan iOS di samping SwiftUI.

Framework ini mengikuti pendekatan imperatif: pengembang membuat instance dari kelas UIButton, UILabel, UIImageView, mengatur propertinya (warna, font, posisi) dan menambahkannya ke hierarki tampilan melalui addSubview. Setiap perubahan antarmuka dilakukan secara eksplisit — tanpa keajaiban pembaruan di balik layar. Ini membedakan UIKit dari framework deklaratif seperti SwiftUI, di mana deskripsi status secara otomatis menggambar ulang antarmuka.

Kelas utama UIKit

Framework ini mencakup beberapa kategori kelas. UIView — elemen dasar yang diwarisi oleh semua komponen visual. UIWindow — wadah tingkat tertinggi di mana tampilan ditampilkan di layar. UIViewController — pengontrol yang mengelola serangkaian tampilan dan merespons rotasi layar, kemunculan keyboard, dan pemberitahuan sistem. UIApplication — titik masuk yang memproses peristiwa sentuhan dan penekanan tombol.

Untuk teks digunakan UILabel (teks statis), UITextField (input satu baris), UITextView (input multi-baris). Untuk tombol — UIButton, termasuk sistem, khusus, dan dengan ikonografi SF Symbols. Untuk navigasi — UINavigationController, UITabBarController, dan UISplitViewController. Secara total, UIKit berisi lebih dari 200 kelas publik.

Arsitektur UIKit: lapisan dan hierarki tampilan

Arsitektur UIKit dibangun di atas lapisan: setiap lapisan bertanggung jawab atas aspek tampilannya sendiri. Di tingkat terendah terdapat Core Graphics — mesin rendering jalur, teks, dan gambar. Di atasnya — Core Animation, yang mengelola komposisi lapisan (CALayer) dan animasi antar status. UIKit membangun API berorientasi objek di atasnya: UIView, UIViewController, dan UIResponder.

Setiap aplikasi memiliki hierarki tampilan (view hierarchy) — pohon dengan UIWindow sebagai akarnya. Di bawahnya — UIViewController akar, tampilannya, dan di dalamnya — subview bersarang. Peristiwa sentuhan menyebar di sepanjang rantai responder chain: dari tampilan yang paling bersarang ke induk dan selanjutnya ke UIApplication. Jika tidak ada objek yang memproses sentuhan, itu diabaikan.

UIView dan CALayer

Setiap UIView berisi lapisan CALayer yang bertanggung jawab untuk merender piksel di layar. Tampilan mengelola sentuhan dan aksesibilitas, lapisan — grafis: shadow, cornerRadius, border, transform. Pemisahan ini memungkinkan pemindahan grafis berat ke utas terpisah (render server) tanpa memblokir main thread. Apple merekomendasikan bekerja langsung dengan CALayer jika diperlukan lebih dari 200 tampilan di layar — ini mengurangi beban CPU.

Responder Chain secara detail

Rantai responder dimulai dari objek yang pertama kali menerima peristiwa sentuhan. Jika tidak memproses peristiwa (metode touchesBegan tidak ditimpa), peristiwa diteruskan ke responder berikutnya dalam rantai: next, superview, next responder, UIViewController, UIWindow, UIApplication, App Delegate. Ini memungkinkan mencegat gestur global dan peristiwa keyboard di tingkat adegan tanpa menambahkan penangan ke setiap tampilan.

Siklus hidup UIViewController

Setiap UIViewController melewati urutan peristiwa yang ditentukan secara ketat. Siklus hidup mencakup fase: inisialisasi, memuat tampilan, muncul di layar, memperbarui tata letak saat rotasi, menyembunyikan, meninggalkan layar, dan membebaskan memori. Pengembang menimpa metode yang sesuai untuk menjalankan kodenya di setiap tahap.

class ProfileViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        setupUI()
    }

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)
        loadUserProfile()
    }

    override func viewDidDisappear(_ animated: Bool) {
        super.viewDidDisappear(animated)
        clearCache()
    }
}

Di viewDidLoad antarmuka dikonfigurasi — subview dibuat, kendala ditetapkan, delegat dipasang. Di viewWillAppear operasi dilakukan sebelum ditampilkan: memuat data baru dari jaringan, memperbarui nilai. viewDidDisappear — tempat untuk berhenti berlangganan dari pemberitahuan dan membersihkan data sementara. Pemanggilan super wajib dalam semua penimpaan, jika tidak rantai peristiwa akan terputus.

Manajemen memori dan viewDidUnload

Di versi iOS lama ada metode viewDidUnload, dipanggil saat memori hampir habis. Mulai iOS 6 metode ini dihapus — sekarang UIKit secara otomatis membongkar tampilan pengontrol saat tidak terlihat. Pengembang hanya perlu mendeklarasikan semua referensi ke tampilan sebagai weak, agar ARC dapat membebaskan memori dengan benar saat menerima peringatan dari sistem.

Transisi antar pengontrol

UIKit mendukung dua jenis transisi: segue (melalui Storyboard) dan navigasi pemrograman melalui UINavigationController. Transisi pemrograman terlihat seperti ini: navigationController?.pushViewController(detailVC, animated: true). Dengan ini siklus hidup detailVC berjalan normal — viewDidLoad dipanggil sekali, viewWillAppear — setiap kali saat ditampilkan.

Auto Layout dan tata letak adaptif

Auto Layout — adalah sistem penentuan posisi elemen berdasarkan hubungan matematis (kendala). Alih-alih koordinat X dan Y yang tetap, pengembang menjelaskan aturan: “tombol berada di sebelah kanan label dengan jarak 16pt” atau “tampilan melebar selebar layar dengan margin 20pt kiri dan kanan”. Sistem menyelesaikan sistem persamaan yang dihasilkan saat runtime, menyesuaikan antarmuka dengan ukuran layar apa pun.

Kendala dapat diatur di Interface Builder (melalui drag-and-drop) atau secara pemrograman di Swift. Setiap kendala adalah instance dari kelas NSLayoutConstraint dengan parameter: firstItem, firstAttribute, relation, secondItem, secondAttribute, multiplier, constant. Kendala diaktifkan melalui isActive = true atau secara massal melalui NSLayoutConstraint.activate().

Safe Area dan Layout Margins

Dengan iPhone X (2017) Apple memperkenalkan Safe Area — area layar yang bebas dari notch, sudut membulat, dan indikator home bar. Kendala harus diikat ke view.safeAreaLayoutGuide, bukan ke view. Layout Margins menambahkan margin internal tampilan, secara default 8pt atau 16pt tergantung konteks. Penggunaan safeAreaLayoutGuide menjamin tampilan yang benar di semua generasi iPhone dan iPad.

Animasi kendala

Auto Layout mendukung animasi melalui perubahan konstanta kendala. Cukup perbarui constant kendala dan panggil UIView.animate dengan layoutIfNeeded di dalam blok animasi. Sistem dengan lancar menghitung ulang posisi semua tampilan dalam hierarki. Teknik ini digunakan untuk blok yang dapat diperluas, panel keyboard adaptif, dan perubahan orientasi layar.

Bekerja dengan tabel dan koleksi

UITableView dan UICollectionView — dua alat UIKit yang kuat untuk menampilkan daftar dan kisi. UITableView cocok untuk daftar vertikal dengan satu kolom (obrolan, pengaturan, feed berita). UICollectionView — untuk kisi, daftar horizontal, karusel, dan tata letak khusus (galeri, produk, kalender). Kedua kelas menggunakan pola delegasi untuk memisahkan data dan tampilan.

Sumber data adalah protokol UITableViewDataSource dengan metode wajib numberOfRowsInSection dan cellForRowAt. Delegat UITableViewDelegate memproses ketukan sel, tinggi baris, dan peristiwa gulir. Mekanisme reuse identifier menggunakan kembali sel yang telah keluar dari layar, yang sangat penting untuk kinerja pada daftar besar.

class ContactsViewController: UITableViewController {

    private let contacts = ["Anna", "Boris", "Viktor"]

    override func viewDidLoad() {
        super.viewDidLoad()
        tableView.register(UITableViewCell.self,
                           forCellReuseIdentifier: "cell")
    }

    override func tableView(_ tableView: UITableView,
                          numberOfRowsInSection section: Int) -> Int {
        return contacts.count
    }

    override func tableView(_ tableView: UITableView,
                          cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell",
                                                 for: indexPath)
        var content = cell.defaultContentConfiguration()
        content.text = contacts[indexPath.row]
        cell.contentConfiguration = content
        return cell
    }
}

Contoh menunjukkan pengontrol minimal untuk menampilkan array string. Sel dikonfigurasi melalui UIListContentConfiguration — API modern (iOS 14+) yang menggantikan textLabel dan detailTextLabel yang usang. Pendaftaran kelas sel di viewDidLoad wajib dilakukan, jika tidak aplikasi akan crash dengan pengecualian saat runtime.

UICollectionView dan Compositional Layout

Mulai iOS 13, Apple merekomendasikan UICollectionViewCompositionalLayout untuk membangun tata letak yang kompleks. Pengembang mendeskripsikan bagian, grup, elemen, dan ukurannya secara deklaratif — mendapatkan kisi dengan geometri arbitrer: pita, kisi 2x2, karusel, ornamen. Compositional Layout telah menggantikan UICollectionViewFlowLayout yang usang di semua proyek baru. Dalam kombinasi dengan DiffableDataSource, pembaruan koleksi direduksi menjadi satu panggilan apply(snapshot), dan animasi perubahan dilakukan secara otomatis.

Contoh kode di Swift

Di bawah ini adalah dua contoh praktis penggunaan UIKit dalam tugas nyata: membuat tampilan khusus dengan bayangan dan pembulatan, serta menangani gestur geser untuk menghapus elemen dari daftar.

extension UIView {
    func applyCardStyle() {
        layer.cornerRadius = 12
        layer.shadowOpacity = 0.15
        layer.shadowRadius = 8
        layer.shadowOffset = CGSize(width: 0, height: 2)
        layer.masksToBounds = false
    }
}

@objc private func handleSwipe(_ gesture: UISwipeGestureRecognizer) {
    guard let swipedView = gesture.view else { return }
    UIView.animate(withDuration: 0.3) {
        swipedView.alpha = 0
        swipedView.transform = CGAffineTransform(translationX: 300, y: 0)
    } completion: { _ in
        swipedView.removeFromSuperview()
    }
}

Ekstensi applyCardStyle menambahkan bayangan dan pembulatan ke tampilan apa pun — berguna untuk kartu produk, profil, dan pemberitahuan. Metode handleSwipe dengan animasi menghapus elemen jika pengguna menggeser ke kanan. Penangan ditambahkan ke tampilan melalui addGestureRecognizer dengan konfigurasi UISwipeGestureRecognizer(direction: .right). Pengaturan masksToBounds = false penting agar bayangan tidak terpotong oleh batas tampilan.

Untuk antarmuka yang lebih kompleks, gunakan UIStackView — wadah yang secara otomatis mendistribusikan tampilan bersarang secara horizontal atau vertikal. Stack View menyederhanakan tata letak: tidak perlu mengatur kendala untuk setiap elemen, satu kendala untuk stack itu sendiri sudah cukup.