UIKit — wat is het, kernconcepten en architectuur

Wat is UIKit?

UIKit — is een framework van Apple dat klassen biedt voor het maken en beheren van de gebruikersinterface op iOS, iPadOS en macOS (via Mac Catalyst). Het werkt bovenop Core Animation, Core Graphics en Quartz Core, waarbij low-level rendering wordt geabstraheerd naar high-level objecten — knoppen, labels, afbeeldingen en containers. UIKit verscheen samen met iPhone OS 1 in 2007 en blijft het belangrijkste framework voor iOS-ontwikkeling naast SwiftUI.

Het framework volgt een imperatieve benadering: de ontwikkelaar maakt instanties van de klassen UIButton, UILabel, UIImageView, stelt hun eigenschappen in (kleur, lettertype, positie) en voegt ze toe aan de weergavehiërarchie via addSubview. Elke wijziging van de interface wordt expliciet uitgevoerd — geen magische updates achter de schermen. Dit onderscheidt UIKit van declaratieve frameworks zoals SwiftUI, waar een beschrijving van de toestand de interface automatisch opnieuw tekent.

Belangrijkste UIKit-klassen

Het framework bevat verschillende categorieën klassen. UIView — het basiselement waarvan alle visuele componenten overerven. UIWindow — de container op het hoogste niveau waardoor weergaven op het scherm worden getoond. UIViewController — de controller die een set weergaven beheert en reageert op schermrotaties, het verschijnen van het toetsenbord en systeemmeldingen. UIApplication — het ingangspunt dat aanraak- en knopgebeurtenissen verwerkt.

Voor tekst worden UILabel (statische tekst), UITextField (enkelregelige invoer), UITextView (meerregelige invoer) gebruikt. Voor knoppen — UIButton, inclusief systeem-, aangepaste en met SF Symbols-iconografie. Voor navigatie — UINavigationController, UITabBarController en UISplitViewController. In totaal bevat UIKit meer dan 200 openbare klassen.

UIKit-architectuur: lagen en weergavehiërarchie

De UIKit-architectuur is gebaseerd op lagen: elke laag is verantwoordelijk voor zijn eigen aspect van weergave. Op het laagste niveau bevindt zich Core Graphics — de rendering-engine voor paden, tekst en afbeeldingen. Daarboven — Core Animation, die de compositie van lagen (CALayer) en animaties tussen toestanden beheert. UIKit bouwt daar bovenop een objectgeoriënteerde API: UIView, UIViewController en UIResponder.

Elke applicatie heeft een weergavehiërarchie (view hierarchy) — een boom met UIWindow als wortel. Daaronder — de root UIViewController, zijn weergave en daarbinnen — geneste subviews. Aanraakgebeurtenissen verspreiden zich langs de responder chain-keten: van de meest geneste weergave naar ouders en verder naar UIApplication. Als geen enkel object de aanraking heeft verwerkt, wordt deze genegeerd.

UIView en CALayer

Elke UIView bevat een CALayer-laag die verantwoordelijk is voor het renderen van pixels op het scherm. De weergave beheert aanrakingen en toegankelijkheid, de laag — graphics: shadow, cornerRadius, border, transform. De scheiding maakt het mogelijk zware graphics naar een aparte thread (render server) te verplaatsen zonder de main thread te blokkeren. Apple raadt aan om direct met CALayer te werken als er meer dan 200 weergaven op het scherm nodig zijn — dit vermindert de CPU-belasting.

Responder Chain in detail

De responder-keten begint bij het object dat als eerste de aanraakgebeurtenis ontvangt. Als het de gebeurtenis niet verwerkt (methode touchesBegan is niet overschreven), wordt de gebeurtenis doorgegeven aan de volgende responder in de keten: next, superview, next responder, UIViewController, UIWindow, UIApplication, App Delegate. Dit maakt het mogelijk globale gebaren en toetsenbordgebeurtenissen op sceneniveau te onderscheppen zonder een handler aan elke weergave toe te voegen.

Levenscyclus van UIViewController

Elke UIViewController doorloopt een strikt gedefinieerde reeks gebeurtenissen. De levenscyclus omvat fasen: initialisatie, laden van de weergave, verschijnen op het scherm, bijwerken van de lay-out bij rotatie, verbergen, het scherm verlaten en geheugen vrijgeven. De ontwikkelaar overschrijft de overeenkomstige methoden om zijn code in elke fase uit te voeren.

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()
    }
}

In viewDidLoad wordt de interface geconfigureerd — subviews worden gemaakt, beperkingen worden ingesteld, delegaten worden geabonneerd. In viewWillAppear worden bewerkingen uitgevoerd vóór weergave: het laden van verse gegevens uit het netwerk, het bijwerken van waarden. viewDidDisappear — de plaats om meldingen op te zeggen en tijdelijke gegevens op te schonen. Het aanroepen van super is verplicht in alle overschrijvingen, anders wordt de gebeurtenisketen verbroken.

Geheugenbeheer en viewDidUnload

In oudere versies van iOS bestond de methode viewDidUnload, aangeroepen bij geheugengebrek. Vanaf iOS 6 is de methode verwijderd — nu verwijdert UIKit automatisch de weergaven van de controller wanneer ze niet zichtbaar zijn. De ontwikkelaar hoeft alleen alle verwijzingen naar weergaven als weak te declareren, zodat ARC het geheugen correct kan vrijgeven bij ontvangst van een waarschuwing van het systeem.

