Practice Now
WebView
HTML
Load File
Android Development
Mobile App

Load HTML file into WebView

Interview Questions practice on Codemia

Over 8,000 real interview questions from top companies, searchable by company and role.

Browse interview questions
JavaScript & WebiOS & Android

Introduction

Loading an HTML file into an Android WebView is simple once you know where the file lives and how WebView resolves paths. The two most common cases are loading a bundled file from the app's assets directory and loading HTML text directly from a string when the content is generated at runtime.

Load a Bundled HTML File from assets

If the HTML file is part of your app package, place it in app/src/main/assets/ and load it with a file:///android_asset/ URL.

activity_main.xml:

xml
1<?xml version="1.0" encoding="utf-8"?>
2<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
3    android:layout_width="match_parent"
4    android:layout_height="match_parent">
5
6    <WebView
7        android:id="@+id/webView"
8        android:layout_width="match_parent"
9        android:layout_height="match_parent" />
10</FrameLayout>

MainActivity.kt:

kotlin
1import android.os.Bundle
2import android.webkit.WebView
3import androidx.appcompat.app.AppCompatActivity
4
5class MainActivity : AppCompatActivity() {
6    override fun onCreate(savedInstanceState: Bundle?) {
7        super.onCreate(savedInstanceState)
8        setContentView(R.layout.activity_main)
9
10        val webView = findViewById<WebView>(R.id.webView)
11        webView.loadUrl("file:///android_asset/help.html")
12    }
13}

That is the cleanest solution when the page is static documentation, offline help, or bundled local content.

Enable Only the Settings You Actually Need

A plain local HTML page often works with the default settings, but some pages need JavaScript, local storage, or custom navigation handling. Enable those deliberately rather than copying a long settings block from the internet.

kotlin
1val webView = findViewById<WebView>(R.id.webView)
2webView.settings.javaScriptEnabled = true
3webView.settings.domStorageEnabled = true
4webView.loadUrl("file:///android_asset/help.html")

Enable JavaScript only if the local page truly needs it. A static FAQ page usually does not.

Load HTML from a String with loadDataWithBaseURL

If your HTML is generated at runtime, use loadDataWithBaseURL instead of loadUrl.

kotlin
1val html = """
2    <html>
3      <body>
4        <h1>Hello</h1>
5        <p>This page was generated in Kotlin.</p>
6      </body>
7    </html>
8""".trimIndent()
9
10webView.loadDataWithBaseURL(
11    null,
12    html,
13    "text/html",
14    "utf-8",
15    null
16)

This method is also useful when you want the content to reference local CSS or images. In that case, pass a base URL that points to the assets location.

kotlin
1val html = """
2    <html>
3      <head><link rel="stylesheet" href="styles.css"></head>
4      <body><img src="logo.png" /></body>
5    </html>
6""".trimIndent()
7
8webView.loadDataWithBaseURL(
9    "file:///android_asset/",
10    html,
11    "text/html",
12    "utf-8",
13    null
14)

That tells the WebView how to resolve relative paths inside the HTML string.

Keep Navigation Inside the App

By default, some links may open in the system browser instead of staying inside your WebView. If you want local navigation to remain embedded, assign a WebViewClient.

kotlin
1import android.webkit.WebView
2import android.webkit.WebViewClient
3
4webView.webViewClient = WebViewClient()
5webView.loadUrl("file:///android_asset/help.html")

This small line is often the difference between an in-app help page and a jump out to Chrome.

Organize Local Resources Correctly

If your HTML file uses images, CSS, or JavaScript, place those files in assets as well and reference them relative to the HTML file.

Example layout:

  • 'assets/help.html'
  • 'assets/styles.css'
  • 'assets/logo.png'
  • 'assets/app.js'

Inside help.html:

html
<link rel="stylesheet" href="styles.css">
<script src="app.js"></script>
<img src="logo.png" alt="Logo">

That keeps the local page self-contained and offline-friendly.

Common Pitfalls

The biggest mistake is putting the HTML file in res/raw and then trying to load it with file:///android_asset/, which only works for the assets directory. Another common issue is using loadData() for content that depends on relative paths, which breaks linked CSS and images because there is no base URL. Developers also often enable JavaScript by default even when the page does not need it, which expands the attack surface for no benefit. Finally, without a WebViewClient, links may open outside the app and make the page feel broken.

Summary

  • Put bundled HTML files in app/src/main/assets/ and load them with file:///android_asset/....
  • Use loadDataWithBaseURL() when the HTML is generated at runtime or needs relative local resources.
  • Enable WebView settings such as JavaScript only when required.
  • Set a WebViewClient if you want navigation to stay inside the app.
  • Keep CSS, images, and scripts in assets too so the page works offline and consistently.
Related reading
Free course
Beginner
7 lessons
2 hours
Tackling System Design Interview Problems

A short course that equips you with the skills to approach system design interviews methodically.

Start the free course
Track what you have practised

A free account saves your progress, solutions and study plan across every problem on Codemia.

Interview Questions practice on Codemia

Over 8,000 real interview questions from top companies, searchable by company and role.

Browse interview questions
Codemia
© 2026 Codemia
Resources
Legal
Social
All Rights Reserved.