카카오링크만들기

50
KakaoLink for Swift 창원대학교 정보통신공학과 김대호

Transcript of 카카오링크만들기

Page 1: 카카오링크만들기

KakaoLink for Swift창원대학교 정보통신공학과 김대호

Page 2: 카카오링크만들기

목차

• SDK 설치

• 카카오 API 앱 만들기

• xocde 와 카카오 앱과 연동

• Bridging

• 샘플 앱 만들기

Page 3: 카카오링크만들기

SDK설치

developers.kakao.com 사이트에 들어가 최신 SDK를 받는다

Page 4: 카카오링크만들기

SDK설치

다운 받은 폴더에KakaoOpenSDK.frameWork가

있는지확인한다

Page 5: 카카오링크만들기

SDK설치

KakaoOpenSDK.framework를 자신이 넣고자 하는 프로젝트로 Copy 시킨다

Page 6: 카카오링크만들기

SDK설치

반드시 Copy items if needed를 체크하고 Finish를 누르자

Page 7: 카카오링크만들기

SDK 설치 확인KakaoOpenSDK 가 제대로 깔렸는지 확인하자

Page 8: 카카오링크만들기

SDK 설치Build Phasers-> Link Binary With

Libraries 에서 프레임 워크가 심어졌는지 확인할 수 있다

Page 9: 카카오링크만들기

SDK 설치해당 화면에서 Command+F를 눌러 other linker…를 검색하여

Other Linker Flags 를 찾아낸다

Page 10: 카카오링크만들기

SDK 설치Other Linker Flags 의 값을 ‘-all_load -ObjC’로 해준다

Page 11: 카카오링크만들기

카카오톡 API 앱 만들기다시 카카오 개발자 사이트에 들어가 로그인한후, 화면 상단의 내 어플리케이션 버튼

을 클릭해준다

Page 12: 카카오링크만들기

새로운 앱을 만들어준다

카카오톡 API 앱 만들기

Page 13: 카카오링크만들기

앱이름은 자기가 원하는 이름으로 하고 Create를 누른다

카카오톡 API 앱 만들기

Page 14: 카카오링크만들기

해당 화면이 생성되면 성공!

카카오톡 API 앱 만들기

Page 15: 카카오링크만들기

생성된 앱으로 간뒤, 앱 정보 -> 설정을 누른다

Xcode와 카카오 앱 연동

Page 16: 카카오링크만들기

이제 카카오톡 API와 Xcode프로젝트를 연결시켜야한다 플렛폼 추가 버튼을 누른다

Xcode와 카카오 앱 연동

Page 17: 카카오링크만들기

iOS 를 누르고, 번들ID를 입력해야하는데 Xcode 프로젝트의 번들ID와 반드시 같아야한다

Xcode와 카카오 앱 연동

Page 18: 카카오링크만들기

바로 요놈!

Xcode와 카카오 앱 연동

Page 19: 카카오링크만들기

Xcode의 번들ID를 입력하고 추가버튼을 누르자!

Xcode와 카카오 앱 연동

Page 20: 카카오링크만들기

다시 Xcode로 돌아가서, info->URL Types를 찾는다

Xcode와 카카오 앱 연동

Page 21: 카카오링크만들기

Xcode와 카카오 앱 연동

1.카카오 앱의 REST API 키를 URL Schemes에 붙인다

Page 22: 카카오링크만들기

Xcode와 카카오 앱 연동

2. 이때, 앞에 ‘kakao’라는 단어를 입력후 붙여줘야한다

Page 23: 카카오링크만들기

1. Supporting Flies-> Info.plist에 들어간다

Xcode와 카카오 앱 연동

Page 24: 카카오링크만들기

2. KAKAO_API_KEY의 StringKey를 하나 생성하고 REST API를 넣는다

Xcode와 카카오 앱 연동

Page 25: 카카오링크만들기

Bridging

• 새롭게 개발된 Swift언어는 이전의 Objective-C언어를 바로 읽어 수 없다

