Video Demo

1. Set the minSdkVersion in android/app/build.gradle:

android {
    defaultConfig {
        minSdkVersion 21
        targetSdkVersion 30
    }
}

This means that app will only be available for users that run Android SDK 20 or higher.

2. Specify your API key in the application manifest android/app/src/main/AndroidManifest.xml:

<manifest ...
<application ...
<meta-data android:name="com.google.android.geo.API_KEY"
           android:value="YOUR KEY HERE"/>

1. Mapbox APIs and vector tiles require a Mapbox account and API access token. Add your token in strings.xml file of your android apps res/values/ path. The string key should be "mapbox_access_token". You can obtain an access token from the Mapbox account page.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_name">Navigation map</string>
    <string name="mapbox_access_token" translatable="false">ADD_MAPBOX_ACCESS_TOKEN_HERE</string>
    <string name="user_location_permission_explanation">This app needs location permissions to show its functionality.
    </string>
    <string name="user_location_permission_not_granted">You didn\'t grant location permissions.</string>
</resources>

2. Add the following permissions to the app level Android Manifest

<manifest>
    ...
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
    ...
</manifest>

3. Add the MapBox Downloads token with the downloads:read scope to your gradle.properties file in Android folder to enable downloading the MapBox binaries from the repository. To secure this token from getting checked into source control, you can add it to the gradle.properties of your GRADLE_HOME which is usually at $USER_HOME/.gradle for Mac. This token can be retrieved from your MapBox Dashboard. You can review the Token Guide to learn more about download tokens

MAPBOX_DOWNLOADS_TOKEN=sk.XXXXXXXXXXXXXXX

After adding the above, your gradle.properties file may look something like this:

org.gradle.jvmargs=-Xmx1536M
android.useAndroidX=true
android.enableJetifier=true
MAPBOX_DOWNLOADS_TOKEN=sk.xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

4. Add your MapBox key in the form pk.xxxxxxxxxxxxxxxxx to the file 'mapbox_key.dart' where it says "YOUR KEY HERE"

This plugin requires iOS 9.0 or higher. To set up, specify your API key in the application delegate ios/Runner/AppDelegate.m:

#include "AppDelegate.h"
#include "GeneratedPluginRegistrant.h"
#import "GoogleMaps/GoogleMaps.h"

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application
    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  [GMSServices provideAPIKey:@"YOUR KEY HERE"];
  [GeneratedPluginRegistrant registerWithRegistry:self];
  return [super application:application didFinishLaunchingWithOptions:launchOptions];
}
@end

Or in your swift code, specify your API key in the application delegate ios/Runner/AppDelegate.swift:

import UIKit
import Flutter
import GoogleMaps

@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
  override func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
  ) -> Bool {
    GMSServices.provideAPIKey("YOUR KEY HERE")
    GeneratedPluginRegistrant.register(with: self)
    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
  }
}

1. Go to your Mapbox account dashboard and create an access token that has the DOWNLOADS:READ scope. PLEASE NOTE: This is not the same as your production Mapbox API token. Make sure to keep it private and do not insert it into any Info.plist file. Create a file named .netrc in your home directory if it doesn’t already exist, then add the following lines to the end of the file:

   machine api.mapbox.com
     login mapbox
     password PRIVATE_MAPBOX_API_TOKEN
   

   where PRIVATE_MAPBOX_API_TOKEN is your Mapbox API token with the DOWNLOADS:READ scope.

2. Mapbox APIs and vector tiles require a Mapbox account and API access token. In the project editor, select the application target, then go to the Info tab. Under the “Custom iOS Target Properties” section, set MBXAccessTokento your access token. You can obtain an access token from the Mapbox account page.

3. In order for the SDK to track the user’s location as they move along the route, set NSLocationWhenInUseUsageDescription to:

   Shows your location on the map and helps improve OpenStreetMap.

4. Users expect the SDK to continue to track the user’s location and deliver audible instructions even while a different application is visible or the device is locked. Go to the Capabilities tab. Under the Background Modes section, enable “Audio, AirPlay, and Picture in Picture” and “Location updates”. (Alternatively, add the audioand location values to the UIBackgroundModes array in the Info tab.)

The plugins used in this project are:

• google_maps_flutter
• tfl_api_client
• flutter_mapbox_navigation
• flutter_polyline_points
• cloud_firestore
• crypto
• cupertino_icons
• firebase_auth
• firebase_core
• flutter_google_places_hoc081098
• flutter_spinkit
• google_api_headers
• google_maps_webservice
• nanoid
• provider
• uuid
• avatars
• animated_bottom_navigation_bar
• geolocator
• auto_animated
• google_fonts
• animations
• location
• getwidget
• rounded_loading_button
• flutter_native_splash
• flutter_launcher_icons
• introduction_screen
• mockito
• fake_cloud_firestore
• firebase_auth_mocks
• mock_data

Zane Mehdi

Musab Khan

Amman Kiani

Rohit Pun

Taseen (Taz) Rahman

Samadur (Samad) Rahman

Dawud Osman

Daniel Saisani