Google Navigation SDK for React Native

When using AndroidAutoBaseScreen, the SDK automatically detects Navigation SDK prompts (like traffic or rerouting). To prevent these prompts from overlapping with your TravelEstimate in the NavigationTemplate, you should:

1. Override onPromptVisibilityChanged(boolean promptVisible) and call invalidate() to trigger a template refresh.
2. In onGetTemplate(), use isPromptVisible() to conditionally add the travel estimate to the builder.

This ensures the estimate is only displayed when no modal prompts are active.

@Override
protected void onPromptVisibilityChanged(boolean promptVisible) {
  invalidate();
}

@Override
public Template onGetTemplate() {
  NavigationTemplate.Builder builder = new NavigationTemplate.Builder();
  // Configure actions, map action strip, and navigation info.

  if (!isPromptVisible()) {
    builder.setDestinationTravelEstimate(travelEstimate);
  }

  return builder.build();
}

Use the setter functions returned by useNavigation() to handle navigation events. To remove a listener, pass null or undefined to the setter. Use removeAllListeners() during component unmounting to clean up all listeners.

Supported Event Setters

• setOnStartGuidance(listener: () => void)
• setOnArrival(listener: (event: { waypoint: Waypoint, isFinalDestination: boolean }) => void)
• setOnLocationChanged(listener: (event: { location: Location }) => void)
• setOnRawLocationChanged(listener: (event: { location: Location }) => void)
• setOnNavigationReady(listener: () => void)
• setOnNavigationInitError(listener: (event: { errorCode: NavigationInitErrorCode }) => void)
• setOnRouteChanged(listener: () => void)
• setOnReroutingRequestedByOffRoute(listener: () => void)
• setOnTrafficUpdated(listener: () => void)
• setOnRemainingTimeOrDistanceChanged(listener: (event: any) => void)
• setOnTurnByTurn(listener: (event: { navInfo: NavInfo }) => void)

const { setOnArrival, setOnRouteChanged, removeAllListeners } = useNavigation();

useEffect(() => {
  setOnArrival((event) => {
    console.log('Arrived at', event.waypoint);
    if (event.isFinalDestination) {
      navigationController.stopGuidance();
    }
  });
  setOnRouteChanged(() => console.log('Route changed'));
  
  return () => removeAllListeners();
}, [setOnArrival, setOnRouteChanged, removeAllListeners]);

// To remove a single listener:
setOnArrival(null);

Version 0.18.0 upgrades the iOS Google Navigation SDK to 11.0.0 and changes how it is resolved.

Key Changes

• iOS Dependency Management: The iOS Navigation SDK is now resolved via Swift Package Manager during pod install instead of a CocoaPods GoogleNavigation dependency. CocoaPods still manages React Native autolinking and other pods, but it no longer fetches Google Navigation. You may need to configure framework linkage in your Podfile (the sample app uses dynamic frameworks).
• iOS Display Behavior:
  • showTrafficLights and showStopSigns no longer affect iOS navigation views (they are always displayed in SDK 11). These options still work on Android.
  • MapType.TERRAIN is unavailable during active navigation on iOS, though it remains available for non-navigation maps.
• iOS Permissions: Add an NSMotionUsageDescription entry to your Info.plist to prevent potential crashes related to motion sensors.

Migration Steps

Reinstall pods after upgrading:

cd ios && pod install

To use the Navigation SDK on Android, you must meet several configuration requirements in your Gradle files:

1. Enable New Architecture: Set newArchEnabled=true in android/gradle.properties.
2. Enable Jetifier: Set android.enableJetifier=true in android/gradle.properties to ensure AndroidX compatibility.
3. Enable Core Library Desugaring: This is mandatory. In android/app/build.gradle, enable coreLibraryDesugaringEnabled and add the required dependency.
4. Set Minimum SDK: Ensure minSdkVersion is at least 24 in android/app/build.gradle.
5. API Key: It is recommended to use the Google Maps Secrets Gradle Plugin to manage your API key.

// android/gradle.properties
newArchEnabled=true
android.enableJetifier=true

// android/app/build.gradle
android {
    defaultConfig {
        minSdkVersion 24
    }
    compileOptions {
        coreLibraryDesugaringEnabled true
    }
}

dependencies {
    coreLibraryDesugaring 'com.android.tools:desugar_jdk_libs_nio:2.1.5'
}

The initialization flow in 0.14.x separates Terms and Conditions (ToS) handling from session initialization.

1. Configure NavigationProvider: termsAndConditionsDialogOptions is now a required prop.
2. Handle ToS: Use areTermsAccepted() to check status and showTermsAndConditionsDialog() to prompt the user.
3. Initialize Session: Call init(), which now returns a NavigationSessionStatus instead of throwing errors.
4. Error Handling: Instead of the onNavigationInitError event, check the return value of init() against the NavigationSessionStatus enum.

import {
  NavigationProvider,
  TaskRemovedBehavior,
  useNavigation,
  NavigationSessionStatus 
} from '@googlemaps/react-native-navigation-sdk';

// 1. Provider Configuration
<NavigationProvider
  termsAndConditionsDialogOptions={{
    title: 'Terms',
    companyName: 'My Company',
    showOnlyDisclaimer: false,
    uiParams: {
      backgroundColor: '#FFFFFF',
      titleColor: '#000000',
    },
  }}
  taskRemovedBehavior={TaskRemovedBehavior.CONTINUE_SERVICE}
>
  {children}
</NavigationProvider>

// 2. Initialization Logic
const { navigationController } = useNavigation();

const initNavigation = async () => {
  const termsAccepted = await navigationController.showTermsAndConditionsDialog();
  if (!termsAccepted) return;

  const status = await navigationController.init();
  switch (status) {
    case NavigationSessionStatus.OK: 
      console.log('Success'); break;
    case NavigationSessionStatus.NOT_AUTHORIZED: 
      console.error('API key error'); break;
    // ... handle other statuses
  }
};