본문 바로가기

hybrid app/phonegap

[phonegap cordova] ios plugin 만들기

phonegap plugin을 사용하면 다양한 네이티브 기능을 가능하게 해준다.


이 플러그인을 직접 만들어보자.


일단 폰갭프로젝트를 생성한다.


http://squll1.tistory.com/entry/phonegap-cordovaios-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-%EC%83%9D%EC%84%B1


우선 알아두어야 할 것은 폰갭 플러그인을 만들기 위해서는 CDVPlugin을 상속받아야만 한다.


이제 간단하게 AlertView를 호출하는 플러그인을 만들어 보겠다.



1. 첫번째로 네이티브 기능을 만들어 보겠습니다.


Plugins폴더에 파일을 만듭니다.



Cocoa Touch에 Objective-C class를 선택하고 next를 누릅니다.



class이름을 입력하고 subclass는 CDVPlugin으로 합니다.


next를 누르고 create버튼을 눌러 생성합니다.


~~.h 파일에 에러가 나는데 다음과 같이 수정합니다.




그리고 네이티브 기능을 작성하시면 됩니다.





2. 두번째로 config.xml파일을 열어 방금 작성한 플러그인을 추가 해야 합니다.



name에는 이 플러그인을 사용할 이름과 value는 생성한 클래스의 이름을 입력합니다.





3. 세번째로 자바스크립트에서 플러그인을 호출합니다.


cordova.exec(<successfunction>, <failfunction>, <service>, <action>, [<args>]);


cordova.exec(function(){console.log('success')},function(err){console.log('err')},"AlertView","customAlertView",["플러그인 테스트"]);




이렇게 추가하고 실행 시켜면 다음과 같이 실행된다.



<success function>도 잘 실행된걸 확인할 수 있습니다.



cordova.exec(function(){console.log('success')},function(err){console.log('err')},"AlertView","customAlertView",["플러그인 테스트"]);


이 부분을 다시 살펴보겠습니다.


우선 세번째  "AlertView"는 config.xml에서 플러그인을 추가 했을때 name의 값을 넣어줍니다. 


그리고 네번째 "customAlertView"는 생성한 클래스에서 사용할 메소드명을 넣어줍니다.


다섯번째는 네이티브쪽으로 전달해줄 정보를 넣어줍니다.


위에서 설정한 정보가 전달되고 함수가 실행되어 네이티브 기능이 실행됩니다.


그리고 이렇게 네이티브 기능이 실행된후 잘 실행됐는지 안됐는지 기타 정보들을 담아서 다시 자바 스크립스 상으로 정보를 전달합니다.


코드를 다시 살펴보면



위 코드의 pluginResult와 resultJS를 통해 플러그인이 잘 실행됐는지 잘못실행됐는지 정보를 담아


자바스크립트 쪽으로 정보를 전달합니다.


cordova.exec(function(){console.log('success')},function(err){console.log('err')},"AlertView","customAlertView",["플러그인 테스트"]);


에서 첫번째나 두번째 함수가 실행됩니다.


이 자바스크립트로 전달할때 다른 정보를 담아서 전달 할수도 있습니다.


문자열을 전달할수도 있고 배열에 정보를 담아 전달 할 수 있습니다.


다음과 같이 정보를 담아 전달해 보자 



다음과 같이 정보가 담기는걸 확인 할 수 있다.



이 콜백되는 정보를 받아 적절히 사용해 개발할 경우도 생긴다.


첫번째 <successfunction>에서 정보를 받아온다.


아래와 같이 정보를 받아와 콘솔창에 출력해 본다.



정보를 잘 받아오는걸 확인할 수 있다.