给TextView设置图片的两种实现方法

  原博客

有时在开发过程中，我们会有在TextView中添加图片的需求（比如下图箭头所指文字中的表情）。而在xml中对Textview进行属性设置时，只能设置图片在TextView的左、右、上、下四个位置，不能添加到中间的某个位置，这就要求我们在编写代码时动态的进行相关操作了。



    这里就给出两种解决方法：

    1，使用SpannableString/SpannableStringBuilder；具体使用方法如下：

        1），构造String     

[java] view
plain copy

 print?

SpannableString spanString = new SpannableString("好厉害的魔术啊，小姑娘。。。");  

        2），构造Span

[java] view
plain copy

 print?

Drawable d = getResources().getDrawable(R.drawable.doraemon);     

d.setBounds(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());   

ImageSpan span = new ImageSpan(d, ImageSpan.ALIGN_BASELINE);   

        3），利用SetSpan（）对指定范围的String应用这个Span    

[java] view
plain copy

 print?

<span style="font-size:14px;">spanString.setSpan(span, 6, 7, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);      

textView.setText(spanString);  </span>  

    方法一完成，同时要说的是，SpannableString可以用来给字体设置各种效果，例如不同颜色，下划线，粗体/黑体字，背景色等等。

    2，使用Html.fromHtml方法来设置图片

