기존에 등록한 폰갭에서 페이지 하나 띄우는 과정에 어떤분이 질문을 올리셨는데, 페이지 이동은 어떻게 하냐고 하셨다.
순간 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. 이때는 폰갭플러그인을 직접 만들어서 사용하면 된다.
화면 해상도에 관계없는 레이아웃(Layout) 만들기
