Shoplive iOS SDKis a mobile SDK that allows users to quickly and easily provide livestreams to customers using the app.Shoplive PIP(Picture-in-Picture)andnative keyboard UIenable seamless mobile experience on smartphones.
These are the minimum requirements to use the Shoplive SDK for iOS. If you do not meet these requirements, you cannot use the Shoplive SDK for iOS.
- Xcode 14 and above
- iOS 11 and above
- iOS Deployment Target 11.0 and above
- Swift 5.0 and above
To use the Shoplive SDK for iOS, please request for an admin account and password to a Shoplive representative.
Add campaigns in Shoplive admin and write down Campaign Key.
Choose one of the following methods to install the Shoplive SDK for iOS.
❗️Do not duplicate installation.
Shoplive SDK for iOS installation must be done using either ‘CocoaPods’ or ‘Swift Package Manager.'
- CocoaPods
Add the following line to the Podfile.
source 'https://github.com/CocoaPods/Specs.git'
# Set it as the same minimum supported version of the project.
# Shoplive SDK for iOS supports iOS 11.0 and above. You cannot set it below iOS 11.0.
platform: ios, '11.0'
use_frameworks!
# Set Project Target for Shoplive SDK for iOS installation.
target 'PlayShopLive' do
#livePlayerSDK
pod 'ShopLive', '1.5.16'
pod 'ShopliveSDKCommon' , '1.5.16'
#shortform SDK
pod 'ShopliveShortformSDK' , '1.5.16'
pod 'ShopliveSDKCommon' , '1.5.16'
end- Swift Package Manager
Once you have your Swift package set up, adding Shoplive SDK for iOS as a dependency is as easy as adding it to the dependencies value of your Package.swift.
dependencies: [
//player
.package(url: "https://github.com/shoplive/ios-sdk.git", .upToNextMajor(from: "1.5.16"))
.package(url: "https://github.com/shoplive/common-ios", .upToNextMajor(from: "1.5.16"))
//shortform
.package(url: "https://github.com/shoplive/shortform-ios", .upToNextMajor(from: "1.5.16"))
.package(url: "https://github.com/shoplive/common-ios", .upToNextMajor(from: "1.5.16"))
]- Initialize the Shoplive Android SDK using the prepared Access Key.
| Play the video using the campaign key. | Starts a muted campaign as an in-app PIP. |
|---|---|
 |
 |
// MainViewController.swift
class MainViewController: UIViewController {
...
override func viewDidLoad() {
super.viewDidLoad()
// Initialize the Shoplive iOS SDK using the prepared Access Key.
ShopLiveCommon.setAccessKey(accessKey : "{AccessKey}")
// SetUser
ShopLiveCommon.setUser(user: ShopLiveCommonUser)
// Play the video using the campaign key.
ShopLive.play(data: .init(campaignKey : "{CampaignKey}"))
// Starts a muted campaign as an in-app PIP.
ShopLive.preview(data: .init(campaignKey : "{CampaignKey}"), completion: nil)
}
...
}When performing other tasks while watching a campaign, users can switch to picture-in-picture mode.
-
Switching in-app PIP(picture-in-picture) mode
The user can switch the campaign view being played into a small window within the app by selecting the picture-in-picture mode icon on the Shoplive Player, or by using the Swipe down gesture. Unlike the preview function, even if the user switches to the in-app PIP mode, the campaign audio keeps to play. -
Switching OS PIP(Picture-in-Picture) mode
During campaigns playing, even if the user navigates to the home screen or navigates to another app through the home button or home indicator, the playing campaigns can be switched to a small window within iOS. Set the Project as follows.
| Switching in-app PIP(picture-in-picture) mode | Switching OS PIP(Picture-in-Picture) mode |
|---|---|
 |
 |
- Switching in-app PIP(picture-in-picture) mode using API
// MainViewController.swift
class MainViewController: UIViewController {
...
override func switchingPictureInPicture() {
// Switching in-app PIP(picture-in-picture) mode
ShopLive.startPictureInPicture()
// Switching full-view mode
ShopLive.stopPictureInPicture()
}
...
} - Initialize the ShopliveShortform iOS SDK using the prepared Access Key.
// AppDelegate.swift
@main
class AppDelegate: UIResponder, UIApplicationDelegate {
var window: UIWindow?
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
// Override point for customization after application launch.
ShopLiveCommon.setAccesskey(accessKey : {YOUR_ACCESSKEY})
return true
}
}-
Shortform CollectionView has 3 types of layout and use builder to make each one of it.
CardTypeView
VerticalTypeView
HorizontalTypeView -
Building Shortform CollectionView
import UIKit
import ShopliveShortformSDK
class ViewController : UIViewController {
lazy private var builder : ShopLiveShortform.CardTypeViewBuilder = {
// let builder = ShopLiveShortform.ListTypeViewBuilder() // VerticalTypeView & HorizontalTypeView
let builder = ShopLiveShortform.CardTypeViewBuilder() // CardTypeView
builder.build(cardViewType: .type1,
listViewDelegate: self,
enableSnap: currentSnap,
enablePlayVideo: true,
playOnlyOnWifi: false,
cellSpacing: 20)
return builder
}()
lazy private var cardTypeView : UIView = {
return builder.getView()
}()
}
override func viewDidLoad(){
super.viewDidLoad()
self.view.addSubView(cardTypeView)
// call submit() to initialize data
builder.submit()
}
}-
Show DetailListView with two Different types of requestData
ShortformCollectionData
ShortformRelatedData -
Show Shortform DetailListView
import UIKit
import ShopliveShortformSDK
class ViewController : UIViewController {
override func viewDidLoad(){
super.viewDidLoad()
ShopLiveShortform.player(requestData : ShopLiveShortformCollectionData?)
ShopLiveShortform.player(requestData : ShopLiveShortformRelatedData?)
}
}- Show Shortform preview
import UIKit
import ShopliveShortformSDK
class ViewController : UIViewController {
override func viewDidLoad(){
super.viewDidLoad()
ShopLiveShortform.showPreview(requestData : ShopLiveShortformPreviewData?)
}