안드로이드 스튜디오 + 웹뷰 Web View 구현

이번에는 안드로이드 앱에 웹뷰를 구현해볼게요

 

우선 웹뷰는 앱에서 인터넷 웹페이지를 보여주는것이라고 생각하면 됩니다.

브라우저를 이식하는 것과 같은 이치이구요

 

웹사이트를 열기 위해서는 인터넷에 연결되어있어야 겠죠?

 

그래서 AndroidManifest.xml에 인터넷 연결 퍼미션을 허용해줍니다.

 

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

 

 

요렇게 internet permission은 application 바깥쪽에 추가해두면 되구요

그리고 application 안에 아래의 내용도 추가하도록 합니다.

android:usesCleartextTraffic="true"

 

 

 

레이아웃 설정도 간단하게 해볼게요

 

activity_main.xml파일에서

아래 7줄을 사이에 추가해주세요

 

 

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

 

 

 

 

 

그다음 MainActivity.java파일을 수정하겠습니다.

아래 내용을 보시고 추가해주시면 됩니다.

 

 

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);
 
        mWebView.setWebViewClient(new WebViewClient()); // 클릭시 새창 안뜨게
        mWebSettings = mWebView.getSettings(); //세부 세팅 등록
        mWebSettings.setJavaScriptEnabled(true); // 웹페이지 자바스클비트 허용 여부
        mWebSettings.setSupportMultipleWindows(false); // 새창 띄우기 허용 여부
        mWebSettings.setJavaScriptCanOpenWindowsAutomatically(false); // 자바스크립트 새창 띄우기(멀티뷰) 허용 여부
        mWebSettings.setLoadWithOverviewMode(true); // 메타태그 허용 여부
        mWebSettings.setUseWideViewPort(true); // 화면 사이즈 맞추기 허용 여부
        mWebSettings.setSupportZoom(false); // 화면 줌 허용 여부
        mWebSettings.setBuiltInZoomControls(false); // 화면 확대 축소 허용 여부
        mWebSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN); // 컨텐츠 사이즈 맞추기
        mWebSettings.setCacheMode(WebSettings.LOAD_NO_CACHE); // 브라우저 캐시 허용 여부
        mWebSettings.setDomStorageEnabled(true); // 로컬저장소 허용 여부
 
        mWebView.loadUrl("http://www.naver.com"); // 웹뷰에 표시할 웹사이트 주소, 웹뷰 시작
    }
}

 

mWebView를 보시면 여러 설정들에 주석을 달아뒀습니다.

자바스크립트, 컨텐츠 사이즈, 줌 허용 여부와 같은 여러 옵션을 설정할 수 있으니까

취향것, 필요에 맞춰 셋팅하시면 될 것 같습니다.

 

그러면 이제 끝이났는데요

 

한번 앱을 실행시켜보겠습니다.

 

 

 

 

 

 

초기 웹페이지로 설정했던 naver.com이 제대로 표시되어지고 있네요