GuidesAPI GuideChangelog
Log In
Guides

E. PIP로 바로 시작하기

시청자가 방송을 보기 전에 앱이 원하는 화면에서 PIP 로 바로 시작합니다. 라이브 ID 를 앱이 정하면 PIP 와 같은 API 를, 방송 선택까지 SDK 에 맡기면 setOnAirInit() 을 씁니다.

E. PIP로 바로 시작하기 — 소스라이브 플레이어 iOS SDK
⏱ 예상 소요 시간: 10분
📋 사전 조건: D. PIP로 전환하기 — 같은 API 를 사용합니다
앱 홈 화면 위에 떠 있는 작은 플레이어
▲ 앱 홈 화면 위에 떠 있는 작은 플레이어
PIP로 전환하기와의 차이

둘 다 작은 창으로 보이지만 시작하는 시점이 다릅니다.
D. PIP로 전환하기 는 보던 플레이어를 작은 창으로 줄이는 것이고, 이 페이지는 보기 전에 앱이 원하는 화면에서 PIP 로 바로 시작하는 것입니다.
라이브 ID 를 앱이 정할 때는 PIP 와 같은 PIPKit 을 부르는 시점만 다르게 씁니다.
방송 선택까지 SDK 에 맡길 때는 전용 API setOnAirInit() 을 씁니다 → 진행 중인 방송으로 띄우기

D. PIP로 전환하기E. PIP로 바로 시작하기
시작 시점시청자가 방송을 보던 중시청자가 방송을 보기 전
시작하는 쪽시청자 — PIP 버튼
또는 앱이 startPIPMode() 호출
앱 코드
쓰는 APIPIPKit.show · startPIPMode()PIPKit.show · startPIPMode() — PIP 와 동일
또는 setOnAirInit()
목적보던 방송 이어 보기진행 중인 방송으로 시청자 유입

작은 창은 한 번에 하나만 뜹니다. PIP 창이 떠 있을 때 이 페이지의 방식으로 띄우면 기존 PIP 창이 닫히고 새 창만 남습니다.

연동하기

홈 화면이 나타날 때 플레이어를 띄우고 바로 작은 창으로 전환합니다.

Swift
class HomeVC: UIViewController {

    private var player: SauceLivePlayerClient?

    private func showFloatingPlayer(broadcastID: String) {
        guard !PIPKit.isActive else { return }   // 이미 떠 있으면 중복 실행 방지

        let player = SauceLivePlayerClient.getInstance(
            broadcastID: broadcastID,
            token: userToken,
            viewController: self
        )
        player.onClose = { PIPKit.dismiss(animated: true) }

        PIPKit.show(with: player)
        player.startPIPMode()      // 곧바로 작은 창으로

        self.player = player
    }
}
⚠️ 중복 실행을 반드시 막으세요 — PIPKit.show 를 이미 떠 있는 상태에서 다시 부르면 기존 창을 닫고 새로 띄웁니다. 홈 화면은 여러 번 나타나므로 PIPKit.isActive 로 확인하는 코드가 필요합니다.
표시할 방송 선택

라이브 ID 를 앱이 정할지, SDK 가 고를지에 따라 쓰는 API 가 다릅니다.

앱이 라이브 ID 지정SDK 가 자동 선택
쓰는 APIPIPKit.show · startPIPMode()setOnAirInit()
띄울 방송앱이 정한 라이브 IDLIVE 방송 중 가장 최근에 시작한 하나
위치·크기SDK 고정값옵션으로 지정

라이브 ID 를 앱이 정할 때는 아래 순서로 준비합니다.

  • 1
    편성이 정해져 있다면 — 라이브 ID 를 앱에 내려 주는 자사 API 를 만들어 홈 진입 시 조회합니다.
  • 2
    방송이 없을 때 — 플로팅을 띄우지 않습니다. 진행 중이 아닌 라이브 ID 로 띄우면 빈 화면이 보입니다.
  • 3
    방송 목록·편성 정보가 필요하면 담당자에게 문의해 주세요.
진행 중인 방송으로 띄우기

setOnAirInit() 은 파트너의 LIVE 방송 중 가장 최근에 시작한 방송 하나를 SDK 가 골라, LIVE 뱃지가 붙은 작은 창으로 띄웁니다.

