PhoneGap 안드로이드 프로젝트 생성하기

저번 포스팅에서 폰갭 샘플 소스를 돌려봤으니

이번에는 폰갭을 이용하여 안드로이드 앱을 만들때 꼭 해줘야할 기본작업에 대해 알아보겠습니다

안드로이드 프로젝트를 생성하고 샘플소스를 뚝딱뚝딱 붙여넣기를 해주면 된답니다.




< PhoneGap 안드로이드 프로젝트 생성하기 >



1. 안드로이드 프로젝트 생성하기

이클립스를 켜고 File - New - Android Project를 차례로 선택합니다.
만약 Android Project 가 보이지 않을 경우  File - New 메뉴 맨 아래 Other...라는 메뉴가 있는데

요기 들어가서 찾으시면 됩니다.

Android Project를 선택하면
아래와 같은 창이 뜨는데 Project name과 만들 앱의 안드로이드 버전을 선택합니다.
그리고 Package name은 유니크한 이름일수록 좋기때문에 아래와 같이 적어줍니다.
안드로이드에 설치될시 Package name으로 폴더를 만들어서 설치되기 때문에 다른 어플과 겹치지 않도록 해주는게 좋습니다.
다 적었으면 Finish 버튼 클릭!!
(다운받아놓은 안드로이드 버전이 너무 많아서... 스샷찍기가 힘드네요..;;)

 





그럼 요렇게 프로젝트가 생성된걸 확인할 수 있습니다.

 



자 그럼 먼저 포스팅에서 생성한 Example 프로젝트를 펼쳐놓습니다.
그리고 libs 라는 폴더가 있는데 과감하게 복사해서 생성한 프로젝트명을 클릭하고 뿍 붙여넣습니다.
( libs라는 폴더 안에 phonegap-1.x.jar가 들어있는데 요게 폰갭 라이브러리로 꼭 필요하답니다 )

 






붙여넣기를 했다면 프로젝트명을 클릭하고 마우스 오른쪽 클릭을해줍니다.
메뉴가 쭉 나올텐데 맨아래 Properties 를 클릭하면 아래와 같은 창이 열립니다.
오른쪽 메뉴에서 Java Build Path를 선택하고 3번째 탭인 Libraries 를 차례로 선택합니다.

 





 Add JARs 버튼을 클릭하면 또 작은 창이 팝업되는데 요기서 아까 뿍 집어넣은 phonegap-1.x.jar 파일을 선택해줍니다.
요작업이 왜 필요하냐면 복사해서 넣은 라이브러리파일을 요 프로젝트에서 사용하겠다라고 정의해주는 일이기 때문에 꼭 해주셔야합니다.
추가된것을 확인하셨다면 OK 버튼 클릭!!

 





요기까지 잘 따라하셨다면 아래 빨간 박스처럼 참조된 라이브러리가 생성되었을겁니다.
그러고 이제  Example 폴더에 있는 xml 폴더를 복사해서 우리가 만든 프로젝트의 같은 경로에 붙여넣기 해줍니다.

 





그리고 android project 에는 AndroidManifest.xml 라는 매우 중요한 파일이 있습니다.
이 파일을 열고 맨 마지막에 .xml 탭을 클릭합니다.
AndroidManifest.xml 의 기능은 우리가 만드는 어플이 '인터넷을 쓸수 있게 한다' 혹은 '카메라 기능을 허가한다' 등의 권한을 부여해줍니다. 아무리 코딩을 카메라를 쓸수 있도록 만들어도 요 매니페스트 파일이 허가 해주지 않으면 쓸 수 없어요.

 


이제 Example 프로젝트의  AndroidManifest.xml 를 열고 아래의 빨간 박스의 부분만 복사하여 새로 생성한 프로젝트의 AndroidManifest.xml의 같은 위치에 붙여넣기 해줍니다.

요기까지 했다면 기본적인 작업은 모두 다 해놓은 상태입니다.
이제 코딩하는 일만 남았어요~~!
src 폴더를 열어봅니다. 패키지가 하나 있지요? 또 열어봅니다. 그럼 java 파일이 한 생성되어 있을겁니다.
이 파일을 열고 아래와 같이 수정해주세요. ( 이부분도 Example 프로젝트를 보고 따라서 수정하시면 됩니다. ) 

 





수정하셨다면 이제 프로젝트에 assets 라는 폴더에 www라는 폴더를 하나 생성합니다.
( assats라는 폴더를 우클릭하고 New -  Folder 클릭 )
그리고 Example 프로젝트에서 같은 경로에 있는 phonegap-1.x.js 파일을 복사해서 붙여넣기 해줍니다.
복사해 넣었다면 index.html 파일을 하나 생성하여 아래와 같이 코딩해줍니다.

요기까지 작업을 했다면 이제 실행시켜 봅니다.
아래와 같이 나왔다면 성공!! index에 코딩한대로 나온것을 확인할수 있습니다.

요정도 작업까지 해놓으셨다면 이제부터는 html과 javascript 작업으로 어플을 개발할 수 있어요.
웹에 친숙한 분이시라면 앱도 금방 만드실수 있을꺼라는 생각이 드네요~