TextView加载HTML数据网络图片以及图片点击事件的实现
1 前言
申明:博主原创
转载请 注明出处:http://blog.csdn.net/qq_33804553/article/details/52196055
TextView可以通过Html.fromHtml()方法加载 网页数据,但是在4.0以后 加载的网络图片,就不能显示了,只有一个很小的方块,这篇文章就是为了解决这个问题,并且 为 图片加上点击事件,就比如说加载下面的网页数据
<p style=\"text-align:center;color:#3E3E3E;font-family:"font-size:16px;background-color:#FFFFFF;\">
<span style=\"font-size:18px;\">
<img src=\"http://img4.imgtn.bdimg.com/it/u=42046925,1559346389&fm=11&gp=0.jpg" /><br />
</span>
</p>
<p style=\"color:#3E3E3E;font-family:"font-size:16px;background-color:#FFFFFF;\">
<span style=\"font-size:18px;\">今年6月份,XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX。</span>
</p>
基础知识的话,大家可以去百度,这里只说实现.时间有限,而且 是在 公司的项目 里 实现的,SO,没有demo,没有效果图
2 前提
- 采用ImageLoader作为加载网络图片框架,方便快捷
- 为了实现点击事件,TextView必须进行 一下两行代码的初始化
tv.setClickable(true);
tv.setMovementMethod(LinkMovementMethod.getInstance());
3 详细实现
3.1首先定义一个Drable类,用来绘制图片
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.drawable.BitmapDrawable;
public class URLDrawable extends BitmapDrawable {
protected Bitmap bitmap;
@Override
public void draw(Canvas canvas) {
if (bitmap != null) {
canvas.drawBitmap(bitmap, getBounds().left, getBounds().top, getPaint());
}
}
}
3.2 定义自己的Html.ImageGetter,实现图片的加载,缩放等
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Matrix;
import android.graphics.drawable.Drawable;
import android.text.Html;
import android.util.Log;
import android.view.View;
import android.widget.TextView;
import com.nostra13.universalimageloader.core.ImageLoader;
import com.nostra13.universalimageloader.core.listener.SimpleImageLoadingListener;
public class URLImageParser implements Html.ImageGetter {
TextView mTextView;
Context context;
public URLImageParser(TextView textView, Context context) {
this.mTextView = textView;
this.context = context;
}
@Override
public Drawable getDrawable(String source) {
final URLDrawable urlDrawable = new URLDrawable();
Log.d("ChapterActivity", source);
ImageLoader.getInstance().loadImage(source, new SimpleImageLoadingListener() {
@Override
public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) {
// Bitmap resultBitMap = zoomBitMap(loadedImage);
Bitmap resultBitMap = loadedImage;
urlDrawable.bitmap = resultBitMap;
urlDrawable.setBounds((mTextView.getWidth()-resultBitMap.getWidth())/2, 0, (mTextView.getWidth()-resultBitMap.getWidth())/2+resultBitMap.getWidth(), resultBitMap.getHeight());
mTextView.invalidate();
mTextView.setText(mTextView.getText()); // 解决图文重叠
}
});
return urlDrawable;
}
/**
* 完成适配
* 缩放 bitmap,由于还要考虑到放大倍数越大清晰度越低 和 图片太大显示不完整 的问题,还需要做详细的设计
*
* @param bitmap
* @return
*/
public Bitmap zoomBitMap(Bitmap bitmap) {
float withTV = mTextView.getWidth();
float withBM = bitmap.getWidth();
Log.e("aaa", "withTV:" + withTV + "--withBM:" + withBM);
float zoomNumb = withTV / withBM;
Log.e("aaa", "zoomNumb:" + zoomNumb);
Matrix matrix = new Matrix();
matrix.postScale(zoomNumb, zoomNumb); //长和宽放大缩小的比例
Bitmap resizeBmp = Bitmap.createBitmap(bitmap, 0, 0, bitmap.getWidth(), bitmap.getHeight(), matrix, true);
return resizeBmp;
}
}
3.3 最后实现 TagHandler,实现 图片 点击事件 的绑定
import android.content.Context;
import android.text.Editable;
import android.text.Html;
import android.text.Spanned;
import android.text.style.ClickableSpan;
import android.text.style.ImageSpan;
import android.util.Log;
import android.view.View;
import android.widget.Toast;
import org.xml.sax.XMLReader;
import java.util.Locale;
public class MyTagHandler implements Html.TagHandler {
private Context mContext;
public MyTagHandler(Context context) {
mContext = context.getApplicationContext();
}
@Override
public void handleTag(boolean opening, String tag, Editable output, XMLReader xmlReader) {
//处理标签<img>
if (tag.toLowerCase(Locale.getDefault()).equals("img")) {
// 获取长度
int len = output.length();
// 获取图片地址
ImageSpan[] images = output.getSpans(len - 1, len, ImageSpan.class);
String imgURL = images[0].getSource();
Log.e("imgURL", imgURL);
// 使图片可点击并监听点击事件
output.setSpan(new ClickableImage(mContext, imgURL), len - 1, len, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
}
}
private class ClickableImage extends ClickableSpan {
private String url;
private Context context;
public ClickableImage(Context context, String url) {
this.context = context;
this.url = url;
}
@Override
public void onClick(View widget) {
// 进行图片点击之后的处理
Toast.makeText(context, "图片点击", Toast.LENGTH_SHORT).show();
Log.e("img_click", url);
}
}
}
4 最后在代码中使用
MyTagHandler myTagHandler=new MyTagHandler(this);
String urlDataString="<p style=\"text-align:center;color:#3E3E3E;font-family:'font-size:16px;background-color:#FFFFFF;\'> <span style=\"font-size:18px;\"><img src=\"http://img4.imgtn.bdimg.com/it/u=42046925,1559346389&fm=11&gp=0.jpg\" alt=\"\" /><br /></span> </p><p style=\"color:#3E3E3E;font-family:'font-size:16px;background-color:#FFFFFF;\'><span style=\"font-size:18px;\">今年6月份,国家卫计委会同药监局、中医药管理局、工商总局、中央军委后勤保障部卫生局、武警部队后勤部、全国妇联等部门联合召开会议,部署在全国整治“两非”,也即整治“非医学需要的胎儿性别鉴定和选择性别人工终止妊娠”行为。</span>
</p>";
tv.setText(Html.fromHtml(urlDataString, new URLImageParser(tv,this), myTagHandler));