안드로이드 webview를 이용한 간단한 앱 만들기

일단 안드로이드로 웹 앱을 일반 앱 처럼 실행시키기 위해서 간단한 앱을 만들어볼 수 없는 알아보니(이전에 윈도우 비주얼 계열에서 IE모듈로 장난 처본 경험이 있어서) webview라는 위젯이라고 하던데 있었다. 물론 webkit계열 브라우저들을 쓰고 있으니 당연히 관련 라이브러리가 있으리라 생각은 했지만...

일단 개발환경은 준비한다. 간단하게 설명하자면 다음과 같다 :

1. 자바 SDK 다운로드/설치
2. 이클립스 다운로드/설치
3. 안드로이드 SDK 다운로드/설치 : 인스톨버전으로 했다가 설치가 잘 안되서 그냥 압축버전으로 압축풀고 디렉토리 안에 SDK Manager.exe 실행
4. 이클립스에서 안드로이드 개발관련 소프트웨어 설치

이클립스를 실행하고 안드로이드 프로젝트를 실행한다. 프로젝트명이나 패키지명은 자기가 원하는대로(안드로이드 2.3.3 환경에서 작성)

 [AndroidManifest.xml]

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="com.webapp"
      android:versionCode="1"
      android:versionName="1.0">
    <uses-sdk android:minSdkVersion="10" />
    <!-- 아래코드는 인터넷에 접속하기 위해 꼭 필요 -->
    <uses-permission android:name="android.permission.INTERNET"></uses-permission>
    <application android:icon="@drawable/icon" android:theme="@android:style/Theme.NoTitleBar">
        <activity android:name=".WebappActivity"
                  android:label="@string/app_name">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

 매니페스트 파일을 일단 저렇게 세팅 크게 다른 부분은 없고, 권한 설정 및 노 타이틀바, 액티비티 이름 설정 정도? res/main.xml 에서 액티비티 속성을 설정한다.

[main.xml]

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:screenOrientation="portrait"
    >
<WebView
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:id="@+id/webapp"
    android:screenOrientation="portrait"
    />
</LinearLayout>

이제는 소스코드

[webActivity.java]

package com.webapp;

import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class WebappActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
       
        WebView web=(WebView)findViewById(R.id.webapp);
        web.getSettings().setJavaScriptEnabled(true);

        // 스크롤바 없애기
        web.setHorizontalScrollBarEnabled(false);
        web.setVerticalScrollBarEnabled(false);
        web.setBackgroundColor(0);
 
        web.setWebViewClient(new WebViewClient(){

                @Override
                public boolean shouldOverrideUrlLoading(WebView view, String url) {
                        // TODO Auto-generated method stub
                        view.loadUrl(url);
                        return true;
                }
       });

        try {
                web.loadUrl("http://jquerymobile.com");
        } catch(Exception ex) {
                ex.printStackTrace();
        }
}}

이렇게 하고 Run!

참고로 어플이름은 values/strings.xml에서 수정. 아이콘은 고치는법을 까먹었다;
추가로 스플래쉬 화면이나 인터넷 연결이 안되는 경우 에러화면, 내장 메뉴등 네이티브한 기능을 추가해 볼 생각. 모바일 관련 스타일(포커스 스타일) 및 속성 수정 및 이벤트(orientation)들에 관한 코드를 덧붙일 예정(웹페이지에서).

* 그나저나 -_- syntaxhighlight를 버전업 해야겠다; 예전꺼를 쓰고 있었네