Skip to main content

Face-Tracking Overlay mit ARKit

Beschreibung

Diese View integriert eine ARKit-gestützte Gesichtserkennung in SwiftUI. Über ARSCNView und eine ARFaceTrackingConfiguration wird das Gesicht des Nutzers verfolgt und ein 3D-Symbol (eine kleine Sphäre) überlagert, das an der Position des Ankers angezeigt wird.

🔍 Zweck

  • Erstellung von AR-Apps mit Gesichtserkennung
  • Overlay von virtuellen Objekten auf das Gesicht des Nutzers
  • Prototyping für AR-Filter oder Masken
  • Visualisierung von Face-Tracking-Daten in Echtzeit
  • Entwicklung von AR-basierten Interaktionskonzepten

🖥️ Betriebssystem

iOS

📄 Codebeispiel

import SwiftUI
import ARKit
import RealityKit

@main
struct FaceTrackingApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

// Representable wrapper to use ARSCNView inside SwiftUI
struct FaceTrackingOverlay: UIViewRepresentable {
    func makeUIView(context: Context) -> ARSCNView {
        let view = ARSCNView()
        // Configure ARKit to use face tracking
        let config = ARFaceTrackingConfiguration()
        view.session.run(config)
        view.delegate = context.coordinator
        return view
    }

    func updateUIView(_ uiView: ARSCNView, context: Context) {
        // No update logic needed for this simple example
    }

    func makeCoordinator() -> Coordinator {
        Coordinator()
    }

    // Coordinator serves as ARSCNViewDelegate
    class Coordinator: NSObject, ARSCNViewDelegate {
        func renderer(_ renderer: SCNSceneRenderer, nodeFor anchor: ARAnchor) -> SCNNode? {
            // Create a node to represent detected face anchor
            let node = SCNNode()
            
            // Add a small sphere slightly in front of the anchor
            let sphere = SCNNode(geometry: SCNSphere(radius: 0.01))
            sphere.position = SCNVector3(0, 0, 0.1)
            node.addChildNode(sphere)
            
            return node
        }
    }
}

struct ContentView: View {
    var body: some View {
        FaceTrackingOverlay()
            .edgesIgnoringSafeArea(.all)
    }
}

// Modern Swift 5.10+ preview syntax
#Preview {
    ContentView()
}