Android HTML.fromHTML() with images?

Question

My Android application receives HTML content with images in it. Is it possible to make fromHTML() function to display the images in the HTML String it receives?

If not, how can I retrieve the images in the HTML string and convert them to TextView images?

Thanks

For a modern approach using Kotlin and coroutines + Glide see: https://stackoverflow.com/a/58091529/683658 — Marco RS, Sep 25 '19 at 05:19

Talha · Accepted Answer · 2013-03-25T14:33:40.747

URLDrawable.java

public class URLDrawable extends BitmapDrawable {
    // the drawable that you need to set, you could set the initial drawing
    // with the loading image if you need to
    protected Drawable drawable;

    @Override
    public void draw(Canvas canvas) {
        // override the draw to facilitate refresh function later
        if(drawable != null) {
            drawable.draw(canvas);
        }
    }
}

URLImageParser.java

public class URLImageParser implements ImageGetter {
    Context c;
    View container;

    /***
     * Construct the URLImageParser which will execute AsyncTask and refresh the container
     * @param t
     * @param c
     */
    public URLImageParser(View t, Context c) {
        this.c = c;
        this.container = t;
    }

    public Drawable getDrawable(String source) {
        URLDrawable urlDrawable = new URLDrawable();

        // get the actual source
        ImageGetterAsyncTask asyncTask = 
            new ImageGetterAsyncTask( urlDrawable);

        asyncTask.execute(source);

        // return reference to URLDrawable where I will change with actual image from
        // the src tag
        return urlDrawable;
    }

    public class ImageGetterAsyncTask extends AsyncTask<String, Void, Drawable>  {
        URLDrawable urlDrawable;

        public ImageGetterAsyncTask(URLDrawable d) {
            this.urlDrawable = d;
        }

        @Override
        protected Drawable doInBackground(String... params) {
            String source = params[0];
            return fetchDrawable(source);
        }

        @Override
        protected void onPostExecute(Drawable result) {
            // set the correct bound according to the result from HTTP call
            urlDrawable.setBounds(0, 0, 0 + result.getIntrinsicWidth(), 0 
                    + result.getIntrinsicHeight()); 

            // change the reference of the current drawable to the result
            // from the HTTP call
            urlDrawable.drawable = result;

            // redraw the image by invalidating the container
            URLImageParser.this.container.invalidate();
        }

        /***
         * Get the Drawable from URL
         * @param urlString
         * @return
         */
        public Drawable fetchDrawable(String urlString) {
            try {
                InputStream is = fetch(urlString);
                Drawable drawable = Drawable.createFromStream(is, "src");
                drawable.setBounds(0, 0, 0 + drawable.getIntrinsicWidth(), 0 
                        + drawable.getIntrinsicHeight()); 
                return drawable;
            } catch (Exception e) {
                return null;
            } 
        }

        private InputStream fetch(String urlString) throws MalformedURLException, IOException {
            DefaultHttpClient httpClient = new DefaultHttpClient();
            HttpGet request = new HttpGet(urlString);
            HttpResponse response = httpClient.execute(request);
            return response.getEntity().getContent();
        }
    }
}

Usage of ImageGetter

String html = "Hello " +
"<img src='http://www.gravatar.com/avatar/" + 
"f9dd8b16d54f483f22c0b7a7e3d840f9?s=32&d=identicon&r=PG'/>" +
" This is a test " +
"<img src='http://www.gravatar.com/avatar/a9317e7f0a78bb10a980cadd9dd035c9?s=32&d=identicon&r=PG'/>";

this.textView = (TextView)this.findViewById(R.id.textview);
URLImageParser p = new URLImageParser(textView, this);
Spanned htmlSpan = Html.fromHtml(html, p, null);
textView.setText(htmlSpan);

Didn't quite work for me but upvoted for the approach but others having problem with this answer may have a look here as it works for me! https://stackoverflow.com/questions/16179285/html-imagegetter-textview/16209680#16209680 — Sjd, Dec 14 '15 at 11:35
is there a way to set the size of ther image in the html tag because i think this code tries to put the image in the original size. And width="" doesn´t work — Joh, Jan 29 '16 at 14:53
Note: Kindly call container.setText(container.getText()); at the end of onPostExecute to avoid overlapping of images ( if multiple images) and overlapping of image and text . To do so we have to keep container as TextView instead of just View — Sadanand, Nov 04 '17 at 06:01
I got stuck with the issue ::: The inline style not applied , like style=color:red;" — Subin Babu, May 29 '18 at 12:13

score 0 · Answer 2 · answered Nov 04 '17 at 06:05

Note : Kindly refer the answer given by Talha , I am posting this as separate answer to point out important fix for an issue .

Fix for overlapping of images (if multiple images ) issue and fix for overlapping of image and text

Solution for above issues: Kindly call container.setText(container.getText()); at the end of onPostExecute to avoid overlapping of images.

Android HTML.fromHTML() with images?

2 Answers2

Linked