Global It Leader!!



 
 

모바일 안드로이드에서 웹뷰(WebView) 사용법

페이지 정보

작성자 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 댓글 0건 조회 5,596회 작성일 15-05-14 13:58

본문

안드로이드에서 웹뷰(WebView) 사용법

(1) 웹뷰 : 웹 페이지를 보여주는 위젯

- 네트워크 입출력, 캐싱, 링크 클릭 처리, 확대, 축소, 히스토리 관리 등 웹브라우저가 제공하는 모든 기능을 자체적으로 제공

- 안드로이드 내장 웹킷(WebKit)라이브러리가 모든 것을 처리

- 웹킷은 오픈 소스이며 사파리, 크롬등에 채용되어 이미 성능 입증,신뢰성이 높음

(2) WebView구현순서

1) 매니페스트에  INTERNET 퍼미션 지정

: 모바일 장비에서 네트워크의 사용은 요금과 관련되므로 배포시 사용자의 허가나 동의가 필요하므로

 3739861259_1416530044.7883.png

 

<!—인터넷 연결을 한다는 것을 명시하는 선언문 -à

<uses-permission android:name="android.permission.INTERNET"/>

2) layout에서 WebView를 설정

 

<WebView

           android:id="@+id/webView1"

           android:layout_width="match_parent"

           android:layout_height="match_parent" />

3) WebView에서 loadUrl을 이용해 모바일웹을 로딩

 

WebView wv= (WebView) findViewById(R.id.webView1);

wv.loadUrl("http://m.sports.daum.net/sports/soccer/schedule/today/");

4) WebSettings클래스로 WebView상태를 설정

 

WebSettings set = wv.getSettings();

set.setJavaScriptEnabled(true); // javascript를 실행할 수 있도록 설정

set.setJavaScriptCanOpenWindowsAutomtically (true);   // javascript window.open()을 사용할 수 있도록 설정

set.setBuiltInZoomControls(true); // 안드로이드에서 제공하는 줌 아이콘을 사용할 수 있도록 설정

set.setPluginState(WebSettings.PluginState.ON_DEMAND); // 플러그인을 사용할 수 있도록 설정

set.setSupportMultipleWindows(true); // 여러개의 윈도우를 사용할 수 있도록 설정

set.setSupportZoom(true); // 확대,축소 기능을 사용할 수 있도록 설정

set.setBlockNetworkImage(false); // 네트워크의 이미지의 리소스를 로드하지않음

set.setLoadsImagesAutomatically(true); // 웹뷰가 앱에 등록되어 있는 이미지 리소스를 자동으로 로드하도록 설정

set.setUseWideViewPort(true); // wide viewport를 사용하도록 설정

set.setCacheMode(WebSettings.LOAD_NO_CACHE); // 웹뷰가 캐시를 사용하지 않도록 설정

// (참고사이트) http://developer.android.com/reference/android/webkit/WebSettings.html

5) 페이지 navigation처리

: WebView로 구현시에는 첫 화면 로딩시에는 액티비티 내로 브라우저 내용이 보이지만 그 이후 페이지 내에 링크를 통해 리로딩될 시에는 내장된 브라우저가 실행 되어 버립니다.

만약 현재 액티비티 안에서만 계속 리로딩하고 싶으면 아래에 언급될 WebViewClient를 사용하도록 합니다.

 

//(참고사이트) http://developer.android.com/reference/android/webkit/WebViewClient.html

wv.setWebViewClient(new TabWebViewClient());

 

           private class TabWebViewClient extends WebViewClient {

                     @Override

                    

                     public boolean shouldOverrideUrlLoading(WebView view, String url) {

                               

                                System.out.println("ImageAdapter.bPopUp:["+ImageAdapter.bPopUp+"],URL :[" + url+ "]");

                                if(ImageAdapter.bPopUp == true){

                    Intent i = new Intent(Intent.ACTION_VIEW, Uri.parse(url));

                    view.getContext().startActivity(i);

                    return true;                                      

                                }else{

                                          System.out.println("[else]bPopUp:["+ImageAdapter.bPopUp+"],URL :[" + url+ "]");

                                          view.loadUrl(url);

                                          return true;

                                }

                     }

 

                     public void onReceivedError(WebView view, int errorCode,

                                          String description, String failingUrl) {

                                Toast.makeText(act, "Some Error :" + description, Toast.LENGTH_SHORT)

                                                     .show();

                     }

           }         

이 소스에서는 shouldOverrideUrlLoadingonReceivedError만 구현했으나 많은 메소드들이 있는 클래스임