Overgangen tussen controllers

UIKit ondersteunt twee soorten overgangen: segue (via Storyboard) en programmatische navigatie via UINavigationController. Een programmatische overgang ziet er zo uit: navigationController?.pushViewController(detailVC, animated: true). Hierbij verloopt de levenscyclus van detailVC normaal — viewDidLoad wordt eenmaal aangeroepen, viewWillAppear — elke keer bij weergave.

Auto Layout en adaptieve lay-out

Auto Layout — is een systeem voor het positioneren van elementen op basis van wiskundige relaties (beperkingen). In plaats van vast ingestelde X- en Y-coördinaten beschrijft de ontwikkelaar regels: „de knop bevindt zich rechts van het label met een tussenruimte van 16pt” of „de weergave strekt zich uit over de breedte van het scherm met marges van 20pt links en rechts”. Het systeem lost het resulterende stelsel vergelijkingen in runtime op en past de interface aan elk schermformaat aan.

Beperkingen kunnen worden ingesteld in Interface Builder (via drag-and-drop) of programmatisch in Swift. Elke beperking is een instantie van de klasse NSLayoutConstraint met parameters: firstItem, firstAttribute, relation, secondItem, secondAttribute, multiplier, constant. Beperkingen worden geactiveerd via isActive = true of massaal via NSLayoutConstraint.activate().

Safe Area en Layout Margins

Met de iPhone X (2017) introduceerde Apple Safe Area — het schermgebied vrij van notch, afgeronde hoeken en de home bar-indicator. Beperkingen moeten worden gekoppeld aan view.safeAreaLayoutGuide, niet aan view. Layout Margins voegen interne marges van de weergave toe, standaard 8pt of 16pt afhankelijk van de context. Het gebruik van safeAreaLayoutGuide garandeert correcte weergave op alle generaties iPhone en iPad.

Animaties van beperkingen

Auto Layout ondersteunt animatie door het wijzigen van de constanten van beperkingen. Het volstaat om de constant van de beperking bij te werken en UIView.animate aan te roepen met layoutIfNeeded in het animatieblok. Het systeem herberekent soepel de positie van alle weergaven in de hiërarchie. Deze techniek wordt gebruikt voor uitklappende blokken, adaptieve toetsenbordpanelen en het wijzigen van de schermoriëntatie.

Werken met tabellen en collecties

UITableView en UICollectionView — twee krachtige UIKit-tools voor het weergeven van lijsten en rasters. UITableView is geschikt voor verticale lijsten met één kolom (chat, instellingen, nieuwsfeed). UICollectionView — voor rasters, horizontale lijsten, carrousels en aangepaste lay-outs (galerij, producten, kalender). Beide klassen gebruiken het delegatiepatroon om gegevens en uiterlijk te scheiden.

De gegevensbron is het protocol UITableViewDataSource met verplichte methoden numberOfRowsInSection en cellForRowAt. De delegatie UITableViewDelegate verwerkt celklikken, rijhoogte en scrolgebeurtenissen. Het reuse identifier-mechanisme hergebruikt cellen die buiten het scherm zijn verdwenen, wat cruciaal is voor prestaties op grote lijsten.

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
    }
}

Het voorbeeld toont een minimale controller voor het weergeven van een reeks strings. De cel wordt geconfigureerd via UIListContentConfiguration — een moderne API (iOS 14+) die de verouderde textLabel en detailTextLabel heeft vervangen. Registratie van de celklasse in viewDidLoad is verplicht, anders crasht de applicatie met een uitzondering in runtime.

UICollectionView en Compositional Layout

Vanaf iOS 13 raadt Apple UICollectionViewCompositionalLayout aan voor het bouwen van complexe lay-outs. De ontwikkelaar beschrijft sectie, groep, element en hun afmetingen declaratief — hij krijgt een raster met willekeurige geometrie: band, 2x2-raster, carrousel, ornament. Compositional Layout heeft de verouderde UICollectionViewFlowLayout vervangen in alle nieuwe projecten. In combinatie met DiffableDataSource wordt het bijwerken van een collectie teruggebracht tot één aanroep apply(snapshot) en wordt de animatie van wijzigingen automatisch uitgevoerd.

Codevoorbeelden in Swift

Hieronder staan twee praktische voorbeelden van het gebruik van UIKit in echte taken: het maken van een aangepaste weergave met schaduw en afronding, en het verwerken van een veeggebaar om een element uit een lijst te verwijderen.

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()
    }
}

De extensie applyCardStyle voegt schaduw en afronding toe aan elke weergave — handig voor productkaarten, profielen en meldingen. De methode handleSwipe verwijdert met animatie het element als de gebruiker naar rechts heeft geveegd. De handler wordt aan de weergave toegevoegd via addGestureRecognizer met configuratie UISwipeGestureRecognizer(direction: .right). De instelling masksToBounds = false is belangrijk zodat de schaduw niet wordt afgesneden door de grenzen van de weergave.

Gebruik voor complexere interfaces UIStackView — een container die geneste weergaven automatisch horizontaal of verticaal verdeelt. Stack View vereenvoudigt de lay-out: het is niet nodig om beperkingen in te stellen voor elk element, één beperking voor de stack zelf is voldoende.