Stipop Docs | Documentation for SDK and API

Quick Implementation (SPUIButton)

You can integrate Stipop UI SDK into your app in a minute with SPUIButton. Just place the button. Then our SDK will do the rest complicated things. If a user touches the button, it'll automatically show Search View or Picker View. You can choose which one to appear.

All you have to care is to make wonderful features with our stickers.


Before you begin

Make sure you went through all processes in Quick Start to download and setup the Stipop.plist file, which is required to complete development of the SDK.

1. Set SPUIButton in UIViewController(or UIView)

Go to the View Controller you want to place the button. Then, Initialize SPUIButton and connect delegate.

ViewController.swift
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
import UIKit
import Stipop

class ViewController: UIViewController, SPUIButtonDelegate {
    let stipopButton = SPUIButton(type: .system)

    override func viewDidLoad() {
        super.viewDidLoad()

        self.view.addSubview(stipopButton)
        stipopButton.translatesAutoresizingMaskIntoConstraints = false
        stipopButton.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
        stipopButton.centerYAnchor.constraint(equalTo: view.topAnchor, constant: 150).isActive = true
        stipopButton.heightAnchor.constraint(equalToConstant: 25).isActive = true
        stipopButton.widthAnchor.constraint(equalToConstant: 25).isActive = true
        stipopButton.delegate = self
    }

    var user: SPUser {
        return SPUser(userID: "some_user_id")
    }

    var viewType: SPViewType {
        // Choose .search or .picker
        return .picker
    }

    func onStickerSelect(_ sticker: SPSticker) {
        // This function will be executed when user chooses a sticker.
    }
}

2. How to Show Sticker Image

Use SPUIStickerView to show sticker image. Make SPUIStickerView on your view and set sticker.

ViewController.swift
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
class ViewController: UIViewController, SPUIButtonDelegate {
    let stipopButton = SPUIButton(type: .system)
    let stickerView = SPUIStickerView()

    override func viewDidLoad() {
        super.viewDidLoad()

        self.view.addSubview(stipopButton)
        stipopButton.translatesAutoresizingMaskIntoConstraints = false
        stipopButton.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
        stipopButton.centerYAnchor.constraint(equalTo: view.topAnchor, constant: 150).isActive = true
        stipopButton.widthAnchor.constraint(equalToConstant: 25).isActive = true
        stipopButton.heightAnchor.constraint(equalToConstant: 25).isActive = true
        stipopButton.delegate = self
        
        self.view.addSubview(stickerView)
        stickerView.translatesAutoresizingMaskIntoConstraints = false
        stickerView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
        stickerView.topAnchor.constraint(equalTo: stipopButton.bottomAnchor).isActive = true
        stickerView.widthAnchor.constraint(equalToConstant: 125).isActive = true
        stickerView.heightAnchor.constraint(equalToConstant: 125).isActive = true
    }

    var user: SPUser {
        return SPUser(userID: "some_user_id")
    }

    var viewType: SPViewType {
        // Choose .search or .picker
        return .picker
    }

    func onStickerSelect(_ sticker: SPSticker) {
        stickerView.setSticker(sticker)
        // Or, Use stickerView.setSticker(sticker.stickerImg)
    }
}

3. Done

It's that easy to use our SDK!

If you want to present SPSearchView or SPPickerView in your way, See Search View or Picker View.


Next step: See How our SDK View Work

Now that you've got the SPUIButton done, let's see how Search View and Sticker Picker View works in detail.

We’re here to help. Contact us.