안드로이드 웹뷰 사용하기

1. 웹뷰 란?

웹페이지를 안드로이드 어플리케이션 화면 상에 보여주는 컴포넌트 입니다. 여기에 플레이 스토어에 출시하기 위한 네이티브 기능들을 덧붙이면 하이브리드 앱이 됩니다.

 

웹뷰의 장점은 웹에서 작성한 코드를 어플리케이션으로 다시 작성 할 필요가 없다는 점입니다.

---

2. 웹뷰 사용하기

AndroidManifest.xml 에서 인터넷 접속 권한을 허용하는 아래와 같은 코드 추가

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

activity_main.xml 에서 웹뷰 레이아웃 생성

<WebView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/webView"
        >
</WebView>

 

styles.xml 에서 타이틀바 비활성화

<resources>
 
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
 
        <!--No Title Bar-->
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
 
    </style>
 
</resources>

 

 

MainActivity.java 전체 코드

package com.example.mywebview;
 
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.KeyEvent;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
 
public class MainActivity extends AppCompatActivity {
 
    private WebView mWebView;
    private WebSettings mWebSettings;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        // 웹뷰 셋팅
        mWebView = (WebView) findViewById(R.id.webView);                //xml 자바코드 연결
 
        mWebSettings = mWebView.getSettings();
        mWebSettings.setJavaScriptEnabled(true);
        mWebSettings.setSupportMultipleWindows(false);                  //새창 띄우기 허용 여부
        mWebSettings.setJavaScriptCanOpenWindowsAutomatically(false);   //자바스크립트 새창(멀티뷰) 띄우기 허용 여부
        mWebSettings.setUseWideViewPort(true);                          //화면 사이즈 맞추기 허용 여부
        mWebSettings.setSupportZoom(false);                             //화면 줌 허용 여부
        mWebSettings.setBuiltInZoomControls(false);                     //화면 확대 축소 허용 여부
        mWebSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);     //컨텐츠 사이즈 맞추기
        mWebSettings.setCacheMode(WebSettings.LOAD_NO_CACHE);           //브라우저 캐시 허용 여부
        mWebSettings.setDomStorageEnabled(true);                        //로컬저장소 허용 여부
        mWebSettings.setSaveFormData(true);                             //입력된 데이터 저장 허용 여부
 
        mWebView.loadUrl("http://192.168.0.2:80");                      //웹뷰 실행
        mWebView.setWebChromeClient(new WebChromeClient());             //웹뷰에 크롬 사용 허용//이 부분이 없으면 크롬에서 alert가 뜨지 않음
        mWebView.setWebViewClient(new WebViewClientClass());            //새창열기 없이 웹뷰 내에서 다시 열기//페이지 이동 원활히 하기위해 사용
    }
 
    //뒤로가기 버튼 이벤트
    //웹뷰에서 뒤로가기 버튼을 누르면 뒤로가짐
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if ((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack()) {
            mWebView.goBack();
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }
 
    // 페이지 이동
    private class WebViewClientClass extends WebViewClient {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            Log.d("check URL",url);
            view.loadUrl(url);
            return true;
        }
    }
}
 

실행화면