대표적인 메소드에 대해서는

 

void     onLoadResource(WebView view, String url)

외부 리소스를 불러올 때 처리할 내용을 구현한다.

 

void     onPageFinished(WebView view, String url)

페이지 로딩이 완료 되었을 때 처리할 내용을 구현한다.

 

void     onPageStarted(WebView view, String url, Bitmap favicon)

페이지 로딩이 시작될 때 처리할 내용을 구현한다.

 

void     onReceivedError(WebView view, int errorCode, String description, String failingUrl)

오류가 발생했을 때 처리할 내용을 구현한다.

 

 

void     onScaleChanged(WebView view, float oldScale, float newScale)

스케일이 변경되었을 때 처리할 내용을 구현한다.

 

WebResourceResponse   shouldInterceptRequest(WebView view, String url)

리소스 요청이 있을 때 처리할 내용을 구현한다.

 

boolean shouldOverrideKeyEvent(WebView view, KeyEvent event)

키 이벤트 발생시에 처리할 내용을 구현한다.

 

boolean shouldOverrideUrlLoading(WebView view, String url)

새로운 Url을 불러 오려고 할 때 처리할 내용을 구현한다.

 

 

출처 : http://blog.daum.net/dayhyub/69 

 

 

27383D4A53D370150EF252 안드로이드 webview 속성

 

webview = (WebView)findViewById(R.id.web_main);

webview.getSettings().setJavaScriptEnabled(true);

WebSettings set = webview.getSettings();

 

set.setJavaScriptEnabled(true); // javascript를 실행할 수 있도록 설정

set.setJavaScriptCanOpenWindowsAutomatically (true);   // javascript가 window.open()을 사용할 수 있도록 설정


set.setBuiltInZoomControls(false); // 안드로이드에서 제공하는 줌 아이콘을 사용할 수 있도록 설정

set.setSupportZoom(false); // 확대,축소 기능을 사용할 수 있도록 설정

 

set.setPluginState(WebSettings.PluginState.ON_DEMAND); // 플러그인을 사용할 수 있도록 설정

set.setSupportMultipleWindows(false); // 여러개의 윈도우를 사용할 수 있도록 설정

 

set.setBlockNetworkImage(false); // 네트워크의 이미지의 리소스를 로드하지않음

set.setLoadsImagesAutomatically(true); // 웹뷰가 앱에 등록되어 있는 이미지 리소스를 자동으로 로드하도록 설정

set.setUseWideViewPort(true); // wide viewport를 사용하도록 설정

 

set.setCacheMode(WebSettings.LOAD_NO_CACHE); // 웹뷰가 캐시를 사용하지 않도록 설정

 

 

27383D4A53D370150EF252기본적으로 해주어야 할 것

 

webview = (WebView)findViewById(R.id.web_main);

webview.getSettings().setJavaScriptEnabled(true);

WebSettings set = webview.getSettings();

 

set.setJavaScriptEnabled(true); // javascript를 실행할 수 있도록 설정

set.setSupportZoom(false); // 확대,축소 기능을 사용할 수 있도록 설정

set.setCacheMode(WebSettings.LOAD_NO_CACHE); // 웹뷰가 캐시를 사용하지 않도록 설정

 

 

27383D4A53D370150EF252외부에서 URL 불러올 때, 사이트에 따라 확대 및 축소가 안되는 경우도 있다.

 

 

1. Web-View에 대한 기본적인 세팅

 

 - Web-view를 사용하기 위해서 기본적으로 뷰를 불러왔을때 세팅해줘야 하는 값들이 있다.

  1) javascript 실행여부

  2) default URL(실행시 켜지는 URL 설정)

  3) 웹뷰를 실행할 때 사용할 브라우져 설정 ( 예제에서는 사용자가 지정한 브라우져가 실행되게 되어있다.)

// web-view settings

 

mWebView.getSettings().setJavaScriptEnabled(true); // java-script ok

 

mWebView.loadUrl([YOUR_SITE_URL]);                    // to set first url

 

