Stipop Docs | Documentation for SDK and API

Quick Start

Welcome to Stipop Android Sticker UI SDK. With just a simple integration process you can add optimized Sticker UI and over 150,000 unique stickers to your chat interface. Take the steps below to get started right away.

Stipop Stickers

Requirements

  • Kotlin
  • Android + (API level 16) or higher
  • Java 7 or higher
  • Support androidx only
  • Gradle 3.4.0 or higher
Stipop Stickers

Requirements

  • Android 4.1 (API level 16) or higher
  • Java 8
  • Support androidx only
  • Gradle 3.5.4 or higher


Step 1: Download Stipop.json

By creating your Stipop application you can access everything required to start integrating the Sticker SDK, like API key, analytics, and more.

    Rocket

    1. Sign up on Stipop Dashboard


    Go to the Stipop Dashboard and create a new account.

    Stipop Stickers

    Rocket

    2. Create Application


    Once signed in, create your first application by entering basic information such as app name.

    Stipop Stickers

    Rocket

    3. Download Stipop.json


    Lastly, when you arrive at Dashboard Quick Start page, download Stipop.json file for Android. You'll use this file in step 3.

    Stipop Json

Step 1: Download Stipop.json

By creating your Stipop application you can access everything required to start integrating the Sticker SDK, like API key, analytics, and more.

1. Sign up on Stipop Dashboard


Go to the Stipop Dashboard and create a new account.

2. Create Application


Once signed in, create your first application by entering basic information such as app name.

3. Download Stipop.json


Lastly, when you arrive at Dashboard Quick Start page, download Stipop.json file for Android. You'll use this file in step 3.

We currently provide the SDKs in Android, iOS, and soon JavaScript will be updated.

Step 2: Install Sticker SDK

1. Add the JitPack repository to your build file

Add it in your root build.gradle at the end of repositories:

build.gradle

allprojects {
  repositories {
    ...
    maven { url 'https://jitpack.io' }
  }
}

2. Add the dependency

Add it in your app build.gradle at the end of dependency:

build.gradle

dependencies {
  ...
  implementation 'com.github.stipop-development:stipop-android-sdk:0.0.6'
}

Step 3: Setup Stipop SDK

1. Setup Stipop.json

Step 1: Create assets folder in app>src>main if you don't have one.

Step 2: Move the Stipop.json file you downloaded from the Dashboard into the assets folder.

Stipop Stickers

Step 1: Create assets folder in app>src>main if you don't have one.

Step 2: Move the Stipop.json file you downloaded from the Dashboard into the assets folder.

Stipop Stickers

Stipop.json contains your API Key. So you MUST keep it private. Once it's been leaked, make sure to regenerate one immediately.

2. Create GlobalApplication

Create to app>src>main>java>your_package_name GlobalApplication:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import android.app.Application
import android.content.Context
import io.stipop.Stipop
class GlobalApplication : Application() {
    companion object {
        lateinit var instance: GlobalApplication
            private set
    }
    override fun onCreate() {
        super.onCreate()
        instance = this
        Stipop.configure(this)
    }
    fun context(): Context = applicationContext
}

3. Update AndroidManifest

Make the following updates in your AndroidManifest:
   1. Enter your package name in "YOUR_PACKAGE" (line 3).
  2. Copy and paste xmlns:tools="http://schemas.android.com/tools" (line 4).
  3. Copy and paste android:name=".GlobalApplication" (line 8).
  4. Copy and paste tools:replace="android:theme" (line 14).

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="YOUR_PACKAGE"
    xmlns:tools="http://schemas.android.com/tools"
    >
    <application
        android:name=".GlobalApplication"
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        tools:replace="android:theme">
        <activity
            android:name=".MainActivity"
            android:label="@string/app_name"
        >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

4. Update activity_main

Update app>src>main>res>layout activity_main:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="bottom"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        >
        <TextView
            android:id="@+id/packageDetailTV"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="packageDetail!"
            android:layout_gravity="center"
            android:gravity="center"/>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal"
        android:layout_margin="10dp"
        android:gravity="center_vertical">
        <EditText
            android:id="@+id/chatET"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="" />
        <io.stipop.extend.StipopImageView
            android:id="@+id/stipopIV"
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:src="@mipmap/ic_sticker_normal"/>
    </LinearLayout>
</LinearLayout>

5. Stipop.connect

You must activate Stipop.connect in order to use the SDK successfully.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import io.stipop.Stipop
import io.stipop.StipopDelegate
import io.stipop.extend.StipopImageView
import io.stipop.model.SPPackage
import io.stipop.model.SPSticker
class MainActivity : AppCompatActivity(), StipopDelegate {
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)
  
    val stipopIV = findViewById<StipopImageView>(R.id.stipopIV)
  
    Stipop.connect(this, stipopIV, "1234", "en", "US", this)
  
    stipopIV.setOnClickListener {
      Stipop.showSearch()
    }
  }
  override fun onStickerSelected(sticker: SPSticker) {
    print(sticker)
  }
  override fun canDownload(spPackage: SPPackage): Boolean {
      print(spPackage)
      return true
  }
}


Next step: Choose View Type

Search View provides instant sticker search like a GIF search engine.
Sticker Picker View let's users download and send stickers from a sticker picker like on WhatsApp.

We’re here to help. Contact us.