feat: base setup for carplay

This commit is contained in:
Lei Nelissen
2025-05-24 17:41:28 +02:00
parent eb45169060
commit da9653cfe8
12 changed files with 207 additions and 59 deletions

View File

@@ -1,48 +0,0 @@
import UIKit
import React
import React_RCTAppDelegate
import ReactAppDependencyProvider
@main
class AppDelegate: UIResponder, UIApplicationDelegate {
var window: UIWindow?
var reactNativeDelegate: ReactNativeDelegate?
var reactNativeFactory: RCTReactNativeFactory?
func application(
_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil
) -> Bool {
let delegate = ReactNativeDelegate()
let factory = RCTReactNativeFactory(delegate: delegate)
delegate.dependencyProvider = RCTAppDependencyProvider()
reactNativeDelegate = delegate
reactNativeFactory = factory
window = UIWindow(frame: UIScreen.main.bounds)
factory.startReactNative(
withModuleName: "Fintunes",
in: window,
launchOptions: launchOptions
)
return true
}
}
class ReactNativeDelegate: RCTDefaultReactNativeFactoryDelegate {
override func sourceURL(for bridge: RCTBridge) -> URL? {
self.bundleURL()
}
override func bundleURL() -> URL? {
#if DEBUG
RCTBundleURLProvider.sharedSettings().jsBundleURL(forBundleRoot: "index")
#else
Bundle.main.url(forResource: "main", withExtension: "jsbundle")
#endif
}
}

View File

