Computer >> 컴퓨터 >  >> 프로그래밍 >> Android

안드로이드 WebView에서 assets(에셋) 폴더의 파일을 로드하는 방법

이 글에서는 안드로이드 앱에서 assets(에셋) 디렉토리에 저장된 파일을 WebView로 불러오는 방법을 단계별로 살펴보겠습니다. 앱 내부에 포함된 HTML 파일을 화면에 표시해야 할 때 유용하게 활용할 수 있는 기능입니다.

1단계 — 새 프로젝트 생성

Android Studio에서 File ⇒ New Project로 이동하여 새 프로젝트를 생성하고, 프로젝트 생성에 필요한 모든 정보를 입력합니다.

2단계 — 레이아웃 파일 작성

res/layout/activity_main.xml 파일에 아래 코드를 추가합니다. 화면 전체를 차지하는 WebView 하나를 배치하는 간단한 구조입니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
    tools:context=".MainActivity">

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

3단계 — MainActivity 작성

src/MainActivity.java 파일에 다음 코드를 추가합니다. 핵심은 loadUrl() 메서드에 file:///android_asset/ 접두어를 사용해 에셋 폴더 내부의 파일 경로를 지정하는 부분입니다.

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebView;

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        WebView webView = findViewById(R.id.webView);
        webView.loadUrl("file:///android_asset/mytext.html");
    }
}

참고: file:///android_asset/은 안드로이드가 제공하는 특수 URI 스킴으로, APK 내부의 assets 폴더에 직접 접근할 수 있게 해줍니다. 파일명 앞에 이 접두어를 붙여주기만 하면 됩니다.

4단계 — assets 폴더 및 HTML 파일 생성

assets 폴더를 생성한 뒤, 해당 폴더를 마우스 오른쪽 버튼으로 클릭하여 새 파일(mytext.html)을 만들고 아래 코드를 추가합니다.

<html>
<head></head>
<body>
    <h1> This html file is loaded from the assets folder </h1></br>
    <h2> Have a nice Day!</h2>
</body>
</html>

5단계 — AndroidManifest.xml 설정

androidManifest.xml 파일에 다음 코드를 추가합니다.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="app.com.sample">

    <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 Studio에서 앱을 실행하려면 프로젝트의 액티비티 파일 중 하나를 연 후, 툴바에서 실행(Run) 아이콘을 클릭합니다. 목록에서 본인의 모바일 기기를 선택하면, 기기 화면에 아래와 같이 에셋 폴더에서 불러온 HTML 페이지가 표시됩니다.

안드로이드 WebView에서 assets(에셋) 폴더의 파일을 로드하는 방법

마무리 정리

정리하면, 에셋 폴더의 파일을 WebView로 로드하는 과정은 다음과 같습니다.

① 레이아웃에 WebView 배치 → ② loadUrl("file:///android_asset/파일명") 호출 → ③ assets 폴더에 대상 파일 추가 → ④ 매니페스트 설정 확인.
추가로, 로드한 HTML에서 자바스크립트를 사용하려면 webView.getSettings().setJavaScriptEnabled(true); 코드를 함께 추가해 주면 됩니다.