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 Before You Begin 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.

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
import UIKit
import Stipop

class ViewController: UIViewController {
  
    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

        let user = SPUser(userID: "some_user_id")
        stipopButton.setUser(user, viewType: .picker)
        stipopButton.delegate = self
    }
}

extension ViewController: SPUIDelegate {
 
    func onStickerSingleTapped(_ view: SPUIView, sticker: SPSticker) {
        // This function will be executed when user chooses a sticker.
    }
  
    /* If you want to use double tap feature, change the plist file and implement this function. */
    func onStickerDoubleTapped(_ view: SPUIView, sticker: SPSticker) {
        // This function will be executed when user chooses a sticker.
    }
  
}

'userID' of SPUser is a string for identifying each user. Email, id, nickname or etc might be used as a userID.

2. How to Show Sticker Image

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

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
class ViewController: UIViewController {

    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

        let user = SPUser(userID: "some_user_id")
        stipopButton.setUser(user, viewType: .picker) // Choose .search or .picker
        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
    }
}
 
extension ViewController: SPUIDelegate {
    
    func onStickerSingleTapped(_ view: SPUIView, sticker: SPSticker) {
      stickerView.setSticker(sticker)  // Or, use stickerView.setSticker(sticker.stickerImg)
    }
  
    /* If you want to use double tap feature, change the plist file and implement this function. */
    func onStickerDoubleTapped(_ view: SPUIView, sticker: SPSticker) {
      stickerView.setSticker(sticker)  // Or, use stickerView.setSticker(sticker.stickerImg)
    }
      
}