Skip to main content
Camera Kit
iOS

Building a Camera Kit App for iOS Using Reference UI (UIKit)

In this tutorial, you'll learn how to build a fully-fledged Camera Kit application for iOS using Reference UI components in just a few lines of code.

Prerequisites

  • You have a Snapchat Developer Account and have created a Camera Kit application on the Developer Portal
  • Basic knowledge of Swift and UIKit
  • Latest Xcode installed
Section 1

Getting Started

Let's prepare our local development environment and add the Camera Kit SDK as a dependency using Swift Package Manager.

Step 1

Download the project files above and open Starting Project/CameraKitBasicReferenceUISample.xcodeproj

Step 2

Select "File" → "Add Package Dependencies…".

Paste the following link into the search box: https://github.com/Snapchat/camera-kit-ios-sdk.

Press "Add Package" to begin adding Camera Kit to your project.

Step 3

After Xcode finishes downloading the package, select SCSDKCameraKit and SCSDKCameraKitReferenceUI.

Set everything else to "None" and press "Add Package".

We are now done adding Camera Kit as a dependency to your project.

Loading
Loading
Next Section
Building the App Using Reference UI Components
Section 2

Building the App Using Reference UI Components

We'll start by defining our credentials: API token and Lens group ID. Then, we'll create and configure a CameraController and finally present the CameraViewController.

Step 1

Open SceneDelegate.swift and import SCSDKCameraKit library

This library provides access to core Camera Kit functionalities.

Step 2

Import SCSDKCameraKitReferenceUI

This library provides access to high-level UI components and utilities that simplify building Camera Kit-based experiences.

Step 3

Define your API token and Lens group ID

You can find them by navigating to My Lenses and selecting your application. You can use Staging API Token and Demo Lens Group ID for this tutorial

Step 4

Create SessionConfig

This object is used to configure Camera Kit. For now, we just specify the API token.

Step 5

Create CameraController and configure it with the Lens Group Id

This object encapsulates the most common Camera Kit operations and provides a high-level API.

Note: It is not a UIViewController.

Step 6

Create CameraViewController and initialize it with CameraController

This view controller implements the camera preview, controls, and a carousel-like UI to navigate a set of lenses similar to the Snapchat experience.

Step 7

Present CameraViewController by making it the root controller for the window.

Step 8

Open Info.plist and add Privacy items related to camera and microphone permissions.

You can also edit the Info.plist source code directly and add the following:

<key>NSPhotoLibraryUsageDescription</key>
<string>Camera Kit Sample app uses your photo library for lenses</string>
<key>NSMicrophoneUsageDescription</key>
<string>Camera Kit Sample app  uses your mic for lenses</string>
<key>NSCameraUsageDescription</key>
<string>Camera Kit Sample app  uses your camera for lenses</string>
Step 9

Run the app

You should now see a complete Camera Kit experience with camera controls and lenses carousel.

SceneDelegate.swift
SceneDelegate.swift
SceneDelegate.swift
SceneDelegate.swift
SceneDelegate.swift
SceneDelegate.swift
SceneDelegate.swift
Summary
Finish & Review

Summary

You've now successfully built a Camera Kit-based app using the Reference UI. While Reference UI allows you to get results and iterate quickly, it may not provide the flexibility you might desire compared to the lower-level API from Camera Kit.

Was this page helpful?
Yes
No