Support for SwiftUI with CarPlay – TripProgress UI not showing

[DrikABrak]

Hi,

Has anyone successfully implemented CarPlay support using SwiftUI?

I'm currently integrating Mapbox Navigation in a SwiftUI-based app. Everything works fine on iPhone, including the TripProgress UI (ETA, distance remaining, etc.), but on CarPlay, the same UI does not appear, even though navigation is active and routing works.

I'm using the CarPlayManager as documented, and CarPlay connects correctly (the delegate is set and invoked), but the trip summary elements are missing.

If anyone has experience or an example of integrating CarPlay with SwiftUI (even partially), I’d greatly appreciate your insight!

Even a minimal working SwiftUI example would be extremely helpful.

Thanks in advance

See screenshots.

[volkdmitri]

Hi @DrikABrak, thanks for reaching out! To better understand the context and reproduce the issue, would you be able to share a minimal example project that demonstrates your current setup?

[DrikABrak]

Hi @volkdmitri, thanks for your reply.
It's a complicated task to extract minimal code to test the CarPlay functionality of my project, but here are the main codes to launch the navigation that works on the iPhone but not on CarPlay.

MyApp

import SwiftUI
import SwiftData
import Firebase
import CarPlay
import MapboxNavigationCore
import MapboxNavigationUIKit

@main
struct MyApp: App {
    
    @UIApplicationDelegateAdaptor(AppDelegate.self) var appDelegate
    
    init() {
        FirebaseApp.configure()
    }

    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

@MainActor
var navigationProvider: MapboxNavigationProvider = {
    return MapboxNavigationProvider(coreConfig: .init())
}()

class AppDelegate: NSObject, UIApplicationDelegate {
    
    var _carPlayManager: Any? = nil
    var carPlayManager: CarPlayManager {
        if _carPlayManager == nil {
            _carPlayManager = CarPlayManager(navigationProvider: navigationProvider)
        }

        return _carPlayManager as! CarPlayManager
    }
    
    func application(_ application: UIApplication,
                     configurationForConnecting connectingSceneSession: UISceneSession,
                     options: UIScene.ConnectionOptions) -> UISceneConfiguration {

        if connectingSceneSession.role == .carTemplateApplication {
            let config = UISceneConfiguration(name: "CarPlayConfiguration", sessionRole: connectingSceneSession.role)
            config.delegateClass = CarPlaySceneDelegate.self
            config.sceneClass = CPTemplateApplicationScene.self
            return config
        }

        return UISceneConfiguration(name: "Default Configuration", sessionRole: connectingSceneSession.role)
    }
}

My CarPlaySceneDelegate

import UIKit
import CarPlay
import MapboxNavigationUIKit
import MapboxNavigationCore
import SwiftUI

class CarPlaySceneDelegate: UIResponder, CPTemplateApplicationSceneDelegate {
    
    @UIApplicationDelegateAdaptor(AppDelegate.self) var appDelegate

    func templateApplicationScene(
        _ templateApplicationScene: CPTemplateApplicationScene,
        didConnect interfaceController: CPInterfaceController,
        to window: CPWindow
    ) {
        print("[CarPlay] Connecté")

        appDelegate.carPlayManager.delegate = appDelegate
        appDelegate.carPlayManager.templateApplicationScene(
            templateApplicationScene,
            didConnectCarInterfaceController: interfaceController,
            to: window
        )
    }

    func templateApplicationScene(
        _ templateApplicationScene: CPTemplateApplicationScene,
        didDisconnect interfaceController: CPInterfaceController,
        from window: CPWindow
    ) {
        print("[CarPlay] Déconnecté")

        appDelegate.carPlayManager.delegate = nil

        appDelegate.carPlayManager.templateApplicationScene(
            templateApplicationScene,
            didDisconnectCarInterfaceController: interfaceController,
            from: window
        )
    }
}

Extension (maybe something missed here)

extension AppDelegate: CarPlayManagerDelegate {
    func carPlayManager(
        _ carPlayManager: MapboxNavigationUIKit.CarPlayManager,
        leadingNavigationBarButtonsCompatibleWith traitCollection: UITraitCollection,
        in carPlayTemplate: CPMapTemplate,
        for activity: MapboxNavigationUIKit.CarPlayActivity,
        cameraState: MapboxNavigationCore.NavigationCameraState
    ) -> [CPBarButton]? {
        return nil
    }

...
}

My NavigationViewController

struct MBNavigationViewController: UIViewControllerRepresentable {
    @ObservedObject var mapManager: MapManager
    @Binding var isPresented: Bool
    @UIApplicationDelegateAdaptor(AppDelegate.self) var appDelegate

    private var currentLocation: CLLocation? {
        navigationProvider.navigation().currentLocationMatching?.location
    }
    
    func makeUIViewController(context: Context) -> NavigationViewController {
        
        navigationProvider.apply(coreConfig: .init(
            locationSource: .simulation()
        ))
        
        let mapboxNavigation = navigationProvider.mapboxNavigation
        
        let navigationOptions = NavigationOptions(
            mapboxNavigation: mapboxNavigation,
            voiceController: navigationProvider.routeVoiceController,
            eventsManager: navigationProvider.eventsManager()
        )
        
        let navigationViewController = NavigationViewController(
            navigationRoutes: mapManager.currentNavigationRoutes!,
            navigationOptions: navigationOptions
        )
        
        navigationViewController.delegate = context.coordinator
        navigationViewController.routeLineTracksTraversal = true
        navigationViewController.floatingButtonsPosition = .topTrailing
        
        if let currentLocation, appDelegate.carPlayManager.currentActivity != .navigating {
            appDelegate.carPlayManager.beginNavigationWithCarPlay(using: currentLocation.coordinate)
        }
        
        return navigationViewController
    }

    func updateUIViewController(_ uiViewController: NavigationViewController, context: Context) {}

    func makeCoordinator() -> Coordinator {
        Coordinator(mapManager: mapManager, isPresented: $isPresented)
    }

    class Coordinator: NSObject, NavigationViewControllerDelegate {
        var mapManager: MapManager
        @Binding var isPresented: Bool

        init(mapManager: MapManager, isPresented: Binding<Bool>) {
            self.mapManager = mapManager
            self._isPresented = isPresented
        }

        func navigationViewControllerDidDismiss(_ navigationViewController: NavigationViewController, byCanceling canceled: Bool) {
            isPresented = false
        }
    }
}

I don't know if these snippets of code are enough to find the source of the problem, but if necessary, I can provide other codes.
Thanks.