[안드로이드] 간단하게 웹뷰 구현


간다하게 안드로이드의 웹뷰를 구현해 보도록 하자



1. 메인 액티비티 소스 (MainActivity.java 소스)


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
49
package com.pois.mtrs_test;
 
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.KeyEvent;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
 
import static com.pois.mtrs_test.R.id.webView;
public class MainActivity extends AppCompatActivity {
    private WebView mWebView;
    private String myUrl = "file:///android_asset"// 접속 URL (내장HTML의 경우 왼쪽과 같이 쓰고 아니면 걍 URL)
 
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // 웹뷰 셋팅팅
        mWebView = (WebView) findViewById(webView);
        mWebView.getSettings().setJavaScriptEnabled(true);
        //mWebView.loadUrl("http://www.pois.co.kr/mobile/login.do");
 
        mWebView.loadUrl(myUrl + "/html/test.html"); // 접속 URL
        mWebView.setWebChromeClient(new WebChromeClient());
        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;
        }
    }
 
 
}
cs




14번 라인의 myurl은 http를 포함한 도메인 주소를 넣으면 된다. 나중에 편하게 쓸일 있을까 해서 걍 변수 처리 한것


23번 라인은 자바스크립트 허용 유무에 대한 것



27번은 웹뷰에 크롬을 사용한다고 하는 건데 저거 안하고 그냥 웹뷰만 쓰면


alert같은 알림창이 뜨지 않는다.


28번 라인에서 셋웹뷰를 한것은


39번부터 시작하는 클래스를 사용하는데


저거 안하면 html 내부에서 다른 페이지로 이동을 할 수가 없다. 그떄그떄 해당 url을 웹뷰에 셋팅해주는 역할을 한다.



2. AndroidManifest.xml 설정 인터넷 퍼미션 추가



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.xxx.xxx">
 
    <uses-permission android:name="android.permission.INTERNET"></uses-permission>
 
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
 
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
 
</manifest>
cs



5번 라인의 인터넷 퍼미션을 추가해줘야 해당 앱에서 인터넷에 접속할수 있다.


간단하게 앱에서 인터넷 사용할 권한을 주는 것이다.



3. layout



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.xxx.xxxx.MainActivity">
 
    <WebView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/webView"
        >
 
 
    </WebView>
 
</LinearLayout>
cs



레이아웃 구조는 이렇게 해주자


웹뷰는 그냥 꽉차게 보여줄거니까 매치 패런트로 해놓는다.



.


  1. beckminju 2018.09.06 18:07

    저 혹시 안드로이드 스튜디오로 질문하나만 해도 될까요..?

  2. beckminju 2018.09.07 09:44

    제가 카페24로 모바일을 만들고 안드로이드 스튜디오로 apk를 입혔거든요..? 그런데 카페24의 주문서작성할때 필요한 우편번호 입력창이 안드로이드 스튜디오에서 만든 로딩페이지(스플레시?)페이지에 가려서 보이지 않는다고 해야 하나..? 우편번호를 입력할 수 가 없어요. 이 로딩페이지가 처음에 어플 들어갈 때만 나오게 하고싶은데 도저히 ..도저히 모르겟어서.. 알려주실수 있으신가요?

    • Favicon of https://yamea-guide.tistory.com 줄쟁이 2018.09.07 16:22 신고

      음.. 글세요 제가 카페24 모바일 기능을 써본적이 없어서 아얘 어떤 말씀이신지 잘 모르겠어요;; 그런 내용은 카페24측에 문의 하시는게 가장 빠르고 확실하게 해결될 수 있는 문제 같아요

  3. beckminju 2018.09.07 17:55

    정말 안타깝게도 이미 모든 방법을 총동원해서 이곳저곳에 문의도해보고 질문도 해보고 구글링도 해보고 다해봤는데
    실패 했어요..ㅠㅠ 정말 미치겠어요

  4. 2019.03.11 11:17

    비밀댓글입니다

  5. 12314 2019.03.11 11:17

    감사합니다

  6. 피슬 2019.03.21 18:33

    mWebView = (WebView) findViewById(R.id.webView);
    저는 이렇게 해야만 되더라고요...

    import static com.pois.mtrs_test.R.id.webView;
    이 라인도 저한테는 오류가 뜨는데 어떻게 고쳐야 할까요?

    • Favicon of https://yamea-guide.tistory.com 줄쟁이 2019.03.22 11:05 신고

      피솔님이 만드신 프로젝트 경로와
      제가 예제로 올린 프로젝트 경로가 다르기 때문에 에러가 난겁니다.

      com.pois.mtrs_test.R.id.webView;

      이부분은 제가 만든 프로젝트 경로이기 때문에 그냥 지우시면 됩니다.

  7. 2019.04.09 16:45

    HTML5(audio tag) 로 작성한 웹서버에 있는 오디오(MP3)를 로딩해 플레이 해주는 시스템을 잘 사용하고 있었습니다. 물론 로딩은 웹뷰를 이용한 앱(안드로이드스튜디오)으로 구현을 했구요.
    그런데 갑자기 업데이트(크롬,웹뷰)로 인해 오디오 플레이 버튼이 동작을 하지 않습니다. 크롬을 사용안함으로 하면 정상동작을 합니다.

    나머지는 다 정상입니다.
    그냥 브라우져(네이버앱)에서 URL로 접근하여 사용하면 아무런 문제가 없습니다.
    PC에서 URL로 접근해도 아무런 문제가 없구요.

    뭐가 문제인지 찾기가 어렵습니다.
    페이지 로딩이 문제인지? 알수가 없습니다.

  8. qkrxo876 2019.04.13 12:47

    웹뷰 구현하는데 도움이 많이 되었는데 혹시
    인터넷이나 와이파이 연결이 끊겼을때 뜨는 페이지를
    수정하고 싶은데 그부분도 알려주실수 있을까요?

+ Recent posts