Android控件组合应用六

接上一篇，我们来为ListView中的Item加入表情符的显示能力。

先来回顾一下《Android控件组合应用一》中的数据模型，Site类有一个Map对象用于保存表情信息，键是表情的名称，值是表情对应的drawable资源的ID的字符串表示。

同时，对照新浪微博的数据可以发现，每一个表情实际上就是对应的一个字符串，例如在微博正文中如果遇到“［爱你］”字样，就用一个眼冒红心垂涎三尺的小图标展现出来，就形成了所谓的表情符。

上一篇中我们能过为TextView启动超链接的显示，让其解析HTML标签已经成功完成了特殊字符的处理，在这里，我们继续沿此思路分析下去，如果能为其加入HTML的<Image>标签，是不是可以让它画出图片来呢？

经过初步的尝试，在这里会遇到两个问题：一是图片画不出来，二是数据中的图片资源ID无法转换成图片资源。

解决第一个问题的方法是使用重载的public static SpannedfromHtml(String source, Html.ImageGetter imageGetter, Html.TagHandler tagHandler)方法，其中的第二个参数是一个图片获取接口，其方法：

public abstract Drawable getDrawable(String source)

用于从一个字符串中返回一个Drawable对象。如果我们把Map中的值传入这个接口，然后想办法将其转换成资源ID，再加载进来成Drawable就可以了。

解决第二个问题其实很简单，Resources类提供了一个方法

public int getIdentifier(String name, String defType, String defPackage)

用于从一个字符串获取资源ID。

好了，所有问题都有了解决方法了，BlogTextView的代码如下：

 package com.wenbin.test; import java.util.Map; import java.util.Set; import android.content.Context; import android.graphics.drawable.Drawable; import android.text.Html; import android.text.Html.ImageGetter; import android.text.util.Linkify; import android.util.AttributeSet; import android.widget.TextView; public class BlogTextView extends TextView { private static final int NAMELENGTH=15; //假设昵称不超过15个字符 private Map<String,String> faceMap; private CharSequence text; private ImageGetter imageGetter = new Html.ImageGetter() { @Override public Drawable getDrawable(String source) { Drawable drawable = null; String sourceName=getContext().getPackageName()+":drawable/"+source; int id=getResources().getIdentifier(sourceName,null,null); if (id!=0){ drawable=getResources().getDrawable(id); if (drawable!=null){ drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight()); } } return drawable; } }; public BlogTextView(Context context) { super(context); setAutoLinkMask(Linkify.ALL); } public BlogTextView(Context context, AttributeSet attrs) { super(context, attrs); setAutoLinkMask(Linkify.ALL); } public BlogTextView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); setAutoLinkMask(Linkify.ALL); } public void setText(CharSequence text,Map<String,String> faceMap){ this.faceMap=faceMap; setText(text); } @Override public CharSequence getText() { return text==null?"":text; } @Override public void setText(CharSequence text, BufferType type) { this.text=text; String cs=text.toString(); String font1="<font color=#339966>"; String font2="</font>"; //找以'@'开头以':'或' '结尾的子串，将其使用font标记进行修饰 int start=0; while(true){ start=cs.indexOf('@',start); if (start<cs.length() && start>=0){ int end=cs.indexOf(' ',start); if (end<cs.length() && end>0 && end-start<=NAMELENGTH){ CharSequence subcs=new String(cs.subSequence(start, end).toString()); cs=cs.replace(subcs,font1+subcs+font2 ); start+=font1.length()+subcs.length()+font2.length(); } else{ end=cs.indexOf(':',start); if (end<cs.length() && end>0 && end-start<=NAMELENGTH){ CharSequence subcs=new String(cs.subSequence(start, end).toString()); cs=cs.replace(subcs,font1+subcs+font2 ); start+=font1.length()+subcs.length()+font2.length(); } } start+=1; } else{ break; } } if (faceMap!=null){ //对表情符以img标记进行修饰，改用drawable显示出来 Set<String> keys=faceMap.keySet(); for(String key:keys){ if (cs.contains(key)){ cs=cs.replace(key, "<img src=""+faceMap.get(key)+"" mce_src=""+faceMap.get(key)+"">"); } } } super.setText(Html.fromHtml(cs,imageGetter,null), type); } }

我们通过提供一个重载的setText()方法用于将表情的Map传递进来。

修改BlogAdapter类的updateBlogView()和updateRetweeteBlogView()方法，用于传递表情数据，代码片断如下：

 

  private void updateBlogView(View view, Blog blog) { TextView userName=(TextView)view.findViewById(R.id.userName); BlogTextView blogText=(BlogTextView)view.findViewById(R.id.blogText); WebView profileImage=(WebView)view.findViewById(R.id.profileImage); ImageView vImage=(ImageView)view.findViewById(R.id.vImage); WebView smallImage=(WebView)view.findViewById(R.id.smallImage); TextView sourceText=(TextView)view.findViewById(R.id.sourceText); userName.setText(blog.getUser().getScreenName()); sourceText.setText(context.getString(R.string.from)+blog.getSource()); blogText.setText(blog.getText(),blog.getSite().getFaceMap()); profileImage.loadUrl(blog.getUser().getProfileImageUrl()); if (!blog.getUser().isVerified()) vImage.setVisibility(View.INVISIBLE); if (blog.getSmallPic().length()>0){ smallImage.loadUrl(blog.getSmallPic()); } else{ smallImage.setVisibility(View.GONE); } } private void updateRetweeteBlogView(View view, Blog blog) { BlogTextView reBlogText=(BlogTextView)view.findViewById(R.id.reBlogText); WebView reImage=(WebView)view.findViewById(R.id.reImage); String at = "@"; String colon=": "; if (blog.getInReplyBlogText().length()>0){ if (blog.getInReplyUserScreenName().length()>0){ reBlogText.setText(at+blog.getInReplyUserScreenName()+colon+blog.getInReplyBlogText()); } else{ reBlogText.setText(blog.getInReplyBlogText(),blog.getSite().getFaceMap()); } } else{ reBlogText.setVisibility(View.GONE); } if (blog.getRetweetedBlog().getSmallPic().length()>0){ reImage.loadUrl(blog.getRetweetedBlog().getSmallPic()); } else{ reImage.setVisibility(View.GONE); } }

运行程序，效果如下图所示：

 

——欢迎转载，请注明出处 http://blog.csdn.net/caowenbin ——