</pre><p style="color: rgb(54, 46, 43); font-family: Arial; font-size: 14px; line-height: 26px;">2，使用Html.fromHtml方法来设置图片</p><p style="color: rgb(54, 46, 43); font-family: Arial; font-size: 14px; line-height: 26px;"></p><pre class="prettyprint java" name="code" style="white-space: pre-wrap; word-wrap: break-word; position: relative; overflow-y: hidden; overflow-x: auto; color: rgb(54, 46, 43); font-size: 14px; line-height: 26px; background-color: rgb(255, 255, 255);"><span class="javadoc"></span><div class="dp-highlighter bg_java" style="font-family: Consolas, "Courier New", Courier, mono, serif; font-size: 12px; width: 693px; overflow-x: auto; overflow-y: hidden; padding-top: 1px; position: relative; margin: 18px 0px !important; background-color: rgb(231, 229, 220);"><div class="bar" style="padding-left: 45px;"><div class="tools" style="padding: 3px 8px 10px 10px; font-stretch: normal; font-size: 9px; line-height: normal; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: silver; border-left: 3px solid rgb(108, 226, 108); background-color: rgb(248, 248, 248);"><strong>[java]</strong> <a target=_blank href="http://blog.csdn.net/gh8609123/article/details/51721200#" class="ViewSource" title="view plain" style="color: rgb(160, 160, 160); text-decoration: none; border: none; padding: 0px; margin: 0px 10px 0px 0px; font-size: 9px; background-image: none; background-attachment: initial; background-color: inherit; background-size: initial; background-origin: initial; background-clip: initial; background-position: initial; background-repeat: initial;">view plain</a><span data-mod="popu_168"> <a target=_blank href="http://blog.csdn.net/gh8609123/article/details/51721200#" class="CopyToClipboard" title="copy" style="color: rgb(160, 160, 160); text-decoration: none; border: none; padding: 0px; margin: 0px 10px 0px 0px; font-size: 9px; background-image: none; background-attachment: initial; background-color: inherit; background-size: initial; background-origin: initial; background-clip: initial; background-position: initial; background-repeat: initial;">copy</a></span><div style="position: absolute; left: 888px; top: 1818px; width: 27px; height: 15px; z-index: 99;"></div><span data-mod="popu_169"> <a target=_blank href="http://blog.csdn.net/gh8609123/article/details/51721200#" class="PrintSource" title="print" style="color: rgb(160, 160, 160); text-decoration: none; border: none; padding: 0px; margin: 0px 10px 0px 0px; font-size: 9px; background-image: none; background-attachment: initial; background-color: inherit; background-size: initial; background-origin: initial; background-clip: initial; background-position: initial; background-repeat: initial;">print</a></span><a target=_blank href="http://blog.csdn.net/gh8609123/article/details/51721200#" class="About" title="?" style="color: rgb(160, 160, 160); text-decoration: none; border: none; padding: 0px; margin: 0px 10px 0px 0px; font-size: 9px; background-image: none; background-attachment: initial; background-color: inherit; background-size: initial; background-origin: initial; background-clip: initial; background-position: initial; background-repeat: initial;">?</a></div></div><ol start="1" class="dp-j" style="padding: 0px; border: none; color: rgb(92, 92, 92); margin: 0px 0px 1px 45px !important; background-color: rgb(255, 255, 255);"><li class="alt" style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; color: inherit; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important;"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;"><span class="comment" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 130, 0); background-color: inherit;">/**</span> </span></li><li style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important; background-color: rgb(248, 248, 248);"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;"><span class="comment" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 130, 0); background-color: inherit;"> * 项目资源图片</span> </span></li><li class="alt" style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; color: inherit; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important;"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;"><span class="comment" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 130, 0); background-color: inherit;"> * @author Susie</span> </span></li><li style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important; background-color: rgb(248, 248, 248);"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;"><span class="comment" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 130, 0); background-color: inherit;"> */</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;">  </span></span></li><li class="alt" style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; color: inherit; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important;"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;"><span class="keyword" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 102, 153); font-weight: bold; background-color: inherit;">private</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;"> </span><span class="keyword" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 102, 153); font-weight: bold; background-color: inherit;">final</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;"> </span><span class="keyword" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 102, 153); font-weight: bold; background-color: inherit;">class</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;"> ProImageGetter </span><span class="keyword" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 102, 153); font-weight: bold; background-color: inherit;">implements</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;"> Html.ImageGetter{  </span></span></li><li style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important; background-color: rgb(248, 248, 248);"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">  </span></li><li class="alt" style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; color: inherit; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important;"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">  <span class="annotation" style="margin: 0px; padding: 0px; border: none; color: rgb(100, 100, 100); background-color: inherit;">@Override</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;">  </span></span></li><li style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important; background-color: rgb(248, 248, 248);"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">  <span class="keyword" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 102, 153); font-weight: bold; background-color: inherit;">public</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;"> Drawable getDrawable(String source) {  </span></span></li><li class="alt" style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; color: inherit; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important;"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">    <span class="comment" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 130, 0); background-color: inherit;">// 获取到资源id</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;">  </span></span></li><li style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important; background-color: rgb(248, 248, 248);"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">    <span class="keyword" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 102, 153); font-weight: bold; background-color: inherit;">int</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;"> id = Integer.parseInt(source);  </span></span></li><li class="alt" style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; color: inherit; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important;"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">    Drawable drawable = getResources().getDrawable(id);  </span></li><li style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important; background-color: rgb(248, 248, 248);"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">    drawable.setBounds(<span class="number" style="margin: 0px; padding: 0px; border: none; color: rgb(192, 0, 0); background-color: inherit;">0</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;">, </span><span class="number" style="margin: 0px; padding: 0px; border: none; color: rgb(192, 0, 0); background-color: inherit;">0</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;">, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());  </span></span></li><li class="alt" style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; color: inherit; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important;"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">    <span class="keyword" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 102, 153); font-weight: bold; background-color: inherit;">return</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;"> drawable;  </span></span></li><li style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important; background-color: rgb(248, 248, 248);"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">  }  </span></li><li class="alt" style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; color: inherit; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important;"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">}  </span></li></ol></div><div class="save_code tracking-ad" data-mod="popu_249" style="position: absolute; height: 60px; right: 30px; top: 5px; color: rgb(255, 255, 255); cursor: pointer; z-index: 2;"><a target=_blank target="_blank" style="color: rgb(106, 57, 6);"><img src="http://static.blog.csdn.net/images/save_snippets.png" style="border: none; max-width: 100%;" alt="" /></a></div>

