안드로이드 웹뷰(WebView)를 이용한 예제 프로그램 (2)

http://zeany.net/4 에서 기본적인 웹 페이지를 보여주는 앱을 구현했으며, 아래 3가지 사항에 대해 여기에서 보완하도록 합니다.

1) 화면을 가로/세로 모드로 변환하면 다시 페이지를 로딩함 

2) 안드로이드의 Back 버튼을 누르면 바로 앱이 종료됨 (이전 페이지가 있으면 그 곳으로 이동하는 것이 일반적인 기대)

3) Alert이나 Confirm과 같은 Popup이 전혀 보이지 않음

1. 가로/세로 모드 변환 시 페이지를 다시 로딩하지 않도록 수정

app/src/main/AndroidManifest.xml 의 .MainActivity에 configChanges를 아래처럼 추가해서 화면이 전환되더라도 새로 웹페이지를 로딩하지 않도록 합니다.

그 외 다른 옵션들은 https://developer.android.com/guide/topics/manifest/activity-element.html 참조하세요.

1 2 3 4 5

<activity android:name=".MainActivity" android:configChanges="orientation|keyboardHidden|screenSize"> <intent-filter> ...

2. Back 버튼을 눌렀을 때 이전 페이지가 있으면 그 곳으로 이동하도록 수정

app/src/main/java/net/zeany/myapplicaiton/MainActivity.java 에 onKeyDown()을 overriding한다. 기본적인 동작은 이전 Activity로 이동하는 것이고, 현재 앱이 가지고 있는 Activity는 MainActivity 하나이기 때문에 Back 버튼을 누르기만 하면 홈 화면으로 이동하는 것이 기본 동작입니다.

이 이벤트를 잡아서 지금 보여주는 웹페이지의 이전 페이지가 있으면 그 페이지로 이동하도록 하고, 그렇지 않다면 예전처럼 처리하도록 합니다.

mWebView의 url에 따른 분기 처리등으로 여러 갈래의 동작을 지정할 수도 있습니다.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

@Override protected void onCreate(Bundle savedInstanceState) { ... } @Override public boolean onKeyDown(int keyCode, KeyEvent event) { if (keyCode == KeyEvent.KEYCODE_BACK) { if (mWebView.canGoBack()) { mWebView.goBack(); return false; } } return super.onKeyDown(keyCode, event); }

3. Alert과 Confirm에 대한 처리

MainActivity.java의 onCreate() 메소드에 다음 코드를 추가합니다.

mWebView에 WebChromeClient()의 인스턴스를 생성하여 setWebChromeClient() 메소드를 통해 등록합니다. 이 코드의 역할은 신규 생성한 WebChromeClient에서 Alert이나 Confirm이 발생한 경우 해당 내용을 AlertDialog로 처리하도록 구현하는 것이 요지로 이렇게 처리하지 않는 경우 Popup창이 발생해도 보이지 않아 화면이 동작하지 않는 것으로 착각할 수 있습니다.

※ 단순히 mWebView.setWebChromeClient(new WebChromeClient() {}); 만 해도 그럭저럭 보여줄 수 있으니 참고하세요.

 

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48

mWebView = (WebView) findViewById(R.id.activity_main_webview); ... mWebView.setWebChromeClient(new WebChromeClient() { @Override public boolean onJsAlert(WebView view, String url, String message, final JsResult result) { new AlertDialog.Builder(view.getContext()) .setTitle("Alert") .setMessage(message) .setPositiveButton(android.R.string.ok, new AlertDialog.OnClickListener(){ public void onClick(DialogInterface dialog, int which) { result.confirm(); } }) .setCancelable(false) .create() .show(); return true; } @Override public boolean onJsConfirm(WebView view, String url, String message, final JsResult result) { new AlertDialog.Builder(view.getContext()) .setTitle("Confirm") .setMessage(message) .setPositiveButton("Yes", new AlertDialog.OnClickListener(){ public void onClick(DialogInterface dialog, int which) { result.confirm(); } }) .setNegativeButton("No", new AlertDialog.OnClickListener(){ public void onClick(DialogInterface dialog, int which) { result.cancel(); } }) .setCancelable(false) .create() .show(); return true; } }); mWebView.loadUrl(ENTRY_URL);

이상으로 단순히 원하는 웹페이지를 보여주는 안드로이드 앱을 만들어 보았습니다.

※ 이 프로젝트는 https://github.com/zeany/webview 에 있으며 아래 명령으로 소스를 가져올 수 있습니다.

(이미 git clone 으로 프로젝트를 내려 받은 경우에는 프로젝트 홈 디렉토리에서 git checkout 만 하면 됩니다.)

git clone https://github.com/zeany/webview.git

cd webview

git checkout -f step-3