youtube-ios-player-helper는 YouTube iframe 플레이어를 iOS 애플리케이션에 삽입하는 데 도움이 되는 오픈소스 라이브러리입니다. 이 라이브러리는 애플리케이션의 Objective-C 코드와
YouTube 플레이어의 JavaScript 코드 간에
WebView 및 브리지를 만들어 iOS 애플리케이션이 YouTube 플레이어를 제어할 수 있도록 합니다. 이 도움말에서는 라이브러리를 설치하고 iOS 애플리케이션에서 라이브러리를 사용하기 시작하는 단계를 설명합니다.
설치
이 도움말에서는 최신 버전의 iOS를 타겟팅하는 새 단일 뷰 애플리케이션 iOS 프로젝트를 만들었고 프로젝트를 만들 때 다음 파일을 추가한다고 가정합니다.
Main.storyboardViewController.hViewController.m
CocoaPodsCocoaPods를 통해 또는 프로젝트의 GitHub 페이지에서 라이브러리 및 소스 파일을 복사하여 라이브러리를 설치할 수 있습니다.
- CocoaPods를 통해 라이브러리를 설치할 수 있습니다. 또는 프로젝트의 GitHub 페이지를 통해 라이브러리 및 소스 파일을 사용할 수 있으며 기존 프로젝트에 복사할 수 있습니다.
CocoaPods를 통해 라이브러리 설치
프로젝트에서 CocoaPods를 사용하는 경우 아래 줄을 Podfile에 추가하여 라이브러리를 설치합니다.
이 줄에서 x.y.z를 프로젝트의 GitHub 페이지에서 식별되는 최신 포드 버전으로 바꿉니다.
pod "youtube-ios-player-helper", "~> x.y.z"
명령줄 프롬프트에서 pod install을 입력하여 종속 항목으로 작업공간을 업데이트합니다.
도움말: CocoaPods를 사용하는 경우 .xcodeproj 파일이 아닌 Xcode에서 .xcworkspace 파일을 열어야 합니다.
자세한 내용은 CocoaPods 튜토리얼을 참고하세요.
라이브러리 수동 설치
도우미 라이브러리를 수동으로 설치하려면 GitHub의 다운로드 링크를 통해 소스를 다운로드하거나 저장소를 클론합니다. 코드의 로컬 사본이 있으면 다음 단계를 따르세요.
Xcode 또는 Finder에서 샘플 프로젝트를 엽니다.
YTPlayerView.h,YTPlayerView.m, 애셋 폴더를 선택합니다. Xcode에서 작업공간을 열면 포드 -> 개발 포드 -> YouTube-Player-iOS-Helper 및 포드 -> 개발 포드 -> YouTube-Player-iOS-Helper -> 리소스 에서 사용할 수 있습니다. Finder에서 이러한 파일은 클래스 및 애셋 디렉터리의 프로젝트 루트 디렉터리에서 사용할 수 있습니다.이러한 파일과 폴더를 프로젝트로 드래그합니다. Copy items into destination group’s folder(항목을 대상 그룹의 폴더에 복사) 옵션이 선택되어 있는지 확인합니다. 애셋 폴더를 드래그할 때는 Create Folder References for any added folders(추가된 폴더의 폴더 참조 만들기) 옵션이 선택되어 있는지 확인합니다.
이제 라이브러리가 설치되었습니다.
인터페이스 빌더 또는 스토리보드를 통해 YTPlayerView 추가
인터페이스 빌더 또는 스토리보드를 통해 YTPlayerView를 추가하려면 다음 단계를 따르세요.
-
UIView인스턴스를 뷰로 드래그합니다. -
ID 검사기를 선택하고 뷰의 클래스를
YTPlayerView로 변경합니다. -
ViewController.h를 열고 다음 헤더를 추가합니다.#import “YTPlayerView.h”다음 속성도 추가합니다.
@property(nonatomic, strong) IBOutlet YTPlayerView *playerView;
-
인터페이스 빌더에서 이전 단계에서 정의한 뷰 요소에서 뷰 컨트롤러의 playerView
playerView속성으로 연결을 만듭니다. -
이제
ViewController.m을 열고 다음 코드를viewDidLoad메서드 끝에 추가합니다.[self.playerView loadWithVideoId:@"M7lc1UVf-VE"];
애플리케이션을 빌드하고 실행합니다. 동영상 썸네일이 로드되면 동영상 썸네일을 탭하여 전체 화면 동영상 플레이어를 실행합니다.
동영상 재생 제어
ViewController::loadWithVideoId: 메서드에는 개발자가 추가 플레이어
변수를 뷰에 전달할 수 있는
loadWithVideoId:playerVars:라는 대안이 있습니다. 이러한 플레이어 변수는
IFrame Player API의 플레이어 매개변수에 해당합니다. playsinline 매개변수를 사용하면 동영상이 전체 화면으로 재생되는 대신 뷰에서 직접 재생될 수 있습니다. 동영상이 인라인으로 재생될 때
포함된 iOS 애플리케이션은 프로그래매틱 방식으로 재생을 제어할 수 있습니다.
loadWithVideoId: 호출을 다음 코드로 바꿉니다.
NSDictionary *playerVars = @{ @"playsinline" : @1, }; [self.playerView loadWithVideoId:@"M7lc1UVf-VE" playerVars:playerVars];
스토리보드 또는 인터페이스 빌더를 엽니다. 두 개의 버튼을 뷰로 드래그하고
재생 및 중지로 라벨을 지정합니다. ViewController.h를 열고 버튼에 매핑될 다음 메서드를 추가합니다.
- (IBAction)playVideo:(id)sender; - (IBAction)stopVideo:(id)sender;
이제 ViewController.m을 열고 다음 두 함수를 정의합니다.
- (IBAction)playVideo:(id)sender { [self.playerView playVideo]; } - (IBAction)stopVideo:(id)sender { [self.playerView stopVideo]; }
대부분의 IFrame Player API 함수에는 Objective-C에 상응하는 함수가 있지만 Objective-C 코딩 가이드라인에 더 가깝게 맞추기 위해 이름이 약간 다를 수 있습니다. 주목할 만한
예외는 동영상의 볼륨을 제어하는 메서드입니다. 이러한 메서드는
전화기 하드웨어 또는 이 용도로 설계된 UIView 인스턴스(예: MPVolumeView)로 제어되기 때문입니다.
스토리보드 또는 인터페이스 빌더를 열고 Control 키를 누른 상태로 드래그하여 재생 및
중지 버튼을 playVideo: 및 stopVideo: 메서드에 연결합니다.
이제 애플리케이션을 빌드하고 실행합니다. 동영상 썸네일이 로드되면 재생 컨트롤 외에도 기본 컨트롤을 사용하여 동영상을 재생하고 중지할 수 있습니다.
플레이어 콜백 처리
재생 상태 변경 및 재생 오류와 같은 재생 이벤트를 프로그래매틱 방식으로 처리하는 것이 유용할 수 있습니다. JavaScript API에서는 이벤트 리스너를 사용하여 이 작업을 수행합니다. Objective-C에서는 대리자를 사용하여 이 작업을 수행합니다.
다음 코드는 클래스가 대리자 프로토콜을 준수하도록
ViewController.h에서 인터페이스 선언을 업데이트하는 방법을 보여줍니다.
ViewController.h의 인터페이스 선언을 다음과 같이 변경합니다.
@interface ViewController : UIViewController<YTPlayerViewDelegate>
YTPlayerViewDelegate는 플레이어에서 재생 이벤트를 처리하기 위한 프로토콜입니다.
일부 이벤트를 처리하도록 ViewController.m을 업데이트하려면 먼저
ViewController 인스턴스를 YTPlayerView
인스턴스의 대리자로 설정해야 합니다. 이 변경사항을 적용하려면 viewDidLoad 메서드
ViewController.h에 다음 줄을 추가합니다.
self.playerView.delegate = self;
이제 ViewController.m에 다음 메서드를 추가합니다.
- (void)playerView:(YTPlayerView *)playerView didChangeToState:(YTPlayerState)state { switch (state) { case kYTPlayerStatePlaying: NSLog(@"Started playback"); break; case kYTPlayerStatePaused: NSLog(@"Paused playback"); break; default: break; } }
애플리케이션을 빌드하고 실행합니다. 플레이어 상태가 변경될 때 Xcode에서 로그 출력을 확인합니다. 동영상이 재생되거나 중지될 때 업데이트가 표시됩니다.
라이브러리는 편의성과 가독성을 위해 kYT* 접두어로 시작하는 상수를 제공합니다. 이러한 상수의 전체 목록은
YTPlayerView.m을 참고하세요.
권장사항 및 제한사항
이 라이브러리는 WebView를 만들고
기본 플레이어에 필요한 HTML 및 JavaScript를 렌더링하여 IFrame Player API를 기반으로 빌드됩니다. 이 라이브러리의 목표는
개발자가 자주 작성해야 하는 메서드를
패키지에 번들링하여 최대한 사용하기 쉽게 만드는 것입니다. 다음과 같은 몇 가지 제한사항이 있습니다.
- 이 라이브러리는 여러
YTPlayerView인스턴스에서 동시 동영상 재생을 지원하지 않습니다. 애플리케이션에 여러YTPlayerView인스턴스가 있는 경우 권장되는 권장사항은 다른 인스턴스에서 재생을 시작하기 전에 기존 인스턴스에서 재생을 일시중지하거나 중지하는 것입니다. 프로젝트와 함께 제공되는 샘플 애플리케이션에서 ViewControllers는NSNotificationCenter를 사용하여 재생이 곧 시작된다는 알림을 전달합니다. 다른 ViewControllers에 알림이 전송되고YTPlayerView인스턴스에서 재생이 일시중지됩니다. - 가능한 경우 기존에 로드된
YTPlayerView인스턴스를 재사용합니다. 뷰에서 동영상을 변경해야 하는 경우 새UIView인스턴스 또는 새YTPlayerView인스턴스를 만들지 말고loadVideoId:또는loadPlaylistId:를 호출하지 마세요. 대신cueVideoById:startSeconds:함수 패밀리를 사용합니다. 이 함수 패밀리는WebView을 다시 로드하지 않습니다. 전체 IFrame 플레이어를 로드할 때 눈에 띄는 지연이 있습니다. - 이 플레이어는 비공개 동영상을 재생할 수 없지만 일부 공개 동영상을 재생할 수 있습니다. 이 라이브러리는 기존 iframe 플레이어를 래핑하므로 플레이어의 동작은 모바일 브라우저의 웹페이지에 삽입된 플레이어의 동작과 거의 동일해야 합니다.
참여
이 프로젝트는 오픈소스 프로젝트이므로 GitHub 프로젝트의 기본 브랜치에 수정사항과 개선사항을 제출해 주세요.