Load local html file with image src tag webview android

How to call <img src=””/> tag to insert images through resource assets folder inside android apk project.

By using assets folder application developer can display html files and also load images through assets folder. So my in this project i am creating a sample_webpage.html file and adding two images inside it using <img src=””/> tag. now after adding i am putting all three files inside assets folder. So here is the complete step by step tutorial for Load local html file with image src tag webview android.

android-project-download-code-button

How to Load local html file with image src tag webview android.

Note: Images and html file are already present into project so just download the whole project using download button and you will get all images and html file in there.
Code for MainActivity.java file.

 package com.webviewloadinghtmlwithimage;

import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;

public class MainActivity extends Activity {

 WebView WebViewWithImages;
 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);

 WebViewWithImages = (WebView)findViewById(R.id.webView1);
 
 WebSettings webSetting = WebViewWithImages.getSettings();
 webSetting.setBuiltInZoomControls(true);
 webSetting.setJavaScriptEnabled(true);
 
 WebViewWithImages.setWebViewClient(new WebViewClient());
 WebViewWithImages.loadUrl("file:///android_asset/sample_webpage.html");
 }

 private class WebViewClient extends android.webkit.WebViewClient
 {
 @Override
 public boolean shouldOverrideUrlLoading(WebView view, String url) 
 {
 return super.shouldOverrideUrlLoading(view, url);
 }
 }
 
 }

Code for activity_main.xml layout file.

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:paddingBottom="@dimen/activity_vertical_margin"
 android:paddingLeft="@dimen/activity_horizontal_margin"
 android:paddingRight="@dimen/activity_horizontal_margin"
 android:paddingTop="@dimen/activity_vertical_margin"
 tools:context="com.webviewloadinghtmlwithimage.MainActivity" >

 <WebView
 android:id="@+id/webView1"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:layout_alignParentTop="true"
 android:layout_centerHorizontal="true" />

</RelativeLayout>

Screenshots:

Load local html file with image src tag webview android

Click Here to download Load local html file with image src tag webview android project.

Leave a Reply

Your email address will not be published. Required fields are marked *