mWebView.setWebViewClient(new WebViewClient());// web-view settings on default browser 

 - 자바스크립트를 사용가능하게 됬을때의 현상

  ~ 자바스크립트는 외부(웹 사이트의 클라이언트 레이어)에서 오는 내용이 많다.

  ~ 스크립트로 인해서 안드로이드와 충돌될 가능성이 있다며 Waring을 발산해준다.

  ~ 무시해도 되는 경고지만 보기 싫으니 @SuppressLint("SetJavaScriptEnabled") 를 추가한다.


 ※ SuppressLint, Lint tool 이란?

 - Lint tool을 언급한 것이 처음이라 간단하게 언급하고 넘어가려고 한다.

 - Lint는 프로그래머 입장에서 완벽한 코드이지만, 충돌 가능성이 존재할 것 같다고 IDE가 판단한 것이다.

 - 자신의 코드가 더럽혀져 있는 것을 보기싫은 프로그래머는 Lint tool을 이용하여 경고를 없애버린다.

 예를들어, min-sdk 이후에 개발된 컴퍼넌트를 사용하게 되는 상황이 있다. 이 경우 프로그래머는 SDK의 버전을 불러와서 예외처리를 해준다. 신/구버전에 대한 체크를 다하였지만, 프로그래머 눈에는 계속 waring이 보이고, 이를 보기 싫은 프로그래머는 Lint Tool을 이용해 버린다.

SuppressLint("NewApi");


 위의 경우에는 어플리케이션 내부에서 페이지를 생성하게되면 서로 자바스크립트가 충돌될 가능성이 있기 때문에 경고를 해주는 것이다. 하지만, 어플리케이션 내부에서 페이지를 생성하지 않는 나의 입장에서는 무시할 경고이므로 Lint Tool을 이용해서 경고를 없앴다.

SuppressLint("SetJavaScriptEnabled"); 

 - 이외의 Lint tool에 대한 자세한 내용은 이곳을 클릭해주길 바란다.




2. URL에 대한 Settings


 - 위에서 Web-view browser를 선택함과 동시에 URL기반의 웹뷰가 실행되게 된다.

 - 사용자가 설정하는 URL을 자신이 원하는 형식으로 다시 변형이 가능한다.

 - 이는 WebView 관련 클래스를 상속받아서 확장시키는 개념이다.

  ~ 일단, 불러주는 browser setting을 자신이 만든 클래스로 변경해준다.

mWebView.setWebViewClient(new WebViewClientClass());// web-view settings on default browser 

  ~ 클래스 내용을 확장시켜준다. 여기서 예를 든 것은 카카오톡과 카카오스토리에 대한 처리이다.

private class WebViewClientClass extends WebViewClient { 

    // enable KAKAO-Story and KAKAO-Talk share

    public static final String KAKAOTALK_PROTOCOL_START = "kakaolink:";

    public static final String KAKAOSTORY_PROTOCOL_START = "storylink:";

    // market link ( originally : "market://detail? package name", but it is not acted ) 

    public static final String GOOGLE_PLAY_STORE_PREFIX = "http://market.android.com/details?id=";

 

    @Override

    public boolean shouldOverrideUrlLoading(WebView view, String url) {

        if (url.startsWith(KAKAOTALK_PROTOCOL_START)) {

            try {

                startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(url)));

            } catch (ActivityNotFoundException e) {

                view.loadUrl(GOOGLE_PLAY_STORE_PREFIX + "com.kakao.talk");

            }

        } else if (url.startsWith(KAKAOSTORY_PROTOCOL_START)){

            try {

                startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(url)));

            } catch (ActivityNotFoundException e) {

                view.loadUrl(GOOGLE_PLAY_STORE_PREFIX + "com.kakao.story");

            }

        } else {

            view.loadUrl(url);

        }

        return true;

    }

} 

 

 

 

3. back-key 처리

 

 - 어플입장에서 웹뷰는 하나의 Activity에서 계속 작동하므로, 뒤로가기키를 눌렀을 경우 어플이 꺼진다.

 - Back-key event가 발생했을 때 웹뷰에서 뒤로가기가 되는지 여부를 판단해주는 행동이 필요하다.

 public boolean onKeyDown(int keyCode, KeyEvent event) {

    if ((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack()) {

        mWebView.goBack();

        return true;

    }

    return super.onKeyDown(keyCode, event);

}


댓글목록

등록된 댓글이 없습니다.

전체 79
게시물 검색
모바일세상 목록
번호 제목 글쓴이 조회 날짜
59 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2392 05-18
58 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1979 05-14
57 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1981 05-14
열람중 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 5597 05-14
55 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2011 05-07
54 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2261 04-20
53 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2403 03-31
52 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2208 03-31
51 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2298 09-01
50 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2706 09-01
49 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1859 09-01
48 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1968 09-01
47 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2492 09-01
46 제이쿼리 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1984 09-01
45 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2145 08-31
44 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2014 08-31
43 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 3616 08-31
42 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 2165 08-30
41 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 1987 08-30
40 모바일 no_profile 오원장 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 3259 08-29