This is an unofficial demo app of Snap Kit SDK produced by SnapChat for iOS Swift
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:
- Get a Snapchat Developer Account
- Snap Kit SDK
- Edit Properties List
- Sign up for an account on the Snapchat Dev Portal
- Note / copy the value in Development App Info > OAUTH2 CLIENT ID
- Enter the iOS Bundle ID for your app in Development App Info > IOS BUNDLE ID > Add Your id here ...
- 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
- Open your Podfile and add
pod 'SnapSDK'
- pod install
- Right click on the Info.plist file in Xcode and choose Open As > Source Code
- 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>
- 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>
- 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>
Anyplace you need the Login Kit code
import SCSDKLoginKit
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)
}
The demo app uses it's own button (see below)
let loginButton = SCSDKLoginButton()
@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
}
})
}
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 ?? "")
}
}
You can share a photo or video attaching a sticker, url, and caption.
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.
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)
}
}
}
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)
}
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) {
}
}