• Xcode에서 제공되는 Objective-C Bridging를 이용해 ObjectiveC와 Swift를 연결 할 수 있다

Page 26: 카카오링크만들기

Bridging

Objective-c로 구성된 프레임 워크를 Swift로 가져올수 있게 헤더파일을 생

성한다

Page 27: 카카오링크만들기

BridgingIOS->Source 혹은 OS X-> Source를 통해 Header File을 생성한다

Page 28: 카카오링크만들기

Bridging

이름은 KakaoOpenSDK-Bridging-Header.h 입력하고 Create를 누른다

Page 29: 카카오링크만들기

Bridging

BulidSetting에서 Command+F 를 눌러 bri..를 치면 Objective-C Bridging Header 를 찾을수 있다

Page 30: 카카오링크만들기

Bridging

이 녀석을 그대로 방금만들었던 헤더파일이름을 넣자

Page 31: 카카오링크만들기

Bridging

KakoOpenSDK-Bridging-Header.h 에들어가 빨간 박스의 내용을 입력해주

Page 32: 카카오링크만들기

Bridging

카카오 앱을 불러오는 헤더파일이다 안드로이드, 아이폰, 기타 등등의 폰에 깔린 카카오톡을 찾아 불러온다

Page 33: 카카오링크만들기

Bridging

카카오 링크 기능을 가져오는 헤더 파일이다 카카오링크로 생성된 버튼을 눌렀을때 나타나는 반응(Action)을 보여

주는 함수이다

Page 34: 카카오링크만들기

Bridging

카카오 링크가 생성한 링크 오브젝트, 텍스트, url, 앱으로연결 할 수 있는 헤더파일

이다.

Page 35: 카카오링크만들기

샘플 앱 만들기

본격적으로 카카오링크를 호출하는 샘플을 만들어보자

Page 36: 카카오링크만들기

MainStroyBoard로 이동해 버튼을 하나 생성한다

샘플 앱 만들기

Page 37: 카카오링크만들기

생성된 버튼을 연결된 ViewController에 IBAction을 하여 함수를 생성한다 이름은

actKakaoLink

샘플 앱 만들기

Page 38: 카카오링크만들기

actKakoLink에 해당 내용을 입력해준다

샘플 앱 만들기

Page 39: 카카오링크만들기

createLabel : 카카오톡에 보여질 Label

샘플 앱 만들기

Page 40: 카카오링크만들기

실제로 요렇게 보여지게되는 라벨

샘플 앱 만들기

Page 41: 카카오링크만들기

카카오톡에 보여질 이미지, url과 크기를 지정해 줄 수 있다

샘플 앱 만들기

Page 42: 카카오링크만들기

실제로 요렇게 보여지게되는 이미지

샘플 앱 만들기

Page 43: 카카오링크만들기

카카오톡에 보여질 웹 링크 해당 링크를 넣으면 url 홈페이지로 이동한다

하지만 url를 넣을때, 사이트 도메인을 지정해줘야한다

샘플 앱 만들기

Page 44: 카카오링크만들기

실제로 요렇게 보여지게되는 이미지

샘플 앱 만들기

Page 45: 카카오링크만들기

앱으로 이동하는 함수 웹링크와 유사한 형식이나 기종에 따른 마켓으로 이동할수 있도록 만듬

샘플 앱 만들기

Page 46: 카카오링크만들기

앱 이동 하기를 버튼으로 만들어 주는 함수이다

샘플 앱 만들기

Page 47: 카카오링크만들기

실제로 요렇게 보여지게되는 이미지

샘플 앱 만들기

Page 48: 카카오링크만들기

마지막으로 라벨, 이미지, 웹링크, 앱링크를 여러개로 묶어서 전달 해주는 함수이다

샘플 앱 만들기

Page 49: 카카오링크만들기

참고한 자료

https://devtalk.kakao.com/t/swift/9745

https://developers.kakao.com/docs/ios

Page 50: 카카오링크만들기

감사합니다