앱 템플릿 수정하기 편
1. 프로젝트 수정하기
1.1 앱 패키지명 변경하기
현재는 앱 템플릿을 그냥 읽어 드린 상태입니다. 내 앱에 맞춰 이름을 변경해주도록 합니다.
현재 HybridAppB01 로 되어있는 것을 MyApp 와 같이 구별 할 수 있는 이름으로 바꿈니다. 왼쪽 노란색으로 되어 있는 곳을 클릭한 후 F2 버튼을 누른 후 변경하시면 됩니다.
1.2 패키지명 변경
패지키명을 변경 하도록 합니다. 패키지명은 고유해야합니다. 현재 src>com.applusform.com.hybridappb01로 되어 있는 부분을 클릭한 후 F2를 누른 후에 변경합니다. 변경하는 규칙은 현재 사용하는 웹주소가 myshop.co.kr 이라면 kr.co.myshop.myshop1 이런식으로 변경하시면 됩니다.
1.3 URL변경(모바일페이지 주소변경 )
자신의 모바일페이지로 URL을 변경합니다. 위치는 개발툴의 왼쪽메뉴에서 /assets/moml/ui/main.xml의 WEBVIEW.homePage 부분입니다.(아래 화면의 노란색으로 칠해진 부분입니다.)
예로 아래와 같이 바꾸시면 됩니다.
homePage="http://google.com/shopping" - --> homePage="http://m.arena.co.kr/front/mobile"
1.4 로딩 이미지 변경하기
시작시 구글로그가 보이는 이미지를 바꾸는 부분입니다. 위치는 /assets/moml/ui/logo.png 입니다. 자신의 모바일 로고를 이용하시면 됩니다.
변경은 자신의 준비한 이미지 파일의 이름을 logo.png로 바꾸신 후 탐색기로 MyApp>assets>moml>ui까지 찾아가신 후 덮어쓰시거나 그냥 개발툴의 해당 디렉토리에 잡아다 끌어 놓으시면 됩니다.
로고 이미지는 화면 전체를 차지합니다. 화면전체에 맞게 800*1280의 비율(400**640)로 만드신 후 교체하시기 바랍니다.
변경한 후 실행한 화면입니다.
1.5 앱 아이콘 변경하기
앱을 깔면 나오는 아이콘을 바꾸는 부분입니다. 앱 아이콘은 앱을 받아 사용하는 사용자의 단말해상도에 따라 자동 선택이 되도록 여러개의 해상도로 만들어 주어야 합니다. 아이콘을 준비하신 후
/res/drawable-hdpi/ic_launcher.png : 72x72
/res/drawable-ldpi/ic_launcher.png : 36x36
/res/drawable-hdpi/ic_launcher.png : 48x48
/res/drawable-hdpi/ic_launcher.png : 96x96
/res/drawable-hdpi/ic_launcher.png : 144x144
의 이미지를 교체해주시면 됩니다.
이제 기본적인 앱의 구성을 다 만들었습니다. 푸시 기능을 사용하지 않는 다면 이상태로 앱을 배포할 수 있습니다.
아래 2장과 3장에서는 사용자들에게 이벤트 알림이나 공지사항을 알릴 수 있도록 푸시관련 서버를 사용하는 방법을 보도록 하겠습니다.
2. 무료 푸시서버(프로바이더) 등록 및 푸시서버에 앱 등록하기
** 푸시서버는 구글이나 애플에서 무료로 제공하는 서버를 말하며, 직접 앱이 연결이 될 수는 없습니다. 따라서 프로바이더 서버를 통해 푸시서버를 사용하는 것입니다.
일반적으로 사람들이 푸시서버를 개발한다고 하는 것은 프로바이더 서버를 개발한다는 것을 의미합니다. 여기서는 프로바이더 서버를 그냥 푸시서버라고 말하겠습니다.**
사용할 무료푸시서버는 Pushwoosh라고 하는 해외 무료 푸시 서버입니다. 국내 무료푸시를 찾아봤으나 아무리 찾아봐도 없습니다.
많은 사람이 무료로 사용하므로 안심하고 써도 좋습니다. 그럼 무료 푸시서버를 사용하기 위해서 서버에 가입하고 사용 할 앱을 등록 해보도록 하겠습니다.
(아래내용은 http://applusform.com/down/Pushwoosh.pdf 문서를 참고하여 만들어졌습니다.)
2.1 푸시후시(Pushwoosh)가입하기
푸시서버를 무료로 사용하기 위해서는 먼저 푸시서버에 가입을 해야 합니다.
- 가입은 메일 계정, ID, 암호 - 이렇게 3가지 정보만 받습니다.
- 웹 브라우저에서 http://pushwoosh.com 방문한 후 우측 상단의 [SIGN UP] 버튼을 누릅니다.
- Username 은 로그인 아이디로 사용합니다.
- Sign up 버튼을 누르면 가입됩니다. 하지만 로그인 하기 전에 이메일 인증을 해야 합니다.
2.2. 이메일 인증
- Pushwoosh : new account 와 같은 제목으로 온 메일을 찾아 링크를 클릭하여 이메일 인증을 마칩니다.
2.3. 로그인
- http://pushwoosh.com 에 접속하여 우측 상단의 열쇠 모양 아이콘을 눌러서 로그인합니다.
앞에서 등록한 계정 정보로 로그인을 합니다.
2.4. 앱 등록
- My apps 메뉴에서 Add new 버튼을 눌러서 앱을 등록합니다.
- Title 은 앱을 구분할 수 있는 이름을 씁니다. 이 이름은 Pushwoosh에서만 사용하고 나중에 수정할 수 있으므로 적당히 적어도 무방합니다.
- Icon은 단지 웹페이지에 보이기 위한 용도이므로 필수 사항은 아닙니다.
- SDK Setting 은 Android의 Pushwoosh 를 선택하고 Save 버튼을 눌러 앱 등록을 마칩니다.
2.5. 앱 메뉴
- 등록을 하고 나면 바로 푸시 메시지를 보낼 수 있는 페이지로 이동됩니다.
- 추후에는 상단의 My apps 버튼을 누른후 앱을 선택하여 이 페이지를 열 수 있습니다.
- 메시지를 작성하고 Woosh! 버튼을 클릭하면 메시지를 보낼 수 있습니다. 그러나 아직은 메시지를 보내도 동작하지 않습니다.
- User platforms 을 설정해야 실제로 폰에서 메시지를 받을 수 있습니다. 이를 설정하는 방법은 다음 장에서 다루겠습니다.
- 먼저 좌측상단의 PushTest1 밑에 있는 Application Code 는 실제 Android와 iOS 소스 수정 시 필요합니다. 적어두세요~(기록1)
- Edit application버튼을 눌러 앱의 이름을 수정할 수 있습니다.
여기까지는 가입 방법과 OS와 상관없이 무조건 설정해줘야 하는 부분들입니다.
3. Android Google Cloud Messaging(GCM) 서비스 설정
이부분은 내앱이 구글의 푸시서버를 사용하겠다고 구글 푸시서버에 등록하는 과정입니다.
- 이 장의 내용은 http://pushwoosh.com 의 Guides 내용을 바탕으로 한 것입니다.
- "Project Number" 와 "GCM API key"를 생성하는 것이 목표입니다. GCM은 구글에서 제공하는 푸시서버입니다.
- 서비스를 설정하기 위해서는 Google Play 개발자 계정이 필요합니다.
(안드로이드 개발자 등록 절차는 네이버나 구글에서 "안드로이드 개발자 등록 절차"를 검색하면 쉽게 찾으실 수 있습니다.)
3.1. 프로젝트 생성과 GCM 설정
- https://code.google.com/apis/console 에 Google Play 개발자 계정으로 로그인합니다.
- 왼쪽에서 현재 프로젝트를 선택하여 메뉴를 펼친 후 Create Project 를 생성합니다.
- 좌측의 Services 메뉴에서 Google Cloud Messaging for Android를 ON으로 합니다.
3.2. GCM API Key 얻기
- 좌측의 프로젝트의 API Access 메뉴에서 keys for browser apps 의 API key 를 마우스로 드래그한 다음 우클릭하여 복사합니다. (Create new Server key나 Create new Browser key 를 사용해 만들 수도 있습니다.)
- 이 API Key는 Pushwoosh 웹페이지의 Android 설정에 필요하므로 따로 복사(기록2)해 둡니다. (참고: 3.4. Pushwoosh에서 GCM API key 설정)
3.3. Project Number 얻기
- 좌측의 Overview 메뉴를 클릭해서 Dashboard 페이지에서 Project Number 를 복사합니다.
- 이 Project Number는 Android 프로젝트 소스에서 라이브러리 연동시 필요하므로 따로 복사(기록3)해 둡니다. (참고: 4.3 MainActivity.java 수정)
3.4. Pushwoosh에서 GCM API key 설정
- http://pushwoosh.com 에 로그인하여 My apps 메뉴에서 해당 앱을 선택한 후 우측의 User platforms에서 Android의 Configure버튼을 클릭합니다.
- API Key(기록2)를 입력합니다. (키값은 3.2 GCM API Key 얻기 참고)
4. 안드로이드 코드 수정하기
이제 푸시서버를 사용하기 위한 서버 준비는 다 되었습니다. 이제 푸시를 사용하기 위해 내앱에 앞서 설정한 푸시서버정보를 입력하도록 합니다. 안드로이드에서는 AndroidManifest.xml파일에서 앱에 대한 설정을 합니다. 이클립스(개발툴)의 왼쪽 메뉴를 보시면 파일들이 나오는데 아래쪽에 AndroidManifest.xml 파일이 있습니다. 더블클릭 후 오른쪽에서 AndroidManifest.xml탭을 클릭 하시면 아래와 같은 화면이 나옵니다.
4.1 AndroidManifest.xml 수정
안드로이드에서 푸시를 사용하기 위해서는 권한 설정을 해주어야 합니다. 현재 권한 설정은 되어 있으나 패키지 명이 틀립니다. 아래 빨간색 부분을 바꾸어 주어야 합니다.
AndroidManifest.xml 파일에서 아래 내용을 찾으신 후 빨간색으로 되어 있는 부분을 1.2 패키지명 변경을 참고하여 앞서 설정한 것과 동일하게 설정하도록 합니다.
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.applusform.webappa01"
android:versionCode="1"
android:versionName="1.0" >
|
<permission android:name="com.applusform.webappa01.permission.C2D_MESSAGE"
android:protectionLevel="signature" />
<uses-permission android:name="com.applusform.webappa01.permission.C2D_MESSAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.READ_PHONE_STATE"/>
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.VIBRATE"/>
<uses-permission android:name="android.permission.BROADCAST_STICKY"/>
<uses-permission android:name="android.permission.WAKE_LOCK"/>
<uses-permission android:name="android.permission.GET_ACCOUNTS"/>
<uses-permission android:name="com.google.android.c2dm.permission.RECEIVE" />
|
- 수정할 부분이 좀더 있습니다. 아래로 좀 내려와서 아래와 같은 부분을 찾으신부 빨간색으로 표시된 부분도 위에서 바꾼것과 같이 바꾸어 주도록 합니다.
<!-- for Pushwoosh 2/3 : 메시지 등록 -->
<intent-filter>
<action android:name="com.applusform.webappa01.MESSAGE" />
<category android:name="android.intent.category.DEFAULT" />
</intent-filter>
</activity>
<!-- for Pushwoosh 3/3 : receiver 와 service 등록 -->
<receiver
android:name="com.google.android.gcm.GCMBroadcastReceiver"
android:permission="com.google.android.c2dm.permission.SEND" >
<intent-filter>
<action android:name="com.google.android.c2dm.intent.RECEIVE" />
<action android:name="com.google.android.c2dm.intent.REGISTRATION" />
<category android:name="com.applusform.webappa01" />
</intent-filter>
</receiver>
|
다 해서 5군데 모두 바꾸셨는지 확인해 보시기 바랍니다.
4.2 MainActivitey 수정
이제 코드상으로는 거의 마지막 단계입니다. ^^; 작업하기 힘드네요...개발툴의 왼쪽의 src>com.applusform.com.hybridappb01>MainActivity.java 파일을 열어보신 후
위와 같이 노란색으로 표시되어 있는 부분을 아까 기록해 두었던 값으로 변경합니다. 화면의 윗부분이 기록1, 아랫부분이 기록3
이제 코드상으로 수정 할 부분은 모두 되었습니다. 재생버튼모양으로 생긴 버튼을 클릭하여 앱을 실행한 후 pushwoosh.com에 로그인 한 후 메세지를 보내면 푸시가 동작합니다. 여러번 테스트를 해보신 후 앱을 마켓에 올리시면 됩니다.
만들어진 앱을 마켓에 올리는 방법은 구글에서 "안드로이드 앱 배포방법"을 검색하면 자세히 많이 나와있습니다.~~
댓글 없음:
댓글 쓰기