release/20230525
- release/20230525
- HyperCLOVA Beta
Korean

iOS

인쇄
공유
PDF

iOS

인쇄
공유
PDF

Article Summary

Share feedback

Thanks for sharing your feedback!

Classic/VPC 환경에서 이용 가능합니다.

iOS에서는 iOS 환경에서 Native 플레이어 개발을 위한 Video Player Enhancement iOS SDK 사용 방법과 플레이어 적용 및 옵션 설정 방법을 설명합니다.

참고

iOS용 Video Player Enhancement SDK를 사용하려면 Standard 요금제를 이용해야 하며, 다음과 같은 사양이 요구됩니다.

최소 사양: iOS 14.0 이상
개발 환경: Xcode

SDK 설치 및 환경 구성

SDK를 설치하고 프레임워크를 추가하는 방법은 다음과 같습니다.

네이버 클라우드 플랫폼 콘솔의 Region 메뉴와 Platform 메뉴에서 이용 중인 환경을 클릭해 주십시오.
Services > Media > Video Player Enhancement 메뉴를 차례대로 클릭해 주십시오.
Video Player Management 메뉴를 클릭해 주십시오.
SDK를 다운로드할 플레이어의 [SDK 주소] 버튼을 클릭해 주십시오.
모바일 네이티브 SDKs 다운로드의 [IOS] 버튼을 클릭해 주십시오.
- 압축 파일이 다운로드됩니다.
Xcode를 실행한 후 추가하려는 프로젝트의 Targets > General 메뉴를 클릭해 주십시오.
Framework, Libraries, and Embedded Content에 'NCPlayerSDK.xcframework'를 Embed & Sign 타입으로 추가해 주십시오.

플레이어 적용 및 설정

플레이어를 적용하고 설정하려면 다음 절차를 진행해 주십시오.

1. 초기화
2. 플레이어 설정
3. 이벤트 설정

1. 초기화

다음과 같이 NCPlayerSDK 인스턴스를 초기화하고 Delegate 환경 설정을 해 주십시오.

...
import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...

    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
			
        NCPlayer.shared.delegate = self
    }
}

2. 플레이어 설정

플레이어를 설정하는 방법은 다음과 같습니다.

네이버 클라우드 플랫폼 콘솔의 Region 메뉴와 Platform 메뉴에서 이용 중인 환경을 클릭해 주십시오.
Services > Media > Video Player Enhancement 메뉴를 차례대로 클릭해 주십시오.
Video Player Management 메뉴를 클릭해 주십시오.
설정할 플레이어의 [SDK 주소] 버튼을 클릭해 주십시오.
Player SDK 주소 팝업 창이 나타나면 SDK 주소에서 access_key 값을 확인해 주십시오.
Xcode에서 NCPlayerView를 참조하는 Class와 UIView를 생성해 주십시오.

플레이어의 옵션을 설정해 주십시오.

플레이어 설정과 이 가이드의 Video Player Enhancement > 플레이어 설정 스크립트를 참고해 주십시오.

class player:NCPlayerView{}

class ViewController: UIViewController, NCPlayerDelegate {  
@IBOutlet weak var playerView: player?
}
override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)

    // SDK 초기화
    //licenseKey = access_key
    let licenseKey = "{access_key}"

    //플레이어 옵션 (콘솔에서 만들어진 스크립트 옵션을 사용)
    let playerOptions = """
    {
        "playlist":[
            {
                "file":"https://CDN도메인/example_video_01.mp4",
                "poster":"https://CDN도메인/example_video_01.png",
            }
        ],
        "autostart":true,
        }
   
    """
  
    NCPlayer.shared.initialize(licenseKey: licenseKey)
    NCPlayer.shared.delegate = self

    //실행
    playerView?.play(playerOptions)
    
}

3. 이벤트 설정