<div class="dp-highlighter bg_java" style="font-family: Consolas, "Courier New", Courier, mono, serif; font-size: 12px; width: 693px; overflow-x: auto; overflow-y: hidden; padding-top: 1px; position: relative; margin: 18px 0px !important; background-color: rgb(231, 229, 220);"><div class="bar" style="padding-left: 45px;"><div class="tools" style="padding: 3px 8px 10px 10px; font-stretch: normal; font-size: 9px; line-height: normal; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: silver; border-left: 3px solid rgb(108, 226, 108); background-color: rgb(248, 248, 248);"><strong>[java]</strong> <a target=_blank href="http://blog.csdn.net/gh8609123/article/details/51721200#" class="ViewSource" title="view plain" style="color: rgb(160, 160, 160); text-decoration: none; border: none; padding: 0px; margin: 0px 10px 0px 0px; font-size: 9px; background-image: none; background-attachment: initial; background-color: inherit; background-size: initial; background-origin: initial; background-clip: initial; background-position: initial; background-repeat: initial;">view plain</a><span data-mod="popu_168"> <a target=_blank href="http://blog.csdn.net/gh8609123/article/details/51721200#" class="CopyToClipboard" title="copy" style="color: rgb(160, 160, 160); text-decoration: none; border: none; padding: 0px; margin: 0px 10px 0px 0px; font-size: 9px; background-image: none; background-attachment: initial; background-color: inherit; background-size: initial; background-origin: initial; background-clip: initial; background-position: initial; background-repeat: initial;">copy</a></span><div style="position: absolute; left: 888px; top: 2315px; width: 27px; height: 15px; z-index: 99;"></div><span data-mod="popu_169"> <a target=_blank href="http://blog.csdn.net/gh8609123/article/details/51721200#" class="PrintSource" title="print" style="color: rgb(160, 160, 160); text-decoration: none; border: none; padding: 0px; margin: 0px 10px 0px 0px; font-size: 9px; background-image: none; background-attachment: initial; background-color: inherit; background-size: initial; background-origin: initial; background-clip: initial; background-position: initial; background-repeat: initial;">print</a></span><a target=_blank href="http://blog.csdn.net/gh8609123/article/details/51721200#" class="About" title="?" style="color: rgb(160, 160, 160); text-decoration: none; border: none; padding: 0px; margin: 0px 10px 0px 0px; font-size: 9px; background-image: none; background-attachment: initial; background-color: inherit; background-size: initial; background-origin: initial; background-clip: initial; background-position: initial; background-repeat: initial;">?</a></div></div><ol start="1" class="dp-j" style="padding: 0px; border: none; color: rgb(92, 92, 92); margin: 0px 0px 1px 45px !important; background-color: rgb(255, 255, 255);"><li class="alt" style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; color: inherit; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important;"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;"><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;">String html = </span><span class="string" style="margin: 0px; padding: 0px; border: none; color: blue; background-color: inherit;">"好厉害的魔术"</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;"> + </span><span class="string" style="margin: 0px; padding: 0px; border: none; color: blue; background-color: inherit;">"<img src="</span><span class="string" style="margin: 0px; padding: 0px; border: none; color: blue; background-color: inherit;">"+R.drawable.doraemon+"</span><span class="string" style="margin: 0px; padding: 0px; border: none; color: blue; background-color: inherit;">">"</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;">+</span><span class="string" style="margin: 0px; padding: 0px; border: none; color: blue; background-color: inherit;">",小姑娘。。。"</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;">;  </span></span></li><li style="border-top: none; border-right: none; border-bottom: none; border-left: 3px solid rgb(108, 226, 108); list-style: decimal-leading-zero outside; line-height: 24px; margin: 0px !important; padding: 0px 3px 0px 10px !important; background-color: rgb(248, 248, 248);"><span style="margin: 0px; padding: 0px; border: none; color: black; background-color: inherit;">textView.setText(Html.fromHtml(html, <span class="keyword" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 102, 153); font-weight: bold; background-color: inherit;">new</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;"> ProImageGetter(), </span><span class="keyword" style="margin: 0px; padding: 0px; border: none; color: rgb(0, 102, 153); font-weight: bold; background-color: inherit;">null</span><span style="margin: 0px; padding: 0px; border: none; background-color: inherit;">));  </span></span></li></ol></div>

    方法二至此也已完成，此方法主要是通过对Html的ImageGetter参数进行自定义来设置图片的。

    其实方法一也好，方法二也好，Drawable的获取既可以来自网络，也可以来自存储空间，或者程序自带，是具体情况而定。

参考资料：1，http://blog.csdn.net/harvic880925/article/details/38984705

                  2，http://blog.csdn.net/u010418593/article/details/9324101