在textview中加载Html.fromHtml中的图像(http url图像,Base64 url​​图像)

时间:2014-04-08 12:12:56

标签: android

我有一个textview,其中我正在显示论坛帖子的内容,该帖子使用rte在网站上输入,内容涉及图像,类型为web url和类型Base64。默认实现Html.fromHtml用小方块替换所有img标签..

我在SO上寻找使用Html.fromHtml方法从url加载图像的解决方案,结果有办法做到这一点,我们可以将ImageGetter传递给函数..我找到了this很棒的答案网址获取部分但当内容的图片为Base64 时,此操作会失败并崩溃应用程序..

我看了一种为Base64 src创建图像的方法,但没有一个解决方案正在运行,如果有人已经实现了整个解决方案,那就太棒了。如果某人只有Base64部分,请提供我将整合两者的内容..

3 个答案:

答案 0 :(得分:14)

最后花了好几个小时后,我找到了Base64图片的解决方案..我在这里发布完整的解决方案..

我再次感谢https://stackoverflow.com/a/15617341/1114536的基本答案。

原来我使用的答案是参考只是this asnwer的副本..

<强> URLDrawable.java

import android.graphics.Canvas;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;

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

import java.io.InputStream;
import java.net.URL;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.os.AsyncTask;
import android.text.Html.ImageGetter;
import android.util.Base64;
import android.view.View;

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

    public URLImageParser(View container, Context context) {
        this.context = context;
        this.container = container;
    }

    public Drawable getDrawable(String source) {   
        if(source.matches("data:image.*base64.*")) {
            String base_64_source = source.replaceAll("data:image.*base64", "");
            byte[] data = Base64.decode(base_64_source, Base64.DEFAULT);
            Bitmap bitmap = BitmapFactory.decodeByteArray(data, 0, data.length);                
            Drawable image = new BitmapDrawable(context.getResources(), bitmap);
            image.setBounds(0, 0, 0 + image.getIntrinsicWidth(), 0 + image.getIntrinsicHeight()); 
            return image;
        } else {
            URLDrawable urlDrawable = new URLDrawable();
            ImageGetterAsyncTask asyncTask = new ImageGetterAsyncTask(urlDrawable);
            asyncTask.execute(source);          
            return urlDrawable; //return reference to URLDrawable where We will change with actual image from the src tag
        }        
    }

    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) {         
            urlDrawable.setBounds(0, 0, 0 + result.getIntrinsicWidth(), 0 + result.getIntrinsicHeight()); //set the correct bound according to the result from HTTP call            
            urlDrawable.drawable = result; //change the reference of the current drawable to the result from the HTTP call          
            URLImageParser.this.container.invalidate(); //redraw the image by invalidating the container
        }

        public Drawable fetchDrawable(String urlString) {
            try {
                InputStream is = (InputStream) new URL(urlString).getContent();
                Drawable drawable = Drawable.createFromStream(is, "src");
                drawable.setBounds(0, 0, 0 + drawable.getIntrinsicWidth(), 0 + drawable.getIntrinsicHeight()); 
                return drawable;
            } catch (Exception e) {
                return null;
            } 
        }
    }
}

<强>用法:

TextView comment_content_container = ((TextView)findViewById(R.id.comment_content));
comment_content_container.setText(Html.fromHtml(comment.content, new URLImageParser(comment_content_container, this), null));

如果有人知道Base64更好的正则表达式,请回复我会更新答案..

答案 1 :(得分:4)

作为Rajat Singhal的回答(对不起,我没有足够的声誉发表评论):

我的drawable尺寸错误(它更小),因为drawables考虑了屏幕密度。为了保留原始图像大小,我最终在fetchDrawable方法中执行了此操作:

public Drawable fetchDrawable(String urlString) {
        try {
            InputStream is = (InputStream) new URL(urlString).getContent();
            Bitmap bmp = BitmapFactory.decodeStream(is);
            Drawable drawable = new BitmapDrawable (context.getResources(), bmp);
            drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
            return drawable;
        } catch (Exception e) {
            return null;
        }
    }

答案 2 :(得分:1)

我只是想从Rajat的答案中确定图像的大小,图像将占据textview的整个宽度,并保持高度的长宽比。这是我的更新:

    public Drawable getDrawable(String source)
    {
        if(source.matches("data:image.*base64.*"))
        {
            String base_64_source = source.replaceAll("data:image.*base64", "");
            byte[] data = Base64.decode(base_64_source, Base64.DEFAULT);
            Bitmap bitmap = BitmapFactory.decodeByteArray(data, 0, data.length);
            Drawable image = new BitmapDrawable(context.getResources(), bitmap);

            float ratio = container.getWidth() / image.getIntrinsicWidth();
            int width = container.getWidth();
            int height = Math.round(image.getIntrinsicHeight() * ratio);

            image.setBounds(0, 0, width, height);
            return image;
        }
        else
        {
            ....
        }
    }

    public class ImageGetterAsyncTask extends AsyncTask<String, Void, Drawable>
    {
        ....

        @Override
        protected void onPostExecute(Drawable result)
        {
            if(result != null)
            {
                float ratio = container.getWidth() / result.getIntrinsicWidth();
                int width = container.getWidth();
                int height = Math.round(result.getIntrinsicHeight() * ratio);
                urlDrawable.setBounds(0, 0, width, height); //set the correct bound according to the result from HTTP call
                urlDrawable.drawable = result; //change the reference of the current drawable to the result from the HTTP call
                URLImageParser.this.container.invalidate(); //redraw the image by invalidating the container
            }
        }

        public Drawable fetchDrawable(String urlString)
        {
            try
            {
                InputStream is = (InputStream) new URL(urlString).getContent();
                Bitmap bmp = BitmapFactory.decodeStream(is);
                Drawable drawable = new BitmapDrawable (context.getResources(), bmp);

                float ratio = container.getWidth() / drawable.getIntrinsicWidth();
                int width = container.getWidth();
                int height = Math.round(drawable.getIntrinsicHeight() * ratio);

                drawable.setBounds(0, 0, width, height);
                return drawable;
            }
            catch (Exception e)
            {
                return null;
            }
        }

    }
}

但是,Ranjat的解决方案仅显示1张图像。如果您想显示多张图像,则需要在ImageSpan内使用SpannableStringBuilder,如果需要示例,请在评论中告诉我。