How to implement TapJoy in Flutter

4 min readFeb 5, 2021

So i was working on a project earlier, of which whole business model depended on TapJoy SDK, as i kept searching for a flutter plugin for TapJoy, i didn’t find anything. So i decided to create a plugin for it.

Here i will explain how to build a full working example for the plugin with flutter.

First we need to add some modifications for both Android and iOS Files.

Let’s start with iOS.

As TapJoy is enrolled as a network partner in Apple’s SKAdNetwork. Add TapJoy’s network ID to your app’s info.plist file along with the IDs of the DSP partners listed below:

<key>SKAdNetworkItems</key>
  <array>
    <dict>
      <key>SKAdNetworkIdentifier</key>
      <string>ecpz2srf59.skadnetwork</string>
    </dict>
    <dict>
      <key>SKAdNetworkIdentifier</key>
      <string>7ug5zh24hu.skadnetwork</string>
    </dict>
    <dict>
      <key>SKAdNetworkIdentifier</key>
      <string>9t245vhmpl.skadnetwork</string>
    </dict>
    <dict>
      <key>SKAdNetworkIdentifier</key>
      <string>prcb7njmu6.skadnetwork</string>
    </dict>
    <dict>
      <key>SKAdNetworkIdentifier</key>
      <string>5lm9lj6jb7.skadnetwork</string>
    </dict>
    <dict>
      <key>SKAdNetworkIdentifier</key>
      <string>578prtvx9j.skadnetwork</string>
    </dict>
  </array>
iOS 14.0 or higher required App Tracking Authorization from the user.

iOS 14.0 or higher requires App Tracking Authorisation from the user, so we need to add the following lines in info.plist if your app will user App Tracking Feature.

<key>NSUserTrackingUsageDescription</key>
<string>This allows us to deliver personalized ads for you.</string>

We also need to comment out the following line in our ios Podfile :

target 'Runner' do
# use_frameworks!
  use_modular_headers!

And for Android:

The following permissions are needed:

INTERNET
ACCESS_NETWORK_STATE
ACCESS_WIFI_STATE(optional)

Add the following lines to your flutterApp/android/app/src/main/AndroidManifest.

<uses-permission android:name="android.permission.INTERNET"/>
  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
  <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>

Add these activities to the AndroidManifest.xml file in the Application block:

<activity
  android:name="com.tapjoy.TJAdUnitActivity"
  android:configChanges="orientation|keyboardHidden|screenSize"
  android:hardwareAccelerated="true"
  android:theme="@android:style/Theme.Translucent.NoTitleBar.Fullscreen" />
<activity
  android:name="com.tapjoy.TJContentActivity"
  android:configChanges="orientation|keyboardHidden|screenSize"
  android:theme="@android:style/Theme.Translucent.NoTitleBar"
  android:hardwareAccelerated="true" />

As part of Google Play Services integration, we will have to add the following to the AndroidManifest.xml file:

<meta-data
  android:name="com.google.android.gms.version"
  android:value="@integer/google_play_services_version" />

To the fun part, let’s start building our example App.

add this line in you pubspec.yaml file under dependencies :

dependencies:
  tap_joy_plugin: ^0.0.4

Next, run Flutter pub get in terminal:

flutter pub get

Now let’s write some code

first we need to set connection handler so that we get notified when connection is established or failed.

let’s create handler first then set it.

TJConnectionResultHandler _connectionResultHandler() {
  TJConnectionResultHandler handler =  (result) {
    switch (result) {
      case TJConnectionResult.connected:
      // TODO: Handle this case

        break;
      case TJConnectionResult.disconnected:
      // TODO: Handle this case.
      
        break;
    }
  };
  return handler;
}

now let’s set TapJoyConnectionResult handler:

TapJoyPlugin.shared.setConnectionResultHandler(_connectionResultHandler());

Connect to TapJoy with Android & iOS TapJoy Api Keys & debug on true for development. (don’t forget to change the debug to false for production):

TapJoyPlugin.shared.connect(
androidApiKey:
        "your_android_key",
    iOSApiKey:
        "your_iOS_key",
    debug: true);

Then, set userID :

TapJoyPlugin.shared.setUserID(userID: "user_id123");

After successfully connecting to TapJoy, go to the TapJoy dashboard, developer console and set the device as test device:

TapJoy works with placements, so you will have to create a placement first in the TapJoy Dashboard and also create content for that placement.

Now we can create the placement in our flutter app, make sure to write the exact name of placement as in the dashboard as it’s case sensitive :

TJPlacement tjPlacement = TJPlacement(name: "placement_name");

Now create a handler for the placement to notify us with changes such as request success, request fail, content ready, content shown or content disappeared.

UserClicked notification is supported for android devices ONLY

TJPlacementHandler _placementHandler() {
  TJPlacementHandler handler =  (contentState, name, error) {
    switch (contentState) {      case TJContentState.contentReady:
          // TODO: Handle this case.
        break;      case TJContentState.contentDidAppear:
           // TODO: Handle this case.
        break;      case TJContentState.contentDidDisappear:
           // TODO: Handle this case.
        break;      case TJContentState.contentRequestSuccess:
          // TODO: Handle this case.
        break;      case TJContentState.contentRequestFail:
          // TODO: Handle this case.
        break;      case TJContentState.userClickedAndroidOnly:
          // TODO: Handle this case.
        break;    }
  };
     return handler;
}

Now set the handler to the placement we just created:

tjPlacement.setHandler(_placementHandler());

We’re done ! now we can write functions to request and show content for our placement !

tjPlacement.requestContent();tjPlacement.showPlacement();

We might need to get user current Balance, award balance to user or deduct balance from user.

First Make sure you have a currency created and ready in TapJoy Dashboard for both iOS and Android.

Create Currency Handler :

TJSpendCurrencyHandler _currencyHandler() {
  TJSpendCurrencyHandler handler =  (currencyName, amount, error) {
// TODO: Handle this case.
  };
  return handler;
}

Then set the currency handler:

You can set different currency handler for each function of those, but for simplicity i will set the same one for all of them:

TapJoyPlugin.shared.setGetCurrencyBalanceHandler(_currencyHandler());
TapJoyPlugin.shared.setAwardCurrencyHandler(_currencyHandler());
TapJoyPlugin.shared.setSpendCurrencyHandler(_currencyHandler());

Now you can get currency balance as follows, and u will receive the data in the handler that we’ve just set:

TapJoyPlugin.shared.getCurrencyBalance();

or deduct balance from user ( spend currency balance ):

TapJoyPlugin.shared.spendCurrency(int amount);

or award the user some balance for being a loyal user:

TapJoyPlugin.shared.awardCurrency(int amount);

In order to notify users that they’ve earned virtual currency since the last time the app queried the user’s currency balance, set earned currency alert handler:

TapJoyPlugin.shared.setEarnedCurrencyAlertHandler(_currencyHandler());

That’s it ! we’ve covered everything we can do with the TapJoy Plugin for Flutter !

Plugin link on pub.dev website

you can check source code for the complete working example Here.

If you like the article, Don’t forget to throw some claps ;)

How to implement TapJoy in Flutter

Written by Mahmoud Abdellatief