메이쁘

[Android Studio][Kotlin] Kotlin을 사용한 하이브리드 앱 - WebView(웹뷰) 사용 본문

Technology/Android - Android Studio

[Android Studio][Kotlin] Kotlin을 사용한 하이브리드 앱 - WebView(웹뷰) 사용

메이쁘 2020. 2. 19. 13:14

1. Internet을 사용해야 하기 때문에 manifests에서 인터넷 퍼미션 추가

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

 

2. values/styles.xml 파일에서 AppTheme(앱테마) 변경

 -> 이 때, NoActionBar와 screenOrientation 설정을 portrait으로 변경

 -> 액티비티 화면 상단의 타이틀바를 제거하고, 가로/세로 변경 불가능하다고 설정하기.

 

<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
        <item name="android:screenOrientation">portrait</item>
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

 

 

 

3. activity layout xml 파일 수정

 -> WebView 객체 생성

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

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fadingEdge="none"
        android:gravity="center"
        android:visibility="gone"
        android:id="@+id/errorText"
        android:text="접속이 원활하지 않습니다"></TextView>

 

 

 

4. 액티비티 코드 추가

 -> 웹 뷰에 웹 띄우기, 오류 발생 시 오류 코드 설명 토스트메세지 출력

 -> 웹 뷰 기타 필요한 설정

 

 

package com.example.myapplication

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.KeyEvent
import android.view.View
import android.webkit.*
import android.widget.Toast
import kotlinx.android.synthetic.main.activity_main.*
import android.os.Build
import androidx.annotation.RequiresApi


class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        var webSettings : WebSettings = webView.settings

        webView.webViewClient = object : WebViewClient() {  // 클릭 시 새창 안뜨게
            @RequiresApi(Build.VERSION_CODES.M)
            override fun onReceivedError(   // 오류 발생 시
                view: WebView?,
                request: WebResourceRequest?,
                error: WebResourceError?
            ) {
                when (error?.errorCode) {
                    ERROR_AUTHENTICATION -> { printToast("// 서버에서 사용자 인증 실패") }
                    ERROR_BAD_URL -> { printToast(" // 잘못된 URL") }
                    ERROR_CONNECT -> { printToast("// 서버로 연결 실패") }
                    ERROR_FAILED_SSL_HANDSHAKE -> { printToast("// SSL handshake 수행 실패") }
                    ERROR_FILE -> { printToast(" // 일반 파일 오류") }
                    ERROR_FILE_NOT_FOUND -> { printToast("// 파일을 찾을 수 없습니다") }
                    ERROR_HOST_LOOKUP -> { printToast("// 서버 또는 프록시 호스트 이름 조회 실패")}
                    ERROR_IO -> { printToast(" // 서버에서 읽거나 서버로 쓰기 실패")}
                    ERROR_PROXY_AUTHENTICATION -> { printToast(" // 프록시에서 사용자 인증 실패")}
                    ERROR_REDIRECT_LOOP -> { printToast("// 너무 많은 리디렉션")}
                    ERROR_TIMEOUT -> { printToast("// 연결 시간 초과")}
                    ERROR_TOO_MANY_REQUESTS -> { printToast("// 페이지 로드중 너무 많은 요청 발생")}
                    ERROR_UNKNOWN -> { printToast(" // 일반 오류") }
                    ERROR_UNSUPPORTED_AUTH_SCHEME -> { printToast(" // 지원되지 않는 인증 체계")}
                    ERROR_UNSUPPORTED_SCHEME -> { printToast("// URI가 지원되지 않는 방식")}
                }
                super.onReceivedError(view, request, error)
                errorText.visibility = View.VISIBLE
                webView.visibility = View.GONE
            }
        }

        webSettings.useWideViewPort = true  // 화면 사이즈 맞추기 허용 여부
        webSettings.setSupportZoom(false)   // 화면 줌 허용 여부
        webSettings.layoutAlgorithm = WebSettings.LayoutAlgorithm.TEXT_AUTOSIZING   // 컨텐츠 사이즈 자동 맞추기
        webSettings.javaScriptEnabled = true    // 웹페이지 자바스크립트 허용 여부
        webView.loadUrl("http://m.naver.com")
    }

    // 스마트폰 버튼 클릭 이벤트
    override fun onKeyDown(keyCode: Int, event: KeyEvent?): Boolean {
        if (keyCode == KeyEvent.KEYCODE_BACK) { // 뒤로가기 버튼 누를 시
            if(webView.canGoBack()) {   // 뒤로 돌아갈 페이지가 남아있다면
                webView.goBack()    // 뒤로 가기
                return false
            }
        }
        return super.onKeyDown(keyCode, event)
    }

    fun printToast(msg : String) {
        Toast.makeText(applicationContext, msg, Toast.LENGTH_LONG).show()
    }
}
Comments