Player Event API를 통해 Video Player Enhancement 플레이어에서 발생하는 이벤트를 바인딩하여 활용할 수 있습니다. 방법은 다음과 같습니다.

NCPlayerNetworkStatus 메소드를 이용하여 디바이스의 네트워크 상태를 확인해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
...

    func NCPlayerNetworkStatus(state: String) {
    //state : satisfied = 이상 없음 (ONLINE)
    //state : unsatisfied = 문제 발생 (OFFLINE 혹은 통신 장애 발생)
    //state : requiresConnection = 현재 사용할 수 없지만 인터넷을 연결하면 사용 가능
    }
}

설정하고자 하는 이벤트에 따라 설정 방법을 확인해 주십시오.

가로모드 활성화 이벤트

디바이스를 가로로 전환 시 이벤트를 발생시키려면 NCPlayerIsLandscape 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...

    func NCPlayerIsLandscape(state: Bool) {

    }
}

스크린캡처 감지 이벤트(iOS 전용)

OS에서 스크린 캡처 시 이벤트를 발생시키려면 NCPlayerIsCaptured 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
	
    func NCPlayerIsCaptured(state: Bool) {

    }
}

OS 화면 녹화 감지 이벤트(iOS 전용)

OS에서 화면 녹화 상태 감지 시 이벤트를 발생시키려면 NCPlayerIsRecording 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
	
    func NCPlayerIsRecording(state: Bool) {

    }

}

TimeUpdate 이벤트

재생 시간 변화 감지 시 이벤트를 발생시키려면 NCPlayerOnTimeUpdate 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
	
    func NCPlayerOnTimeUpdate(data: Dictionary<String, Any>?) {
    //data = ["duration": 117, "percent": 31.26565391099825, "viewingTime": 37, "currentTime": 37, "sourceType": vod]
    }

}

각 속성에 대한 설명은 다음과 같습니다.

프로퍼티(속성)	유형	설명
duration	int	영상 전체 길이
currentTime	int	현재 재생 위치
percent	int	현재 재생 퍼센트
viewingTime	int	누적 재생 시간
sourceType	string	재생 소스 타입

PrevTrack 이벤트

플레이리스트 중 이전 영상으로 이동 시 이벤트를 발생시키려면 NCPlayerOnPrevTrack 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
	
    func NCPlayerOnPrevTrack(data: Dictionary<String, Any>?) {

    }
}

각 속성에 대한 설명은 다음과 같습니다.

프로퍼티(속성)	유형	설명
file	string	영상 URL
poster	string	썸네일 이미지
title	string	영상 제목
created_at	string	영상 날짜
profile_name	string	프로필 이름
profile_image	string	프로필 이미지

NextTrack 이벤트

플레이리스트 중 다음 영상으로 이동 시 이벤트를 발생시키려면 NCPlayerOnNextTrack 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
	
    func NCPlayerOnNextTrack(data: Dictionary<String, Any>?) {

    }

}

각 속성에 대한 설명은 다음과 같습니다.

프로퍼티(속성)	유형	설명
file	string	영상 URL
poster	string	썸네일 이미지
title	string	영상 제목
created_at	string	영상 날짜
profile_name	string	프로필 이름
profile_image	string	프로필 이미지

컨트롤바 활성화 이벤트

플레이어에서 컨트롤바 활성/비활성화 시 이벤트를 발생시키려면 NCPlayerOnControlbarActive 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
	
    func NCPlayerOnControlbarActive(active: Bool) {
        // active : true , false
    }
}

재생 이벤트

플레이어에서 영상 재생 시 이벤트를 발생시키려면 NCPlayerOnPlay 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
	
    func NCPlayerOnPlay() {

    }
}

일시정지 이벤트

플레이어에서 영상 일시정지 시 이벤트를 발생시키려면 NCPlayerOnPause 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
	
    func NCPlayerOnPause() {

    }
}

재생 완료 이벤트

