PLUG iOS 적용 가이드
Quick Start
최신 버전 다운로드
PLUG SDK를 사용하려면 XCode에서 다음과 같이 개발 환경을 설정합니다.
Build Settings의 Other Linker Flags에 -ObjC 옵션을 추가합니다.
다운로드한 샘플 프로젝트에 포함된 다음 라이브러리를 프로젝트에 추가합니다.
SDWebImage
FLAnimatedImage
네이버 아이디로 로그인
Build Phases의 Link Binary With Libraries에 다음 라이브러리를 추가합니다. 추가한 라이브러리의 Status는 Required로 설정합니다.
AVKit.framework
AVFoundation.framework
MobileCoreServices.framework
SystemConfiguration.framework
MediaPlayer.framework
AVFoundation.framework
CoreMedia.framework
AssetsLibrary.framework
Security.framework
ImageIO.framework
QuartzCore.framework
WebKit.framework
SafariServices.framework
ReplayKit.framework(라이브러리의 Status를 Optional로 설정합니다)
Info.plist의 사용자 권한 획득 옵션을 추가합니다.
NSCameraUsageDescription
NSPhotoLibraryUsageDescription
3. 초기화
PLUG SDK가 지원하는 언어에 따라 다음과 같이 PLUG SDK를 초기화합니다.
3.1 PLUG SDK 초기화(한국어만 지원 - 네이버 카페)
한국어만 지원하는 PLUG SDK를 초기화할 때는 다음과 같은 초기화 정보를 설정합니다.
네이버 아이디로 로그인 개발자 센터에서 애플리케이션을 등록하고 받은 클라이언트 아이디(ClientId)와 클라이언트 시크릿(ClientSecret)
네이버 카페에서 카페를 개설하고 받은 카페 ID
네이버 아이디로 로그인 개발자 센터에 애플리케이션을 등록할 때 입력한 URL Scheme
PLUG가 올라갈 부모 뷰 컨트롤러
채널 코드(한국어 채널만 사용할 때는
KOREAN
으로 설정)
3.2 PLUG SDK 초기화(외국어만 지원)
외국어만 지원하는 PLUG SDK를 초기화할 때는 다음과 같은 초기화 정보를 설정합니다.
consumerKey: 커뮤니티를 개설하고 받은 컨슈머 키(Consumer Key)
consumerSecretKey: 커뮤니티를 개설하고 받은 컨슈머 시크릿(Consumer Secret Key)
cummunityNo: 커뮤니티를 개설하고 받은 커뮤니티 No(cummunityNo)
loungeNo: 라운지를 개설하고 받은 라운지 No(cummunityNo)
PLUG가 올라갈 부모 뷰 컨트롤러
4. PLUG SDK 시작
초기화가 완료되면 PLUG SDK를 실행합니다.
4.1 presentMainViewController: 메서드
presentMainViewController: 메서드는 PLUG SDK를 시작하는 메서드입니다. 다음은 presentMainViewController: 메서드를 구현한 예입니다.
NCSDKManager 클래스 NCSDKManager 클래스는 PLUG SDK를 제어하는 클래스입니다. NCSDKManager 클래스로 제어할 수 있는 기능에 관한 자세한 내용은 PLUG SDK 상세 가이드의 "주요 기능 설명 상세"를 참고하십시오.
4.2 가로 모드, 세로 모드
PLUG SDK는 가로 모드와 세로 모드를 모두 지원합니다. 다음은 PLUG SDK를 가로 모드로 실행하는 예입니다.
네이버 아이디로 로그인 시 네이버 앱 사용
네이버 아이디로 로그인할 때 네이버 앱을 사용하려면 다음과 같이 추가 정보를 설정한다.
1. 네이버 아이디로 로그인에 애플리케이션을 등록할 때 입력한 URL Scheme을 프로젝트에 등록한다. 2. 플러그를 초기화할 때 네이버 앱 로그인을 허용하도록 다음과 같이 설정한다.
3. 네이버 아이디로 로그인이 완료되면 플러그에 로그인 정보가 설정될 수 있게 되게 다음과 같이 앱 델리게이트를 설정한다.
4. 애플리케이션에서 네이버 앱을 열 수 있게 다음과 같은 설정을 Info.plist 파일에 추가한다.
기본 채널 언어 설정
플러그의 언어별 커뮤니티인 채널의 기본 채널은 기기에 설정된 언어로 설정된다. 기본 채널을 특정한 언어로 설정하고 싶다면 setChannelCode: 메서드를 사용한다.
다음은 기본 채널을 한국어로 설정한 예다.
글로벌 커뮤니티와 국내 네이버 카페를 지원하는 플러그의 초기화
글로벌 커뮤니티와 국내 네이버 카페를 모두 지원할 때는 국내 네이버 카페를 지원하는 플러그의 초기화와 글로벌 커뮤니티를 지원하는 플러그의 초기화를 모두 적용한다.
Files and Folders
폴더 및 파일 이름 | 설명 |
guide/ | PLUG SDK 적용 가이드가 있는 폴더 |
lib/ | iOS용 PLUG SDK 라이브러리 파일이 있는 폴더 |
sample/external-lib | 외부 라이브러리 파일이 있는 폴더 |
sample/navercafesdk-sample-ios | Xcode용 샘플 프로젝트가 있는 폴더 |
LICENSE | 라이선스 파일 |
README.md | 리드미 파일 |
Dependent Libraries
PLUG SDK를 사용하려면 다음 라이브러리를 프로젝트에 추가해 함께 빌드해야 합니다. 라이브러리는 샘플 프로젝트에 포함돼 있습니다.네이버 아이디 로그인(4.0.7 버전)
AFNetworking(3.1.0 버전 )
AFNetworking 2.x 버전과 3.x 버전 모두 사용할 수 있습니다. PLUG SDK 테스트는 AFNetworking 3.1.0 버전으로 진행했습니다.
SDWebImage(3.8.2 버전)
FLAnimatedImage-(1.0.12 버전)
ApiGateway-1.5.0
플러그 시작과 종료
플러그를 특정한 탭이 선택된 상태로 시작하거나 플러그를 종료한다.
presentMainViewController: 메서드
플러그를 실행한다.
다음은 presentMainViewController: 메서드를 구현한 예다.
presentMainViewControllerWithTabIndex: 메서드
특정한 탭이 선택된 상태로 플러그를 시작한다.
다음은 presentMainViewControllerWithTabIndex: 메서드를 구현한 예다.
presentMainViewControllerWithArticleId: 메서드
게시판 탭에 특정한 게시글이 보이는 상태로 플러그를 시작한다.
다음은 presentMainViewControllerWithArticleId: 메서드를 구현한 예다.
presentArticlePostViewControllerWithType: 메서드
이미지 파일이나 동영상 파일이 첨부된 게시판 글쓰기 화면으로 플러그를 시작한다.
다음은 presentArticlePostViewControllerWithType: 메서드를 구현한 예다.
dismissMainViewController: 메서드
플러그를 종료한다.
다음은 dismissMainViewController: 메서드를 구현한 예다.
가로 모드, 세로 모드
플러그는 가로 모드와 세로 모드를 모두 지원한다.
다음은 플러그를 가로 모드로 실행하는 예다.
다음은 플러그를 세로 모드로 실행하는 예다.
투명도 조절
플러그 왼쪽 위의 투명도 조절 슬라이더로 투명도를 조절하면 게임과 카페를 동시에 사용할 수 있다.
투명도 | 설명 |
알파값 100% | 플러그로 터치 이벤트 전달 |
알파값 100% 이하 | 게임으로 터치 이벤트 전달 |
투명도 조절 기능은 플러그 1.4.0 이상부터 지원한다.
투명도 조절 슬라이더 사용 여부는 disableTransparentSlider: 메서드로 설정한다.
disable
파라미터의 값을 YES
로 설정하면 투명도 조절 슬라이더를 사용할 수 있다(기본값: YES).
다음은 투명도 조절 슬라이더를 사용하도록 구현한 예다.
다음은 투명도 조절 슬라이더를 사용하지 않도록 구현한 예다.
위젯
위젯은 플러그의 접기 버튼을 누르면 자동으로 화면에 나타나는 요소다. 위젯으로 게임 내 어디서든 플러그를 이용할 수 있다.
위젯 표시
플러그의 접기 버튼을 눌렀을 때 위젯을 표시할지는 showWidgetWhenUnloadSDK
속성으로 설정한다.
showWidgetWhenUnloadSDK
속성의 값을 YES
로 설정하면 플러그 창이 접힐 때 위젯이 나타난다(기본값: YES
).
다음은 위젯이 표시되도록 구현한 예다.
위젯 실행
위젯을 실행하려면 startWidget: 메서드를 사용한다.
startWidget 메서드는 플러그 1.7.0부터 지원한다.
다음은 위젯을 실행하는 예다.
위젯 닫기
위젯을 닫으려면 stopWidget: 메서드를 사용한다.
stopWidget 메서드는 플러그 1.7.0부터 지원한다.
다음은 위젯을 강제로 닫는 예다.
위젯 기본 위치 설정
위젯이 처음 실행될 때는 화면 왼쪽의 중앙에 나타난다. 위젯이 처음 실행될 때 나타날 기본 위치를 설정하려면 setWidgetStartPosition: 메서드와 andY: 메서드를 사용한다.
단, 사용자가 위젯을 옮긴 다음 위젯이 다시 실행될 때는 사용자가 이동한 마지막 위치에 위젯이 나타난다.
위젯의 기본 위치 설정은 플러그 2.3.0부터 지원한다.
다음은 위젯 기본 위치를 화면 오른쪽, 위에서 20% 위치로 설정하는 예다.
화면 캡처
위젯에서 화면 캡처 버튼을 누르면 게임 화면을 캡처할 수 있다.
화면 캡처 버튼
화면 캡처 버튼을 눌렀을 때 화면을 캡처하는 기능은 ncSDKWidgetPostArticleWithImage 메서드로 구현한다.
다음은 사용자가 위젯에서 화면 캡처 버튼을 누르면 ncSDKWidgetPostArticleWithImage 메서드를 호출하도록 델리게이트를 등록한 예다.
화면 캡처 사용 설정
useWidgetScreenShot
속성으로 화면 캡처 기능 사용 여부를 설정한다.
useWidgetScreenShot
속성의 값을 YES
로 설정하면 위젯에 화면 캡처 버튼이 표시된다(기본값: YES
).
동영상 녹화
위젯에서 동영상 녹화 버튼을 누르면 게임 화면을 녹화할 수 있다.
동영상 녹화 사용 설정
useWidgetVideoRecord
속성으로 동영상 녹화 기능 사용 여부를 설정한다.
useWidgetVideoRecord
속성의 값을 YES
로 설정하면 위젯에 동영상 녹화 버튼이 표시된다(기본값: NO
).
녹화 완료 처리
동영상 녹화가 완료됐을 때 처리할 작업은 ncSDKWidgetSuccessVideoRecord 메서드로 구현한다.
ncSDKWidgetSuccessVideoRecord 메서드는 플러그 1.7.0 이상부터 지원한다.
다음은 사용자가 위젯에서 동영상 녹화 버튼을 눌러 동영상 녹화를 완료하면 ncSDKWidgetSuccessVideoRecord 메서드를 호출하도록 델리게이트를 등록한 예다.
동영상 녹화
동영상 녹화 버튼을 누르면 게임 중에 게임 화면을 녹화할 수 있다.
동영상 녹화 기능은 iOS 9.0 이상 기기부터 지원한다.
위젯의 동영상 녹화 기능 사용
위젯의 동영상 녹화 버튼을 누르면 게임 중에 게임 화면을 녹화할 수 있다.
동영상 녹화 사용 설정 useWidgetVideoRecord
속성으로 동영상 녹화 기능 사용 여부를 설정한다.
useWidgetVideoRecord
속성의 값을 YES
로 설정하면 위젯에 동영상 녹화 버튼이 표시된다(기본값: NO
).
iOS 9.0 미만 기기에서는
useWidgetVideoRecord
속성의 값을YES
로 설정해도 위젯에 동영상 녹화 버튼이 표시되지 않는다.
다음은 동영상 녹화 기능을 사용하도록 구현한 예다.
녹화 완료 델리게이트
동영상 녹화가 완료됐을 때 처리할 작업은 ncSDKWidgetSuccessVideoRecord 메서드로 구현한다.
다음은 사용자가 위젯에서 동영상 녹화 버튼을 눌러 동영상 녹화를 완료하면 ncSDKWidgetSuccessVideoRecord 메서드를 호출하도록 델리게이트를 등록한 예다.
게임의 동영상 녹화 기능 사용
게임 개발사에서 동영상 녹화 버튼을 구현해 게임 화면을 녹화할 수 있다.
게임 개발사가 동영상 녹화 버튼을 구현해 동영상을 녹화하는 기능은 플러그 2.5.0 이상부터 지원한다.
동영상 녹화 시작과 종료를 직접 호출할 수 있는 코드는 NCSDKRecordManager.h 파일에 있다.
동영상 녹화 시작과 종료
동영상 녹화를 시작하려면 startRecord 메서드를 사용한다.
동영상 녹화를 종료하려면 stopRecord 메서드를 사용한다.
동영상 녹화 델리게이트
게임 개발사의 버튼으로 동영상을 녹화할 때 발생하는 이벤트를 처리하는 콜백 델리게이트는 다음과 같다.
App Scheme 처리
게임에서 플러그의 홈 화면에 나오는 배너 이미지를 누르면 App Scheme으로 이동해 게임 기능을 실행하게 할 수 있다.
App Scheme으로 이동할 배너 이미지는 카페 관리 메뉴에서 등록한다.
App Scheme으로 이동하는 배너 이미지를 누르면 openURL: 메서드를 실행해 App Scheme을 처리하도록 다음 예와 같이 앱 델리게이트를 설정한다.
다음은 App Scheme을 처리하도록 리스너를 구현한 예다.
리스너를 사용한 App Scheme 처리는 플러그 2.4.0 이상부터 지원한다.
콜백 델리게이트
콜백 델리게이트를 설정해 플러그에서 발생하는 이벤트를 처리한다.
콜백 델리게이트 등록
콜백 델리게이트를 처리할 뷰 컨트롤러를 NCSDKManager 클래스에 등록한다.
콜백 델리게이트 구현
플러그에서 이벤트가 발생할 때 콜백 델리게이트를 통해 호출되는 메서드는 다음과 같다.
게임 아이디 연동
사용자의 게임 아이디와 카페 아이디를 연동해 관리할 수 있다. 연동된 게임 아이디와 카페 아이디 목록은 카페 관리 메뉴에서 확인할 수 있다.
게임 아이디를 카페 아이디와 연동하려면 syncGameUserId: 메서드를 사용한다.
다음은 게임 아이디와 카페 아이디를 연동하는 예다.
테마 색상 변경
플러그의 테마 색상을 변경할 수 있다.
테마 색상을 변경하려면 setThemeColor: 메서드와 andTabBackgroundColor: 메서드를 사용한다.
themeColorCSString: 테마에서 기본으로 사용할 색상(기본값:
#00c73c
)backgroundCSSString: 탭 메뉴의 배경 색상(기본값:
#44484e
). 기본값을 사용하기를 권장한다.
주의 CSS 색상값에 알파값을 넣으면 안 된다.
올바른 예:
#ff9800
잘못된 예:
#e2ff9800
다음은 테마 색상을 변경하는 예다.
리소스 이미지 변경
네이버 카페 플러그 라이브러리에 포함된 리소스 이미지는 다음과 같이 변경할 수 있다.
NaverCafeSDK.bundle 패키지에 있는 이미지를 원하는 이미지로 바꾼다.
수정한 패키지를 네이버 카페 플러그 라이브러리에 적용한 다음 프로젝트를 빌드한다.
주의 이미지를 변경할 때 이미지의 크기는 기존 이미지와 동일해야 한다.
Last updated