我们知道，TextView控件一般是用来显示文本的，而图片一般是用ImageView控件来显示。
那TextView能否显示图片呢？答案是肯定的！下面列出常见的4种方式。
1、XML文件中指定属性值
这种方式应该是最常用的了，在TextView的左上右下显示图片，可用
android:drawableLeft
android:drawableTop
android:drawableRight
android:drawableBottom
比如我们要在TextView的顶部设置图片，代码如下：
|
1
2
3
4
5
6
|
<
TextView
android:id
=
"@+id/textview_01"
android:layout_width
=
"wrap_content"
android:layout_height
=
"wrap_content"
android:drawableTop
=
"@drawable/ic_launcher"
android:text
=
"hello_world"
/>
|
这种显示方式图片跟文本是居中对齐的，此种方式对应的方法是setCompoundDrawablesWithIntrinsicBounds：
|
1
2
|
mTextView01.setCompoundDrawablesWithIntrinsicBounds(null,
getResources().getDrawable(R.drawable.ic_launcher, null), null, null);
|
效果图：
如果觉得图片离文字太近，也可以设置他们之间的间距，xml或者代码中都可以实现：
|
1
|
android:drawablePadding="10dp"
|
或者
|
1
|
mTextView01.setCompoundDrawablePadding(10);
|
2、通过解析HTML来显示图片
这种方式可以显示项目中的图片、本地SDCARD和网络的图片，当然网络的图片必须先下载到本地然后显示。
显示项目中图片
看代码
|
1
2
3
4
5
6
7
8
9
10
|
// 第二种方式：显示项目中的图片mTextView02 = (TextView) findViewById(R.id.textview_02);// 把图片生成的ID加入img标签中 <
img
src
=
'123'
>String htmlFor02 = "项目图片测试：" + "<
img
src
=
'" + R.drawable.ic_launcher + "'
>" + "<
img
src='"
+ R.drawable.apple + "'>";
mTextView02.setText(Html.fromHtml(htmlFor02, new Html.ImageGetter() {
@Override public Drawable getDrawable(String source) { Log.d(TAG, "项目图片测试_source:" + source);
int id = Integer.parseInt(source);
Drawable drawable = getResources().getDrawable(id, null);
drawable.setBounds(0, 0, drawable.getIntrinsicWidth() ,
drawable.getIntrinsicHeight()); return drawable;
}
}, null));
|
可以看到，ic_launcher和apple这两张图片的ID是加到了img标签中，然后通过实现html的ImageGetter接口中的getDrawable()方法取得图片。
效果图如下：
获取网络图片
为了简化代码，我们用到了google的volley网络框架去请求图片，然后保存到sdcard再显示，这种方式略显麻烦，看代码：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
|
private static final String htmlFor03 = "网络图片测试："
+ "<
img
src
=
'http://img1.imgtn.bdimg.com/it/u=4190601239,967361436&fm=11&gp=0.jpg'
>";private static final String NET_PIC_NAME = "NetPic.png";// 第二种方式：显示网络图片mTextView03 = (TextView) findViewById(R.id.textview_03);
mTextView03.setText(Html.fromHtml(htmlFor03, mNetWorkImageGetter, null));private NetWorkImageGetter mNetWorkImageGetter = new NetWorkImageGetter();
class NetWorkImageGetter implements Html.ImageGetter { /*
* (non-Javadoc)
* @see android.text.Html.ImageGetter#getDrawable(java.lang.String)
*/
@Override
public Drawable getDrawable(String source) {
Drawable drawable = null;
File file = new File(Environment.getExternalStorageDirectory(), NET_PIC_NAME); if (file.exists()) {
drawable = Drawable.createFromPath(file.getAbsolutePath());
drawable.setBounds(0, 0, drawable.getIntrinsicWidth() * 2,
drawable.getIntrinsicHeight() * 2);
} else {
getNetworkImg(source);
} return drawable;
}
}/**
* 通过volley请求网络图片
* @param url
*/private void getNetworkImg(String url) {
Log.d(TAG, "url: " + url);
RequestQueue queue = Volley.newRequestQueue(this);
ImageRequest request = new ImageRequest(url, new Response.Listener<
Bitmap
>() { @Override
public void onResponse(Bitmap bitmap) {
Log.d(TAG, "onResponse");
saveMyBitmap(NET_PIC_NAME, bitmap);
mTextView03.setText(Html.fromHtml(htmlFor03, mNetWorkImageGetter, null));
}
}, 0, 0, ScaleType.CENTER, Config.RGB_565, new ErrorListener() { @Override
public void onErrorResponse(VolleyError error) {
Log.d(TAG, "onErrorResponse:" + error);
}
});
queue.add(request);
}/**
* 保存获取到的网络图片到sdcard
* @param bitName
* @param mBitmap
*/public void saveMyBitmap(String bitName, Bitmap mBitmap) {
File f = new File("/sdcard/" + bitName); try {
f.createNewFile();
} catch (IOException e) {
}
FileOutputStream fOut = null; try {
fOut = new FileOutputStream(f);
} catch (FileNotFoundException e) {
e.printStackTrace();
}
mBitmap.compress(Bitmap.CompressFormat.PNG, 100, fOut); try {
fOut.flush();
} catch (IOException e) {
e.printStackTrace();
} try {
fOut.close();
} catch (IOException e) {
e.printStackTrace();
}
}
|
代码比较多，弄明白流程就行，先从本地找–>没找到的话通过网络下载并保存到本地–>显示本地图片。
效果图如下：
3、通过ImageSpan和SpannableString
这种方式很简单，通过新建ImageSpan对象得到图片，然后作为参数传入SpannableString的setSpan方法中即可。看代码：
|
1
2
|
// 第三种方式
mTextView04 = (TextView) findViewById(R.id.textview_04);ImageSpan imgSpan = new ImageSpan(this, R.drawable.apple);SpannableString spannableString = new SpannableString("012345");spannableString.setSpan(imgSpan, 1, 5, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);mTextView04.setText(spannableString);
|
注意：setSpan(Object what, int start, int end, int flags)方法中的start和end值是用图片来取代的文本范围，flags是用来标识在 Span 范围内的文本前后输入新的字符时是否把它们也应用这个效果。
效果图：
4、通过继承TextView方式
这种方式的原理是通过继承TextView，并重写onDraw()，让图片直接画到文本上，这会导致图片跟文本重叠，它们之间的间距不好控制。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
public class MyTextView extends TextView {
private Bitmap mBitmap; /**
* @param context
* @param attrs
*/
public MyTextView(Context context, AttributeSet attrs) { super(context, attrs);
mBitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.apple);
setTextSize(40);
} @Override
protected void onDraw(Canvas canvas) {
canvas.drawBitmap(mBitmap, 0, 0, getPaint()); super.onDraw(canvas);
}
}
|
然后在xml文件中引用自定义控件：
|
1
|
<
com.example.imageintextview.MyTextViewandroid:layout_width
=
"wrap_content"
android:layout_height
=
"wrap_content"
android:layout_marginTop
=
"20dp"
android:text
=
"@string/hello_world"
/>
|
效果图:
以上就是在Android TextView中显示图片的4种方式，每种方式都是自己的应用场景，大家根据自己的情况选择正确的方式