플레이어에서 영상 재생 완료 시 이벤트를 발생시키려면 NCPlayerOnEnd 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
	
    func NCPlayerOnEnd() {

    }
}

전체화면 이벤트

플레이어를 전체화면으로 전환 시 이벤트를 발생시키려면 NCPlayerOnFullscreen 메소드를 이용하여 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
	
    //전체화면이 꺼졌을 때 발생하는 이벤트
    func NCPlayerOnFullscreenOff() {

    }
	
    //전체화면이 되었을 때 발생하는 이벤트
    func NCPlayerOnFullscreenOn() {

    }
	
    //전체화면이 되었을 때 구분 true / false
    func NCPlayerOnFullscreen(state: Bool?) {

    }
}

버튼을 이용한 전체화면 동작을 위해서 다음과 같이 설정해 주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
    var currentOrientationMask: UIInterfaceOrientationMask = .portrait
    var currentOrientation: UIInterfaceOrientation = .portrait
    
        //가로로 돌렸을때 전체화면 및 세로로 돌렸을때 되돌아오기
        func NCPlayerRequestOrientation(orientation: String) {
            if (orientation == "landscape") {
                currentOrientationMask = .landscape
                currentOrientation = .landscapeRight
            } else {
                currentOrientationMask = .portrait
                currentOrientation = .portrait
            }
            applyOrientation(orientation: currentOrientation)
        }
        
        override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
            return currentOrientationMask;
    }
    override var preferredInterfaceOrientationForPresentation: UIInterfaceOrientation {
        return currentOrientation;
    }
    override var prefersStatusBarHidden: Bool {
        return currentOrientation.isLandscape
    }
}
extension NSLayoutConstraint {
    func applyAspectRatio(view: UIView, ratio: CGFloat) -> NSLayoutConstraint {
        let newConstraint = NSLayoutConstraint(item: self.firstItem!, attribute: self.firstAttribute, relatedBy: self.relation, toItem: self.secondItem, attribute: self.secondAttribute, multiplier: ratio, constant: self.constant)
        view.removeConstraint(self)
        view.addConstraint(newConstraint)
        view.layoutIfNeeded()
        return newConstraint
    }
}

}

디바이스의 orientation을 활용한 전체 화면 동작을 위해서는 NCPlayerisLandscape를 다음과 같이 설정 해주십시오.

import NCPlayerSDK
...
class ViewController: UIViewController, NCPlayerDelegate{
    ...
    
    var currentOrientationMask: UIInterfaceOrientationMask = .portrait
    var currentOrientation: UIInterfaceOrientation = .portrait
    
    func NCPlayerIsLandscape(state: Bool) {
        if state {
            currentOrientationMask = .landscape
            currentOrientation = UIDevice.current.orientation == .landscapeLeft ? .landscapeRight : .landscapeLeft
        }else{
            currentOrientationMask = .portrait
            currentOrientation = .portrait
        }
        
        applyOrientation(orientation: currentOrientation)
    }
    
    override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
        return currentOrientationMask;
    }
    
    override var preferredInterfaceOrientationForPresentation: UIInterfaceOrientation {
        return currentOrientation;
    }
    
    override var prefersStatusBarHidden: Bool {
        return currentOrientation.isLandscape
    }
}
extension NSLayoutConstraint {
    func applyAspectRatio(view: UIView, ratio: CGFloat) -> NSLayoutConstraint {
        let newConstraint = NSLayoutConstraint(item: self.firstItem!, attribute: self.firstAttribute, relatedBy: self.relation, toItem: self.secondItem, attribute: self.secondAttribute, multiplier: ratio, constant: self.constant)
        view.removeConstraint(self)
        view.addConstraint(newConstraint)
        view.layoutIfNeeded()
        return newConstraint
    }
}

}

이 문서가 도움이 되었습니까?

What's Next

Android

SDK 설치 및 환경 구성
플레이어 적용 및 설정

태그