Live tracking in your app

A Task is a transaction event, like a pickup, or a visit that is performed by the Driver. While the task is performed, it can be tracked in real-time on a map inside an app, with relevant information like the details of the driver.

For this guide, we will create a demo task and track it on map inside Android. If you're on iOS, read the iOS version of this guide.

Live tracking

Step 1: Install the SDK

Your app needs to have the HyperTrack Consumer SDK as a dependency. For this, edit the your app's build.gradle file.

  1. Add the HyperTrack Android Maven repository
  2. Add Consumer SDK as a dependency
  3. Sync gradle

Install sdk

repositories {
    maven { url 'http://hypertrack-android-sdk.s3-website-us-west-2.amazonaws.com/' }
}

dependencies {
    ...
    compile('io.hypertrack:consumer:1.5.13:release@aar') {
        transitive = true;
    }
    ...
}

Proguard Rules

If you are using Proguard in your project add the following lines to your proguard configuration file (proguard-rules.pro):

-keep class io.hypertrack.lib.** { *; }
-dontwarn io.hypertrack.lib.**

Step 2: Configure the SDK

To initialise the Consumer SDK, add the following to the onCreate method of the Launcher Activity of your app. For this step, you will need your publishable key.

Configure sdk

@Override
protected void onCreate(Bundle savedInstanceState) {
    ...
    HyperTrack.setPublishableApiKey("YOUR_PK_TOKEN", getApplicationContext());
    HTConsumerClient.initHTConsumerClient(getApplicationContext());
}

Step 3: Add map view fragment

In the layout xml of your main activity, add the fragment definition.

Map view fragment

<fragment
    android:id="@+id/htMapfragment"
    android:name="io.hypertrack.lib.consumer.view.HTMapFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:layout="@layout/fragment_map" />

Step 4: Add google maps key

To use Google Maps in your app, you will need to add the Google Maps API key in your AndroidManifest file.

Google key

<application>
        ...
    <meta-data android:name="com.google.android.geo.API_KEY" android:value="YOUR_MAPS_KEY"/>
</application>

Step 5: Modify layout styles

One last step to configure the map view is to disable the window title of the layout. To do this, edit the styles.xml file and add the following rules.

Title styles

Now when you run the app, you will see the map fragment, with the default Google Maps bounds. Next up, we will set up our demo task.

[warning] Clean build

In some cases, the xml file changes only reflect after cleaning the build. If you run into errors, try cleaning the build.

<style>
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
</style>

Step 6: Create a demo Task

In this step, we will call the HyperTrack API to create a demo Task object. This API creates a Task, and returns its id, which will be used in the next step.

[info] Secret key

Since we are creating a new Task object, this will require the secret key of your account.

Demo task

curl -H "Authorization: token YOUR_SK_TOKEN" \
     -X POST \
     https://app.hypertrack.io/api/v1/tasks/demo/

Step 7: Setup map adapter

In this step, we will setup the map adapter, which will act as the data source for the map fragment. For this step, we will use the Task id generated in the previous step. Add the following to your Activity class.

Setup map adapter

@Override
protected void onCreate(Bundle savedInstanceState) {
    ...
    HTMapFragment htMapFragment = (HTMapFragment)getSupportFragmentManager()
            .findFragmentById(R.id.htMapfragment);

    HyperTrackMapAdapter adapter = new HyperTrackMapAdapter(this);
    htMapFragment.setHTMapAdapter(adapter);
}

private class HyperTrackMapAdapter extends HTMapAdapter {
    public HyperTrackMapAdapter(Context mContext) {
        super(mContext);
    }

    @Override
    public List<String> getTaskIDsToTrack(HTMapFragment mapFragment) {
        // Return a list of TaskIDs that needs to be tracked on the MapFragment
        ArrayList<String> taskIDsToTrack = new ArrayList<>();
        taskIDsToTrack.add("YOUR_TASK_ID");
        return taskIDsToTrack;
    }
}

Now it's time to run the app! When you do, you will see the map view, with the demo Task that we just created.

[success] Live tracking

The native live tracking experience is available for all tasks, and is also available on the web and iOS. To know more about the live tracking use-case and UI customisations for the map view, read the live tracking tutorials.

Was this helpful? Yes, thanks! Not really

results matching ""

    No results matching ""