Watch App: wat is het, ontwikkeling voor Apple Watch en Wear OS

Wat is Watch App

Watch App — is een applicatie ontworpen voor gebruik op draagbare apparaten: Apple Watch (watchOS) en smartwatches op Wear OS. Het belangrijkste verschil met een mobiele app — de vormfactor. Het scherm van het horloge heeft een diagonaal van 1.5–2 inch (tegenover 6–7 inch bij een smartphone), wat de hoeveelheid tegelijkertijd weergegeven informatie beperkt. De interactie met de app is kort — de gebruiker checkt de tijd, melding, hartslag of stappen in 5–15 seconden en laat dan zijn arm zakken.

Belangrijkste scenario's voor Watch App: fitnesstracker (stappen, hartslag, calorieën, slaap), meldingen (berichten, oproepen, agenda), snelle acties (timer starten, spraakantwoord op bericht, muziek bedienen), companion (afstandsbediening voor camera, autosleutels, NFC-betaling). Volgens Counterpoint Research (2026) overschrijdt de wereldwijde smartwatchmarkt 150 miljoen apparaten per jaar, waarvan Apple Watch 35% inneemt, Wear OS — 20%, de rest — Fitbit, Garmin en anderen.

Beperkingen van Watch App: klein scherm (tot 2 inch), beperkte batterijduur (tot 18–24 uur), geen volledig toetsenbord (alleen spraakinvoer of dicteren), limiet voor achtergrondtaken (watchOS — tot 10 minuten, Wear OS — tot 5 minuten), noodzaak tot synchronisatie met telefoon voor de meeste functies. Vanaf watchOS 6 (2019) en Wear OS 3 (2022) kunnen apps autonoom werken via de LTE-module zonder koppeling met een telefoon.

Apple Watch: watchOS en SwiftUI

watchOS — het besturingssysteem van Apple voor smartwatches, gebaseerd op iOS en gebruikmakend van dezelfde frameworks (Foundation, UIKit in aangepaste versie, SwiftUI). Ontwikkeling gebeurt in Xcode in Swift. Het belangrijkste UI-framework — SwiftUI, dat watchOS-specifieke componenten biedt: TabView met carrousel, NavigationStack, digitale kroon (Digital Crown) via DigitalCrownModifier, lang indrukmenu.

Navigatie op watchOS is gebaseerd op een hiërarchisch paradigma. Belangrijkste elementen: hiërarchische stack (NavigationStack met automatische terugkeer), modale presentaties (sheet), paginagebaseerde navigatie (page-based via TabView met .tabViewStyle(.page)), contextmenu's bij lang indrukken. Digital Crown maakt scrollen en het wijzigen van waarden mogelijk. Gebaren: tik, lang indrukken, vegen, Force Touch (tot watchOS 7), draaien van Digital Crown.

Belangrijkste watchOS-frameworks: HealthKit (toegang tot gezondheidsgegevens — hartslag, stappen, slaap, ECG), CoreMotion (accelerometer, gyroscoop), WatchConnectivity (gegevensuitwisseling met iPhone), ClockKit (complicaties op de wijzerplaat), BackgroundTasks (achtergrondupdates tot 10 minuten), ARKit (FaceTime met effecten op Series 9+). Watch App kan volwaardig (aparte app in het dock) of extensie (tegelijk met iOS-versie) zijn.

Wear OS: Kotlin en Compose

Wear OS — Google's platform voor smartwatches, gebaseerd op Android. Moderne ontwikkeling gebeurt in Kotlin met Jetpack Compose for Wear OS — een set componenten geoptimaliseerd voor ronde schermen: Scaffold, ScalingLazyColumn, Chip, Button, Card, Stepper. In tegenstelling tot mobiele Compose gebruikt Wear OS eigen modifiers: scrollable voor verticaal scrollen, swipable voor vegen, RotaryInput voor bediening van de kroon.

Navigatie op Wear OS gebruikt een zijpaneel (SwipeToDismiss) en kaartschermen. Belangrijkste elementen: SwipeDismissableNavHost (navigatie met terugkeer door vegen), positionering van schermen (ScalingLazyColumn voor lijsten), horizontale carrousel (Carousel), wijzerplaat (WatchFace via WatchFaceService). Google raadt aan om zijwaarts vegen te gebruiken voor terugkeer en verticaal scrollen voor lijsten. De aan/uit-knop op het horloge opent de lijst met recente apps.

Gezondheid en sensoren op Wear OS: Health Services API (stappen, hartslag, calorieën, slaap, SpO2 via gegevensleveranciers), SensorManager (accelerometer, gyroscoop, barometer, magnetometer), Location Services (GPS via FusedLocationProvider). Wear OS 5+ ondersteunt het volgen van hardlopen, wandelen, fietsen en zwemmen met automatische detectie van het activiteitstype. Gegevens worden gesynchroniseerd met Google Fit via Health Connect.