@@ -13,7 +13,9 @@
4C04FC6E055249ABB204D3BC /* Inter-VariableFont_slnt,wght.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 4B4A0465FF364579B28CF5D7 /* Inter-VariableFont_slnt,wght.ttf */; };
AB393FCA2857CC8400773469 /* SnapshotHelper.swift in Sources */ = {isa = PBXBuildFile; fileRef = AB393FC92857CC8400773469 /* SnapshotHelper.swift */; };
AB4A8DFE2857C8DA005A1ED0 /* FintunesUITests.swift in Sources */ = {isa = PBXBuildFile; fileRef = AB4A8DFD2857C8DA005A1ED0 /* FintunesUITests.swift */; };
AB7AA5F92DC8E5D600578CAC /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = AB7AA5F82DC8E5D600578CAC /* AppDelegate.swift */; };
ABB40BB92DE211A6002112FC /* PhoneSceneDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = ABB40BB82DE211A6002112FC /* PhoneSceneDelegate.swift */; };
ABB40BBA2DE211A6002112FC /* CarSceneDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = ABB40BB72DE211A6002112FC /* CarSceneDelegate.swift */; };
ABB40BBC2DE2137E002112FC /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = ABB40BBB2DE2137E002112FC /* AppDelegate.swift */; };
FA01635F2599C28FC19F2EC3 /* PrivacyInfo.xcprivacy in Resources */ = {isa = PBXBuildFile; fileRef = 3896494129CBC30258D9BB1C /* PrivacyInfo.xcprivacy */; };
/* End PBXBuildFile section */
@@ -40,7 +42,10 @@
AB393FC92857CC8400773469 /* SnapshotHelper.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = SnapshotHelper.swift; sourceTree = "<group>"; };
AB4A8DFB2857C8DA005A1ED0 /* FintunesUITests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = FintunesUITests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
AB4A8DFD2857C8DA005A1ED0 /* FintunesUITests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = FintunesUITests.swift; sourceTree = "<group>"; };
AB7AA5F82DC8E5D600578CAC /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = "<group>"; };
ABB40BB42DE20F50002112FC /* Fintunes-Bridging-Header.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; name = "Fintunes-Bridging-Header.h"; path = "Fintunes/Fintunes-Bridging-Header.h"; sourceTree = "<group>"; };
ABB40BB72DE211A6002112FC /* CarSceneDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = CarSceneDelegate.swift; path = Fintunes/CarSceneDelegate.swift; sourceTree = "<group>"; };
ABB40BB82DE211A6002112FC /* PhoneSceneDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = PhoneSceneDelegate.swift; path = Fintunes/PhoneSceneDelegate.swift; sourceTree = "<group>"; };
ABB40BBB2DE2137E002112FC /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = AppDelegate.swift; path = Fintunes/AppDelegate.swift; sourceTree = "<group>"; };
E22EC545298DA9F9017776C0 /* libPods-Fintunes.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-Fintunes.a"; sourceTree = BUILT_PRODUCTS_DIR; };
ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
ED2971642150620600B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = Platforms/AppleTVOS.platform/Developer/SDKs/AppleTVOS12.0.sdk/System/Library/Frameworks/JavaScriptCore.framework; sourceTree = DEVELOPER_DIR; };
@@ -68,7 +73,10 @@
13B07FAE1A68108700A75B9A /* Fintunes */ = {
isa = PBXGroup;
children = (
AB7AA5F82DC8E5D600578CAC /* AppDelegate.swift */,
ABB40BBB2DE2137E002112FC /* AppDelegate.swift */,
ABB40BB72DE211A6002112FC /* CarSceneDelegate.swift */,
ABB40BB82DE211A6002112FC /* PhoneSceneDelegate.swift */,
ABB40BB42DE20F50002112FC /* Fintunes-Bridging-Header.h */,
13B07FB51A68108700A75B9A /* Images.xcassets */,
13B07FB61A68108700A75B9A /* Info.plist */,
13B07FB11A68108700A75B9A /* LaunchScreen.xib */,
@@ -348,7 +356,9 @@
isa = PBXSourcesBuildPhase;
buildActionMask = 2147483647;
files = (
AB7AA5F92DC8E5D600578CAC /* AppDelegate.swift in Sources */,
ABB40BBC2DE2137E002112FC /* AppDelegate.swift in Sources */,
ABB40BB92DE211A6002112FC /* PhoneSceneDelegate.swift in Sources */,
ABB40BBA2DE211A6002112FC /* CarSceneDelegate.swift in Sources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
@@ -414,6 +424,7 @@
PRODUCT_BUNDLE_IDENTIFIER = nl.moeilijkedingen.jellyfinaudioplayer;
PRODUCT_NAME = Fintunes;
PROVISIONING_PROFILE_SPECIFIER = "";
SWIFT_OBJC_BRIDGING_HEADER = "Fintunes/Fintunes-Bridging-Header.h";
SWIFT_OPTIMIZATION_LEVEL = "-Onone";
SWIFT_VERSION = 5.0;
VERSIONING_SYSTEM = "apple-generic";
@@ -449,6 +460,7 @@
PROVISIONING_PROFILE = "915c5213-22f6-4f9d-8065-2a06300f9bfb";
PROVISIONING_PROFILE_SPECIFIER = "";
"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "nl.moeilijkedingen.jellyfinaudioplayer AppStore";
SWIFT_OBJC_BRIDGING_HEADER = "Fintunes/Fintunes-Bridging-Header.h";
SWIFT_VERSION = 5.0;
VERSIONING_SYSTEM = "apple-generic";
};

View File

@@ -1,19 +1,20 @@
import UIKit
import CarPlay
import React
import React_RCTAppDelegate
import ReactAppDependencyProvider
@main
class AppDelegate: UIResponder, UIApplicationDelegate {
var window: UIWindow?
var reactNativeDelegate: ReactNativeDelegate?
var reactNativeFactory: RCTReactNativeFactory?
func application(
_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil
) -> Bool {
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil) -> Bool {
let delegate = ReactNativeDelegate()
let factory = RCTReactNativeFactory(delegate: delegate)
delegate.dependencyProvider = RCTAppDependencyProvider()
@@ -31,6 +32,21 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
return true
}
func application(_ application: UIApplication, configurationForConnecting connectingSceneSession: UISceneSession, options: UIScene.ConnectionOptions) -> UISceneConfiguration {
if (connectingSceneSession.role == UISceneSession.Role.carTemplateApplication) {
let scene = UISceneConfiguration(name: "CarPlay", sessionRole: connectingSceneSession.role)
scene.delegateClass = CarSceneDelegate.self
return scene
} else {
let scene = UISceneConfiguration(name: "Phone", sessionRole: connectingSceneSession.role)
scene.delegateClass = PhoneSceneDelegate.self
return scene
}
}
func application(_ application: UIApplication, didDiscardSceneSessions sceneSessions: Set<UISceneSession>) {
}
}
class ReactNativeDelegate: RCTDefaultReactNativeFactoryDelegate {

View File

@@ -0,0 +1,17 @@
import CarPlay
class CarSceneDelegate: UIResponder, CPTemplateApplicationSceneDelegate {
func templateApplicationScene(_ templateApplicationScene: CPTemplateApplicationScene, didConnect interfaceController: CPInterfaceController) {
print("CarPlay: Scene did connect")
print("CarPlay: About to connect to RNCarPlay")
// Dispatch connect to RNCarPlay
RNCarPlay.connect(with: interfaceController, window: templateApplicationScene.carWindow)
print("CarPlay: RNCarPlay.connect called")
}
func templateApplicationScene(_ templateApplicationScene: CPTemplateApplicationScene, didDisconnect interfaceController: CPInterfaceController) {
print("CarPlay: Scene did disconnect")
// Dispatch disconnect to RNCarPlay
RNCarPlay.disconnect()
}
}

View File

@@ -0,0 +1 @@
#import "RNCarPlay.h"

View File

@@ -60,5 +60,41 @@
<true/>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
<key>UIApplicationSceneManifest</key>
<dict>
<key>UIApplicationSupportsMultipleScenes</key>
<true/>
<key>UISceneConfigurations</key>
<dict>
<key>CPTemplateApplicationSceneSessionRoleApplication</key>
<array>
<dict>
<key>UISceneClassName</key>
<string>CPTemplateApplicationScene</string>
<key>UISceneConfigurationName</key>
<string>CarPlay</string>
<key>UISceneDelegateClassName</key>
<string>$(PRODUCT_MODULE_NAME).CarSceneDelegate</string>
</dict>
</array>
<key>UIWindowSceneSessionRoleApplication</key>
<array>
<dict>
<key>UISceneClassName</key>
<string>UIWindowScene</string>
<key>UISceneConfigurationName</key>
<string>Phone</string>
<key>UISceneDelegateClassName</key>
<string>$(PRODUCT_MODULE_NAME).PhoneSceneDelegate</string>
</dict>
</array>
</dict>
</dict>
<key>CPApplicationIdentifier</key>
<string>nl.moeilijkedingen.fintunes.carplay</string>
<key>CPApplicationName</key>
<string>Fintunes</string>
<key>CPApplicationCategory</key>
<string>CPApplicationCategoryAudio</string>
</dict>
</plist>

View File

@@ -0,0 +1,24 @@
import UIKit
import React
class PhoneSceneDelegate: UIResponder, UIWindowSceneDelegate {
var window: UIWindow?
func scene(
_ scene: UIScene, willConnectTo session: UISceneSession,
options connectionOptions: UIScene.ConnectionOptions
) {
guard let appDelegate = UIApplication.shared.delegate as? AppDelegate else { return }
guard let windowScene = scene as? UIWindowScene else { return }
guard let appRootView = appDelegate.window?.rootViewController?.view else { return }
let containerViewController = UIViewController()
containerViewController.view.addSubview(appRootView)
appRootView.frame = containerViewController.view.bounds
let window = UIWindow(windowScene: windowScene)
window.rootViewController = containerViewController
self.window = window
window.makeKeyAndVisible()
}
}

View File

@@ -1399,6 +1399,8 @@ PODS:
- ReactCommon/turbomodule/bridging
- ReactCommon/turbomodule/core
- Yoga
- react-native-carplay (2.4.1-beta.0):
- React
- react-native-netinfo (11.4.1):
- React-Core
- react-native-safe-area-context (5.4.0):
@@ -2310,6 +2312,7 @@ DEPENDENCIES:
- React-microtasksnativemodule (from `../node_modules/react-native/ReactCommon/react/nativemodule/microtasks`)
- react-native-accessibility-settings (from `../node_modules/react-native-accessibility-settings`)
- "react-native-blur (from `../node_modules/@react-native-community/blur`)"
- react-native-carplay (from `../node_modules/react-native-carplay`)
- "react-native-netinfo (from `../node_modules/@react-native-community/netinfo`)"
- react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
- "react-native-skia (from `../node_modules/@shopify/react-native-skia`)"
@@ -2455,6 +2458,8 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native-accessibility-settings"
react-native-blur:
:path: "../node_modules/@react-native-community/blur"
react-native-carplay:
:path: "../node_modules/react-native-carplay"
react-native-netinfo:
:path: "../node_modules/@react-native-community/netinfo"
react-native-safe-area-context:
@@ -2597,6 +2602,7 @@ SPEC CHECKSUMS:
React-microtasksnativemodule: 054f34e9b82f02bd40f09cebd4083828b5b2beb6
react-native-accessibility-settings: 87f2276eb146ed5656bef2073e0c077e94a83f88
react-native-blur: 06d0f9906ecd6cde3a42de16c6cd829a2bf0710c
react-native-carplay: 8f388f6f73e5e0f73ed154ad8794371343ee20c0
react-native-netinfo: cec9c4e86083cb5b6aba0e0711f563e2fbbff187
react-native-safe-area-context: 562163222d999b79a51577eda2ea8ad2c32b4d06
react-native-skia: 2f725d0747756d57f0a51417c91e33bc42272c56
@@ -2654,4 +2660,4 @@ SPEC CHECKSUMS:
PODFILE CHECKSUM: eb809ce42bd87a82dedb7b209e4bec32e9be4528
COCOAPODS: 1.15.2
COCOAPODS: 1.16.2

View File

@@ -35,6 +35,7 @@
"react-airplay": "^1.2.0",
"react-native": "^0.79.2",
"react-native-accessibility-settings": "^0.1.2",
"react-native-carplay": "2.4.1-beta.0",
"react-native-collapsible": "^1.6.2",
"react-native-dotenv": "^3.4.11",
"react-native-fs": "^2.20.0",

19
pnpm-lock.yaml generated
View File

@@ -88,6 +88,9 @@ importers:
react-native-accessibility-settings:
specifier: ^0.1.2
version: 0.1.2(react-native@0.79.2(@babel/core@7.27.1)(@react-native-community/cli@18.0.0(typescript@5.8.3))(@types/react@18.3.20)(react@19.0.0))(react@19.0.0)
react-native-carplay:
specifier: 2.4.1-beta.0
version: 2.4.1-beta.0(react-native@0.79.2(@babel/core@7.27.1)(@react-native-community/cli@18.0.0(typescript@5.8.3))(@types/react@18.3.20)(react@19.0.0))(react@19.0.0)
react-native-collapsible:
specifier: ^1.6.2
version: 1.6.2(react-native@0.79.2(@babel/core@7.27.1)(@react-native-community/cli@18.0.0(typescript@5.8.3))(@types/react@18.3.20)(react@19.0.0))(react@19.0.0)
@@ -3829,6 +3832,17 @@ packages:
react: '*'
react-native: '*'
react-native-carplay@2.4.1-beta.0:
resolution: {integrity: sha512-tYJymLgJi+0516niv4ApGVC+VgENX/uCYqCX81tewSILWnS6KR7M0A9+bHyNk8xoheFyYGruX7onYxU2U8ykPA==}
peerDependencies:
react: ^17.0.2 || ^18.0.0
react-native: ^0.60.0
peerDependenciesMeta:
react:
optional: true
react-native:
optional: true
react-native-collapsible@1.6.2:
resolution: {integrity: sha512-MCOBVJWqHNjnDaGkvxX997VONmJeebh6wyJxnHEgg0L1PrlcXU1e/bo6eK+CDVFuMrCafw8Qh4DOv/C4V/+Iew==}
peerDependencies:
@@ -9366,6 +9380,11 @@ snapshots:
react: 19.0.0
react-native: 0.79.2(@babel/core@7.27.1)(@react-native-community/cli@18.0.0(typescript@5.8.3))(@types/react@18.3.20)(react@19.0.0)
react-native-carplay@2.4.1-beta.0(react-native@0.79.2(@babel/core@7.27.1)(@react-native-community/cli@18.0.0(typescript@5.8.3))(@types/react@18.3.20)(react@19.0.0))(react@19.0.0):
optionalDependencies:
react: 19.0.0
react-native: 0.79.2(@babel/core@7.27.1)(@react-native-community/cli@18.0.0(typescript@5.8.3))(@types/react@18.3.20)(react@19.0.0)
react-native-collapsible@1.6.2(react-native@0.79.2(@babel/core@7.27.1)(@react-native-community/cli@18.0.0(typescript@5.8.3))(@types/react@18.3.20)(react@19.0.0))(react@19.0.0):
dependencies:
react: 19.0.0

View File

@@ -12,6 +12,7 @@ import {
import { ColorSchemeProvider, themes, useUserOrSystemScheme } from './Colors';
import DownloadManager from './DownloadManager';
import AppLoading from './AppLoading';
import CarPlayScreen from '@/screens/carplay';
const LightTheme = {
...DefaultTheme,
@@ -84,6 +85,7 @@ export default function App(): JSX.Element | null {
<ThemedNavigationContainer>
<Routes />
<DownloadManager />
<CarPlayScreen />
</ThemedNavigationContainer>
</ColorSchemeProvider>
</PersistGate>

View File

@@ -0,0 +1,62 @@
import React, { useEffect } from 'react';
import { View, Text } from 'react-native';
import { CarPlay, ListTemplate, ListItem } from 'react-native-carplay';
const CarPlayScreen: React.FC = () => {
useEffect(() => {
console.log('CarPlay: Screen mounted');
const onConnect = () => {
console.log('CarPlay: React Native connected');
// Create a list template with some items
const template = new ListTemplate({
title: 'Fintunes',
sections: [
{
header: 'Library',
items: [
{
text: 'Songs',
detailText: 'Browse your music library',
},
{
text: 'Albums',
detailText: 'Browse your albums',
},
{
text: 'Artists',
detailText: 'Browse your artists',
},
],
},
],
onItemSelect: (item) => {
console.log('Selected item:', item);
},
});
// Set the template as root
CarPlay.setRootTemplate(template);
};
const onDisconnect = () => {
console.log('CarPlay: React Native disconnected');
};
// Register for CarPlay connection events
CarPlay.registerOnConnect(onConnect);
CarPlay.registerOnDisconnect(onDisconnect);
return () => {
console.log('CarPlay: Screen unmounting');
// Cleanup listeners
CarPlay.unregisterOnConnect(onConnect);
CarPlay.unregisterOnDisconnect(onDisconnect);
};
}, []);
return null;
};
export default CarPlayScreen;