Upload an image in HTML

1

You see, I'm doing a program in which you have to show, through HTML code, a message (the classic "Hello World") and a sprite ("smile.png" I've called it).

XML Code:

<?xml version="1.0" encoding="utf-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/webkit"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
</WebView>

Java code:

package com.example.pcx.feliz;

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

public class MainActivity extends Activity{

    @Override
    protected void onCreate(Bundle savedInstanceState){
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        WebView browser=findViewById(R.id.webkit);
        String cad="<html><body>Hola Mundo<br><img src='sonrisa.png'></body></html>";
        browser.loadDataWithBaseURL("file://mnt/sdcard/img/",cad,"text/html","UTF-8",null);
    }
}

When I execute it, the "Hello World appears", but not the image. I do not know what folder I should put it in.

I understand that, since I want to run the program on a mobile phone, I have to put the image on my phone (for example, in the image folder or the download folder).

But I do not know about routes on mobile phones.

Edit: I've tried the following code in java:

protected void onCreate(Bundle savedInstanceState){
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        WebView browser=findViewById(R.id.webkit);

        String pathExternalStorage = Environment.getExternalStorageDirectory().getAbsolutePath().toString();
        String imagePath = pathExternalStorage + "/" + "sonrisa.jpg";

        String cad = "file://" + imagePath;

        browser.loadDataWithBaseURL("file://mnt/sdcard/img/",cad,"text/html","UTF-8",null);
    }

And when I run the program, I find the following:

Shows me a possible route. But even the question is that I want the image to be shown. By the way, with ES File Explorer I have looked at the path of the image and I find this route: / storage / emulated / 0 / Download

    
asked by Miguel Alparez 01.02.2018 в 22:46
source

1 answer

0

The common thing is to load images from assets (directory /assets ) in this way:

 webView.loadUrl("file:///android_asset/imagen.jpg");

but in this case you want to access an image that is in the external storage.

The best way to get the external storage path is to use the getExternalStorageDirectory() method of the SDK, otherwise your application may work on some devices.

 String base = Environment.getExternalStorageDirectory().getAbsolutePath().toString();

Upload the image directly to the WebView.

Assuming you have an image called imagen.jpg in the root of external storage.

  String pathExternalStorage = Environment.getExternalStorageDirectory().getAbsolutePath().toString();
  String imagePath = pathExternalStorage + "/" + "imagen.jpg";

    /*

    //Puedes revisar si el archivo existe. 
    File archivo = new File(imagePath);
    if(archivo.exists()){
        Log.i("TAG" , "EXISTE " + imagePath);
    }else{
        Log.e("TAG" , "NO EXISTE " +imagePath );
    }
    */

  String imagePath = "file://" + imagePath;
  webView.loadUrl(imagePath);

Loading image via template html in a WebView.

Another method is to create an html template and add the path of the image:

 String pathExternalStorage = Environment.getExternalStorageDirectory().getAbsolutePath().toString();
 String imagePath = pathExternalStorage + "/" + "imagen.jpg";

String imagePathWV = "file://" + imagePath;
String html = ("<html><head></head><body><img src=\""+ imagePathWV + "\"></body></html>");
webView.loadDataWithBaseURL(null, html, "text/html","utf-8",null);
    
answered by 01.02.2018 в 23:12