TextView显示HTML文本时<IMG>标签指定图片的显示处理

TextView显示文本时是支持一些HTML标签的（具体支持那些标签会在下面附录列出），不会需要先用HTML的static方法fromHtml来转换一下。

Spanned text = Html.fromHtml(htmlString);
textView.setText(text);

这样，TextView就会把支持的一些HTML标签以HTML的形式显示出来。不过，如果htmlString中含有<img>标签，并需要在TextView中正确显示的话就必须做进一步的处理了。

Spanned text = Html.fromHtml(htmlString, imageGetter, null);
textView.setText(text);

通过Html的另一个重载的fromHtml方法，指定ImageGetter，来获取网络图片，异步加载的方式来显示图片。 

下面给出ImageGetter的一个实现类，大部分代码来自网络，只针对关键部分做了完善，先看代码，后面详细说明。

public class URLImageGetter implements ImageGetter {
    Context context;
    TextView textView;

    public URLImageGetter(Context context, TextView textView) {
        this.context = context;
        this.textView = textView;
    }
    
    @Override
    public Drawable getDrawable(String paramString) {
        final URLDrawable urlDrawable = new URLDrawable(context);
        
        ImageGetterAsyncTask getterTask = new ImageGetterAsyncTask(urlDrawable);
        getterTask.execute(paramString);
        return urlDrawable;
    }
    
    public class ImageGetterAsyncTask extends AsyncTask<String, Void, Drawable> {
        URLDrawable urlDrawable;
        
        public ImageGetterAsyncTask(URLDrawable drawable) {
            this.urlDrawable = drawable;
        }
        
        @Override
        protected void onPostExecute(Drawable result) {
            if (result != null) {
                urlDrawable.drawable = result;
                
                URLImageGetter.this.textView.requestLayout();
            }
        }
        
        @Override
        protected Drawable doInBackground(String... params) {
            String source = params[0];
            return fetchDrawable(source);
        }
        
        public Drawable fetchDrawable(String url) {
            try {
                InputStream is = fetch(url);
                
                Rect bounds = SystemInfoUtils.getDefaultImageBounds(context);
                Bitmap bitmapOrg = BitmapFactory.decodeStream(is);
                Bitmap bitmap = Bitmap.createScaledBitmap(bitmapOrg, bounds.right, bounds.bottom, true);
                
                BitmapDrawable drawable = new BitmapDrawable(bitmap);
                drawable.setBounds(bounds);
                
                return drawable;
            } catch (ClientProtocolException e) {
                e.printStackTrace();
            } catch (IOException e) {
                e.printStackTrace();
            }
            
            return null;
        }
        
        private InputStream fetch(String url) throws ClientProtocolException, IOException {
            DefaultHttpClient client = new DefaultHttpClient();
            HttpGet request = new HttpGet(url);
            
            HttpResponse response = client.execute(request);
            return response.getEntity().getContent();
        }
    }
    
}

URLDrawable的实现类

public class URLDrawable extends BitmapDrawable {
    protected Drawable drawable;
    
    public URLDrawable(Context context) {
        this.setBounds(SystemInfoUtils.getDefaultImageBounds(context));
        
        drawable = context.getResources().getDrawable(R.drawable.default_image_min);
        drawable.setBounds(SystemInfoUtils.getDefaultImageBounds(context));
    }
    
    @Override
    public void draw(Canvas canvas) {
        Log.d("test", "this=" + this.getBounds());
        if (drawable != null) {
            Log.d("test", "draw=" + drawable.getBounds());
            drawable.draw(canvas);
        }
    }
    
}

在上述两个类中，有一点需要注意，那就是ImageGetter返回的Drawble对象的Bounds一定要设定。否则就会出现图片显示出来了，但和文字会出现重叠的现象。原因我想是TextView在针对spannable的html字符串中的<img>标签渲染的时候会根据ImageGetter得到的Drawable对象的Bounds来为图片预留出空间。所以，在URLDrawable的构造函数中设定了Bounds，其实就是设定图片宽度为屏幕宽度，高度按照１６：９得到。在根据URL获取网络图片以后还需要根据预设的图片大小来缩放实际的图片，参见在URLImageGetter类中的fetchDrawable()函数。

当然在URLDrawable在构造中还增加了默认图片的显示，这一点对用户来讲很友好，对应用来讲也是一个凸显品牌和情怀的机会：）

getDefaultImageBounds()函数的代码如下：

    public static Rect getDefaultImageBounds(Context context) {
        Display display = ((Activity)context).getWindowManager().getDefaultDisplay();
        int width = display.getWidth();
        int height = (int) (width * 9 / 16);
        
        Rect bounds = new Rect(0, 0, width, height);
        return bounds;
    }

------------------------------------------------------------------------------------------------------------

附录：

HTML支持的标签