Codevoorbeeld: Swift voor Apple Watch

Laten we een app voor het volgen van de hartslag op Apple Watch bekijken met behulp van SwiftUI en HealthKit.

import SwiftUI
import HealthKit

// Gegevensmodel voor hartslag
struct HeartRateData: Identifiable {
    let id = UUID()
    let bpm: Double
    let date: Date
}

// ViewModel voor HealthKit
@Observable
final class HealthViewModel {
    private let healthStore = HKHealthStore()
    var currentHeartRate: Double = 0
    var isAuthorized: Bool = false

    func requestAuthorization() {
        guard let heartRateType = HKQuantityType.quantityType(forIdentifier: .heartRate)
        else { return }
        let types = Set([heartRateType])
        healthStore.requestAuthorization(toShare: nil, read: types) { success, _ in
            Task { @MainActor in
                self.isAuthorized = success
                if success { self.startHeartRateQuery() }
            }
        }
    }

    func startHeartRateQuery() {
        guard let heartRateType = HKQuantityType.quantityType(forIdentifier: .heartRate)
        else { return }
        let query = HKObserverQuery(
            sampleType: heartRateType, predicate: nil
        ) { [weak self] _, _, _ in
            self?.fetchLatestHeartRate()
        }
        healthStore.execute(query)
    }

    private func fetchLatestHeartRate() {
        guard let heartRateType = HKQuantityType.quantityType(forIdentifier: .heartRate)
        else { return }
        let sort = NSSortDescriptor(key: HKSampleSortIdentifierStartDate, ascending: false)
        let query = HKSampleQuery(
            sampleType: heartRateType, predicate: nil,
            limit: 1, sortDescriptors: [sort]
        ) { _, samples, _ in
            guard let sample = samples?.first as? HKQuantitySample else { return }
            let bpm = sample.quantity.doubleValue(for: HKUnit.count().unitDivided(by: .minute()))
            Task { @MainActor in
                self.currentHeartRate = bpm
            }
        }
        healthStore.execute(query)
    }
}

// Hoofdscherm
struct HeartRateView: View {
    @State private var viewModel = HealthViewModel()

    var body: some View {
        VStack {
            Image(systemName: "heart.fill")
                .foregroundColor(.red)
                .font(.largeTitle)

            Text("\(Int(viewModel.currentHeartRate))")
                .font(.system(size: 60, weight: .bold, design: .rounded))
                .foregroundColor(.red)

            Text("BPM")
                .font(.caption)
                .foregroundColor(.secondary)
        }
        .padding()
        .onAppear(perform: viewModel.requestAuthorization)
    }
}

Belangrijke punten: HKHealthStore vraagt toegang tot HealthKit-gegevens; HKObserverQuery meldt veranderingen in hartslag in realtime; HKSampleQuery haalt de laatste waarde op. Watch App werkt automatisch de UI bij bij wijziging van currentHeartRate dankzij @Observable. HealthKit verwerkt gegevens lokaal op het apparaat — serververzoeken zijn niet nodig.

Codevoorbeeld: Kotlin voor Wear OS

Een vergelijkbare app voor Wear OS in Kotlin met Jetpack Compose en Health Services API.

// MainActivity.kt
import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.*
import androidx.wear.compose.material.*
import androidx.wear.compose.foundation.arc.BasicArcParams
import com.google.android.horologist.health.HealthService

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            WearAppTheme {
                HeartRateScreen()
            }
        }
    }
}

@Composable
fun HeartRateScreen() {
    var heartRate by remember { mutableIntStateOf(0) }
    var isConnected by remember { mutableStateOf(false) }

    LaunchedEffect(Unit) {
        // HealthService — API voor toegang tot sensoren
        val healthService = HealthService()
        healthService.connect().onSuccess {
            isConnected = true
        }
    }

    Scaffold(
        timeText = { TimeText() },
        vignette = { Vignette(vignettePosition = VignettePosition.TopAndBottom) }
    ) {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .scrollable(state = ScrollState),
            horizontalAlignment = Alignment.CenterHorizontally,
            verticalArrangement = Arrangement.Center
        ) {
            Icon(
                imageVector = Icons.Filled.Favorite,
                contentDescription = "Hartslag",
                modifier = Modifier.size(40.dp),
                tint = MaterialTheme.colors.error
            )

            Text(
                text = heartRate.toString(),
                style = MaterialTheme.typography.display1
            )
            Text(
                text = "BPM",
                style = MaterialTheme.typography.caption2
            )
        }
    }
}

Belangrijke Wear OS-componenten: Scaffold met TimeText en Vignette voor typische lay-out; .scrollable() modifier voor compatibiliteit met rond scherm; HealthService (Horologist) voor toegang tot hartslagsensoren. Jetpack Compose for Wear OS past de interface automatisch aan voor ronde en vierkante schermen — de ontwikkelaar hoeft verschillende vormfactoren niet handmatig te behandelen.