Swift
// SauceClient 초기화 이후 호출합니다
SauceLivePlayerClient.setOnAirInit(partnerID: "파트너 ID")

위치·크기·뱃지 이미지를 정하고, 선택 결과와 상태를 받으려면 옵션과 콜백을 함께 넘깁니다.

Swift
SauceLivePlayerClient.onFloatingStateChanged = { state in
    // .full / .mini / .systemPIP / .closed
}
SauceLivePlayerClient.onFloatingClosed = { reason in
    // .user / .host / .broadcastEnded
}

let options = SauceOnAirFloatingOptions(
    width: 120,
    position: .bottomRight,
    offsetY: 56,                                     // 하단 탭바만큼 띄우기
    badgeImageUrl: "https://example.com/live-badge.svg"
)

SauceLivePlayerClient.setOnAirInit(
    partnerID: "파트너 ID",
    options: options,
    token: "발급받은 사용자 토큰"
) { result in
    switch result {
    case .selected(let broadcastID, let state): break
    case .none: break   // LIVE 방송 없음 · 조회 실패 · 잘못된 입력
    }
}
⚠️ env 는 초기화의 환경과 별개입니다. setOnAirInit() 의 env 는 LIVE 방송 목록을 조회할 환경만 정합니다.
생략하면 초기화(apiHost)와 관계없이 운영(.production) 목록을 조회합니다. 스테이지로 테스트할 때는 초기화와 별도로 env 도 .stage 로 지정합니다.

작은 창은 영상만 재생합니다. 채팅·상품 등 상호작용은 없습니다.
탭하면 전체 플레이어로 전환됩니다.
드래그로 옮길 수 있고, 놓으면 가장 가까운 모서리에 붙습니다.
옵션·결과·제어 메서드 전체 → API · 콜백 → Event handler

항목동작
방송 선택상태가 onair·warning 인 방송 중 시작 시각이 가장 최근인 하나를 고릅니다. 시작 시각이 없는 방송은 뒤로 갑니다.
목록은 호출 1회당 1회 조회합니다.
방송 교체띄운 뒤 다른 방송이 시작돼도 바뀌지 않습니다. 다시 고르려면 setOnAirInit() 을 다시 호출합니다.
동시 실행한 번에 하나의 플레이어만 띄웁니다.
방송 종료작은 창과, 작은 창에서 넘어간 시스템 PIP 동안 30초마다 방송 상태를 확인합니다.
LIVE 가 아니게 되면 뱃지를 숨기고 닫습니다(.broadcastEnded). 조회에 실패하면 유지합니다.
뱃지 이미지PNG·SVG 만 씁니다. JPG 이거나 3초 안에 불러오지 못하면 기본 LIVE 뱃지를 표시합니다.
뱃지 높이 24pt, 최대 너비 80pt.
초기화SauceClient 초기화 이후에 호출합니다. 최소 지원 버전은 iOS 13 입니다.
스크롤에 따라 띄우기

스크롤 위치에 따라 띄우는 옵션은 없습니다.
앱이 스크롤을 감지해 원하는 시점에 호출합니다.

  • 1
    스크롤 위치를 감지합니다. 화면의 스크롤 리스너에서 현재 위치를 읽습니다.
  • 2
    기준을 넘으면 호출합니다. PIPKit.show · startPIPMode() 또는 setOnAirInit() 을 부릅니다.
제약 사항

PIPKit.show 로 띄운 작은 창의 위치·크기는 SDK 고정값입니다. → D. PIP로 전환하기
setOnAirInit() 으로 띄운 창은 옵션으로 정합니다. → API



Did this page help you?
🏠 소스라이브 🎬 소스클립 🔗 소스링크 📢 소스애드
🧩 API 가이드
🆕 최근 업데이트
💬 도움이 더 필요하신가요?
메일로 문의 카카오톡 채널로 문의
담당자에게 문의하기

궁금한 점이나 불편했던 점을 남겨주시면 담당자가 확인 후 답변드릴게요.

가이드 챗봇
* AI를 활용해 답변해서 사실과 다를 수도 있어요. 더 궁금한 사항은 '담당자에게 문의하기'를 이용해주세요.
💡 궁금한 솔루션(예: 라이브, 링크 등)을 함께 적어주시면 더 정확한 답변을 받을 수 있어요.