메뉴 건너뛰기

조회 수 8459 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

기존에 등록한 폰갭에서 페이지 하나 띄우는 과정에 어떤분이 질문을 올리셨는데, 페이지 이동은 어떻게 하냐고 하셨다. 

순간 xml 리소스로부터 페이지객체를 불러오는 방식과 착각하여 페이지 하나당 네이티브클래스 하나가 매핑된다고 답을 드렸는데 정정을 한다.

 

나름대로 아는것을 정리해보면...

 

1. 먼저 기존에 만들어둔 index.html 파일을 다음과 같이 수정해본다.

 

<html>
 <head>
  <title>test</title>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
 </head>
 <body>
  <a href="./path1/mypage.html">Move</a>
 </body>
</html>

 

2. /assets/www 폴더 안에다가 path1 이란 경로를 하나 만들어서 그 경로안에다가 mypage.html 파일을 추가한 후 아래와 같이 내용을 입력한다.

 

<html>
 <head>
  <title>subpage</title>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
 </head>
 <body>
  <a href="../index.html">Home</a>
 </body>
</html>

 

3. Run 해보면 "Move" 링크가 나오는데 링크를 클릭하면 /path1/myapge.html 페이지가 뜨는 것을 확인할 수가 있다. 그리고, 마찬가지로 "Home" 링크를 클릭하면 다시 홈 화면이 나온다.

 

4. 즉, DroidGap 클래스를 상속받은 클래스가 loadUrl을 호출하여 초기페이지를 띄우고, 그다음부터는 일반 웹페이지 방식처럼 동작하는 것이다. ( 페이지별로 클래스 하나가 존재한다는거는 오랜 공백과정에 의한 착각이었다. )

 

5. 이렇게 일반 웹기술에서의 페이지 이동방식을 그대로 따르므로 assets 경로안에 있는 페이지 말고 네이버나 다른 페이지로의 이동도 가능하지만, 이렇게 할 이유가 없다. 필요한 페이지는 전부 assets 안에 존재해야 한다고 생각하자.

 

6. 문제는 순수하게 웹기술로만 코딩을 하면 폰하고 통신할 수단이 없다. 폰의 센서라든지 주소록 접근... 등등 폰만의 기능과 연동하려면 폰갭 플러그인을 이용해야 한다.

단순 웹기술로만 하면 굳이 앱으로 만들 이유가 없는 것이다.

 

7. 즉, html 코드 안에 폰갭 플러그인을 사용한다고 정의하고 약속된 규칙으로 사용하면 되는 것이다.

 

8. 폰갭 홈페이지( www.phonegap.com )에는 미리 만들어져있는 플러그인들이 소개되어 있으며, 사용방법이 나와있다.

 

9. 이렇게 존재하고 있는 플러그인을 사용하다 보면 나만의 기능을 가진 플러그인을 만들 필요성을 느끼게 된다.

 

10. 이때는 폰갭플러그인을 직접 만들어서 사용하면 된다.


List of Articles
번호 제목 날짜 조회 수
237 HTML5로 나만의 비디오 플레이어 스킨 만들기 -2- JavaScript file 2014.09.04 6312
236 HTML5로 나만의 비디오 플레이어 스킨 만들기 -3- JavaScript file 2014.09.04 6288
235 HTML5 드래그 앤 드롭 하기 Drag and Drop file 2014.09.04 7748
234 HTML5 Web Storage -01- file 2014.09.04 5587
233 HTML5 Form 공부하기 -1- file 2014.09.04 5841
232 HTML5 Form 공부하기 -2- file 2014.09.04 6329
231 HTML5로 게임 만들기 워밍업 file 2014.09.04 6063
230 HTML5 Better semantic tags file 2014.09.04 5952
229 HTML5 Geolocation (구글 지도에 현위치 표시하기) file 2014.09.04 6810
228 jQuery ajax post 요청 text 응답 2014.10.16 6702
227 JSON(JavaScript Object Notation) - jQuery Ajax - jQuery.getJSON() 메서드 (비동기적으로 JSON파일 로드) file 2014.10.16 6568
226 jQuery Ajax - jQuery.load() 메서드 (동적으로 원격 페이지 로드) file 2014.10.16 6409
225 트리뷰(TreeView) 컨트롤 file 2014.10.16 6722
224 Effects - Stop() 메서드 (애니메이션 효과 멈추기) file 2014.10.16 6225
223 Effects - Animate() 메서드 (여러가지 효과 동시 처리) file 2014.10.16 30624
222 Effects - SlideToggle() 메서드 (슬라이드 업/다운) file 2014.10.16 6758
221 Effects - SlideUp() 메서드 (슬라이드업) file 2014.10.16 5999
220 Effects - FadeIn() / FadeOut() 메서드 (서서히 보이기 및 숨기기) file 2014.10.16 6069
219 Effects - Show() / Hide() 메서드 (보이기 및 숨기기) file 2014.10.16 5957
218 Events - Unbind() 메서드 (이벤트 처리기 해제) file 2014.10.16 5749
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 13 Next
/ 13

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved