Skip to content

bbookman/SnapKitSample-iOS

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

45 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

snapkit-sample-ios

This is an unofficial demo app of Snap Kit SDK produced by SnapChat for iOS Swift

Documentation

Instructions

These instructions assume a basic knowlege of Swift and Cocoapods. This readme contains both instructions for getting the app to run as well as more detail on the code.

If you just want to get the app running with all the default code, follow steps:

  1. Get a Snapchat Developer Account
  2. Snap Kit SDK
  3. Edit Properties List

Get a Snapchat Developer Account

  1. Sign up for an account on the Snapchat Dev Portal
  2. Note / copy the value in Development App Info > OAUTH2 CLIENT ID
  3. Enter the iOS Bundle ID for your app in Development App Info > IOS BUNDLE ID > Add Your id here ...
  4. Under Redirect URLs enter a unique URL. For example, you might choose the name of your app and a path.
  • The key is that this be unique, but can be "made up" as long as the value you enter here is also the value you place in the Info.plist as described below.
  • Example URL: myuniqueapp://somepath
  • Make note of the value you choose

Snap Kit SDK

  1. Open your Podfile and add
pod 'SnapSDK'
  1. pod install

Edit Properties List

  1. Right click on the Info.plist file in Xcode and choose Open As > Source Code
  2. The string value for SCSDKClientId is the OATH2 CLIENT ID you noted from step 2 in "Get a Snapchat Developer Account"
<key>SCSDKClientId</key>
    <string>OAUTH2 CLIENT ID</string> 
  1. The string value for CFBundleURLSchemes is the first portion of the Redirect URL. So if the Redirect URL from step 4 in "Get a Snapchat Developer Account" was myuniqueapp://somepath, the value would be myuniqueapp
<array>
	<dict>
		<key>CFBundleTypeRole</key>
			<string>Editor</string>
			<key>CFBundleURLSchemes</key>
			<array>
				<string><insert your own value here></string>
			</array>
	</dict>
</array>
  1. The LSApplicationQueriesSchemes would also need to be added to a new Info.plist, but it has already been added to this repository's plist
<key>LSApplicationQueriesSchemes</key>
	<array>
		<string>itms-apps</string>
		<string>snapchat</string>
		<string>bitmoji-sdk</string>
	</array>

Login Kit

Anyplace you need the Login Kit code

import SCSDKLoginKit

AppDelegate

This code needs to be added in the AppDelegate.swift file. It has already been added to this sample app

    func application(_ app: UIApplication, open url: URL, options: [UIApplicationOpenURLOptionsKey : Any] = [:]) -> Bool {
        
        return SCSDKLoginClient.application(app, open: url, options: options)
    }

Snapchat Official Login Button

The demo app uses it's own button (see below)

let loginButton = SCSDKLoginButton()

Other Login Button

@IBAction func loginButtonTapped(_ sender: Any) {
    SCSDKLoginClient.login(from: self, completion: { success, error in

        if let error = error {
            print(error.localizedDescription)
            return
        }

        if success {
            self.fetchSnapUserInfo() //used in the demo app to get user info
        }
    })
}

Get User Data

Snapchat does not gather much data from users:

  • User ID (A Snapchat internal generated value)
  • Display Name (User's chosen display name)
  • Bitmoji (Avatar, if user has created one)

Notice there is no ability to gather email address or real name.

The code below is one of many approches to parsing the values returned from SDSDKLoginClient.fetchUserData

private func fetchSnapUserInfo(){
    let graphQLQuery = "{me{displayName, bitmoji{avatar}}}"

    SCSDKLoginClient
        .fetchUserData(
            withQuery: graphQLQuery,
            variables: nil,
            success: { userInfo in

                if let userInfo = userInfo,
                    let data = try? JSONSerialization.data(withJSONObject: userInfo, options: .prettyPrinted),
                    let userEntity = try? JSONDecoder().decode(UserEntity.self, from: data) {

                    DispatchQueue.main.async {
                        self.goToLoginConfirm(userEntity)
                    }
                }
        }) { (error, isUserLoggedOut) in
            print(error?.localizedDescription ?? "")
    }
}

Creative Kit

You can share a photo or video attaching a sticker, url, and caption.

Sample Code

import SCSDKCreativeKit

let snapshot = sceneView.snapshot() // Any image is OK. In this codes, SceneView's snapshot is passed.
let photo = SCSDKSnapPhoto(image: snapshot)
let snap = SCSDKPhotoSnapContent(snapPhoto: photo)

// Sticker
let sticker = SCSDKSnapSticker(stickerImage: #imageLiteral(resourceName: "snap-ghost"))
snap.sticker = sticker

// Caption
snap.caption = "Snap on Snapchat!"

// URL
snap.attachmentUrl = "https://www.snapchat.com"

let api = SCSDKSnapAPI(content: snap)
api.startSnapping { error in

    if let error = error {
        print(error.localizedDescription)
    } else {
        // success

    }
}

If you use SCSDKVideoSnapContent, you can share the video.

Bitmoji Kit

Fetch Bitmoji

import SCSDKBitmojiKit

// fetch your avatar image.
SCSDKBitmojiClient.fetchAvatarURL { (avatarURL: String?, error: Error?) in
    DispatchQueue.main.async {
        if let avatarURL = avatarURL {
            self.iconView.load(from: avatarURL)
        }
    }
}

Show Bitmoji Picker View

Use SCSDKBitmojiStickerPickerViewController and add as a child

You can add the picker view as child ViewController.

@IBAction func bitmojiButtonTapped(_ sender: Any) {
    // Make bitmoji background view
    let viewHeight: CGFloat = 300
    let screen: CGRect = UIScreen.main.bounds
    let backgroundView = UIView(
        frame: CGRect(
            x: 0,
            y: screen.height - viewHeight,
            width: screen.width,
            height: viewHeight
        )
    )
    view.addSubview(backgroundView)
    bitmojiSelectionView = backgroundView

    // add child ViewController
    let stickerPickerVC = SCSDKBitmojiStickerPickerViewController()
    stickerPickerVC.delegate = self
    addChildViewController(stickerPickerVC)
    backgroundView.addSubview(stickerPickerVC.view)
    stickerPickerVC.didMove(toParentViewController: self)
}

Inherit SCSDKBitmojiStickerPickerViewControllerDelegate

If you Inherit SCSDKBitmojiStickerPickerViewControllerDelegate, you can track events when the picker is selected, and the search field is focused.

The code below retrieves the bitmoji to set in the scene

extension CameraViewController: SCSDKBitmojiStickerPickerViewControllerDelegate {

    func bitmojiStickerPickerViewController(_ stickerPickerViewController: SCSDKBitmojiStickerPickerViewController, didSelectBitmojiWithURL bitmojiURL: String) {

        bitmojiSelectionView?.removeFromSuperview()

        if let image = UIImage.load(from: bitmojiURL) {
            DispatchQueue.main.async {
                self.setImageToScene(image: image)
            }
        }
    }

    func bitmojiStickerPickerViewController(_ stickerPickerViewController: SCSDKBitmojiStickerPickerViewController, searchFieldFocusDidChangeWithFocus hasFocus: Bool) {

    }
}

If You Liked This Repository, you may also enjoy

Contact Me

About

Demonstration App for Snapchat Snap Kit

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Swift 98.0%
  • Ruby 2.0%