개요
이 글에서는 Kotlin을 사용하여 Android 앱에서 WebView가 URL 로딩을 완료하는 시점을 감지하는 방법을 단계별로 살펴봅니다. WebViewClient의 onPageFinished() 콜백과 WebChromeClient의 onProgressChanged() 콜백을 함께 활용하면, 페이지 로딩 완료 여부는 물론 로딩 진행률도 실시간으로 확인할 수 있습니다.
1단계: 새 프로젝트 생성
Android Studio에서 File → New Project를 선택하여 새 프로젝트를 만들고, 필요한 모든 세부 정보를 입력합니다.
2단계: 레이아웃 작성 (activity_main.xml)
res/layout/activity_main.xml 파일에 아래 코드를 추가합니다. 화면 상단에는 로딩 상태를 표시할 TextView, 중앙에는 WebView, 하단에는 URL을 불러오는 Button을 배치했습니다.
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android" xmlns:tools="https://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:padding="4dp" tools:context=".MainActivity"> <TextView android:id="@+id/textView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="5dp" android:textColor="#000000" android:textSize="24sp" /> <WebView android:id="@+id/webView" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_above="@id/btnLoad" android:layout_below="@id/textView" /> <Button android:id="@+id/btnLoad" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:text="Load URL" /> </RelativeLayout>
3단계: MainActivity.kt 구현
src/MainActivity.kt 파일에 다음 코드를 추가합니다. 버튼을 클릭하면 지정된 URL을 로드하며, 로딩이 완료되면 토스트 메시지를 표시하고 진행률도 화면에 갱신합니다.
import android.os.Bundle
import android.webkit.WebChromeClient
import android.webkit.WebView
import android.webkit.WebViewClient
import android.widget.Button
import android.widget.TextView
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
class MainActivity : AppCompatActivity() {
lateinit var webView: WebView
lateinit var textView: TextView
private lateinit var btnLoad: Button
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
title = "KotlinApp"
textView = findViewById(R.id.textView)
btnLoad = findViewById(R.id.btnLoad)
webView = findViewById(R.id.webView)
webView.webViewClient = WebViewClient()
btnLoad.setOnClickListener {
webView.webViewClient = object : WebViewClient() {
override fun onPageFinished(view: WebView, weburl: String) {
Toast.makeText(this@MainActivity, "Your WebView is Loaded....",
Toast.LENGTH_LONG).show()
}
}
webView.webChromeClient = object : WebChromeClient() {
override fun onProgressChanged(view: WebView, newProgress: Int) {
textView.text = "Page loading : $newProgress%"
if (newProgress == 100) {
textView.text = "Page Loaded."
}
}
}
webView.loadUrl("https://www.tutorialspoint.com")
}
}
}핵심 포인트:
onPageFinished()— 페이지 로딩이 완료된 순간 호출됩니다. 이 예제에서는 토스트 메시지로 로딩 완료를 알립니다.onProgressChanged()— 로딩 진행률(0~100%)이 변경될 때마다 호출되어 TextView에 백분율을 표시하고, 100%에 도달하면 "Page Loaded." 문구로 전환합니다.
4단계: 인터넷 권한 추가 (AndroidManifest.xml)
WebView로 외부 웹페이지를 불러오려면 인터넷 권한 선언이 필수입니다. androidManifest.xml 파일에 아래와 같이 <uses-permission> 항목을 추가합니다.
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="https://schemas.android.com/apk/res/android" package="com.example.q11"> <uses-permission android:name="android.permission.INTERNET" /> <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>
앱 실행 및 결과 확인
이제 애플리케이션을 실행해 보겠습니다. 실제 Android 기기가 컴퓨터에 연결되어 있다고 가정합니다. Android Studio에서 프로젝트의 액티비티 파일 중 하나를 열고 툴바의 Run 아이콘
을 클릭합니다. 실행 옵션 목록에서 자신의 모바일 기기를 선택하면, 기기 화면에 앱의 기본 화면이 나타납니다.
Load URL 버튼을 누르면 WebView가 해당 페이지를 불러오기 시작하고, 화면 상단의 TextView에 로딩 진행률이 실시간으로 표시됩니다. 로딩이 100%에 도달하면 "Page Loaded." 문구가 출력되고, 동시에 "Your WebView is Loaded...." 토스트 메시지가 화면에 나타나는 것을 확인할 수 있습니다.