在EditText中插入表情图片 (CharacterStyle&SpannableString)

标签：des   android   style   http   io   color   os   ar   使用   

EditText通常用于显示文字，但有时候也需要在文字中夹杂一些图片，比如QQ中就可以使用表情图片，又比如需要的文字高亮显示等等，如何在android中也做到这样呢？ 
记得android中有个android.text包，这里提供了对文本的强大的处理功能。 
添加图片主要用SpannableString和ImageSpan类： 

Java代码  

1. Drawable drawable = getResources().getDrawable(id);  
2.         drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());  
3.         //需要处理的文本，[smile]是需要被替代的文本  
4.         SpannableString spannable = new SpannableString(getText().toString()+"[smile]");  
5.         //要让图片替代指定的文字就要用ImageSpan  
6.         ImageSpan span = new ImageSpan(drawable, ImageSpan.ALIGN_BASELINE);  
7.         //开始替换，注意第2和第3个参数表示从哪里开始替换到哪里替换结束（start和end）  
8. //最后一个参数类似数学中的集合,[5,12)表示从5到12，包括5但不包括12  
9.         spannable.setSpan(span, getText().length(),getText().length()+"[smile]".length(), Spannable.SPAN_INCLUSIVE_EXCLUSIVE);    
10.         setText(spannable);  

将需要的文字高亮显示： 

Java代码  

1. public void highlight(int start,int end){  
2.         SpannableStringBuilder spannable=new SpannableStringBuilder(getText().toString());//用于可变字符串  
3.         ForegroundColorSpan span=new ForegroundColorSpan(Color.RED);  
4.         spannable.setSpan(span, start, end, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
5.         setText(spannable);  
6.     }  

加下划线： 

Java代码  

1. public void underline(int start,int end){  
2.         SpannableStringBuilder spannable=new SpannableStringBuilder(getText().toString());  
3.         CharacterStyle span=new UnderlineSpan();  
4.         spannable.setSpan(span, start, end, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
5.         setText(spannable);  
6.     }  

组合运用： 

Java代码  

1. SpannableStringBuilder spannable=new SpannableStringBuilder(getText().toString());  
2.         CharacterStyle span_1=new StyleSpan(android.graphics.Typeface.ITALIC);  
3.         CharacterStyle span_2=new ForegroundColorSpan(Color.RED);  
4.         spannable.setSpan(span_1, start, end, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
5.         spannable.setSpan(span_2, start, end, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
6.         setText(spannable);  

Java代码  

1. /** 
2.      * 带有\n换行符的字符串都可以用此方法显示2种颜色 
3.      * @param text 
4.      * @param color1 
5.      * @param color2 
6.      * @return 
7.      */  
8.     public SpannableStringBuilder highlight(String text,int color1,int color2,int fontSize){  
9.         SpannableStringBuilder spannable=new SpannableStringBuilder(text);//用于可变字符串  
10.         CharacterStyle span_0=null,span_1=null,span_2;  
11.         int end=text.indexOf("\n");  
12.         if(end==-1){//如果没有换行符就使用第一种颜色显示  
13.             span_0=new ForegroundColorSpan(color1);  
14.             spannable.setSpan(span_0, 0, text.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
15.         }else{  
16.             span_0=new ForegroundColorSpan(color1);  
17.             span_1=new ForegroundColorSpan(color2);  
18.             spannable.setSpan(span_0, 0, end, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
19.             spannable.setSpan(span_1, end+1, text.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
20.               
21.             span_2=new AbsoluteSizeSpan(fontSize);//字体大小  
22.             spannable.setSpan(span_2, end+1, text.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
23.         }  
24.         return spannable;  
25.     }  

 

以上实际都是Html.fromHtml(html)的代码实现形式。 

另外有个问题：如何让一个TextView中的关键字高亮显示？ 
http://www.eoeandroid.com/forum.php?mod=viewthread&tid=57880&page=1&extra=#pid558440 
解决如下： 

Java代码  

1. /** 
2.      * 关键字高亮显示 
3.      * @param target 需要高亮的关键字 
4.      */  
5.     public void highlight(String target){  
6.         String temp=getText().toString();  
7.         SpannableStringBuilder spannable = new SpannableStringBuilder(temp);  
8.         CharacterStyle span=null;  
9.           
10.         Pattern p = Pattern.compile(target);  
11.         Matcher m = p.matcher(temp);  
12.         while (m.find()) {  
13.             span = new ForegroundColorSpan(Color.RED);//需要重复！  
14.             spannable.setSpan(span, m.start(), m.end(),Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
15.         }  
16.         setText(spannable);  
17.     }  

循环太慢，不知道有没有简单高效的方法？ 

 

下面给出一个类，专门用于将指定的文字转换成表情显示，当然使用前表情图片需要先导入drawable，另外表情图片的数量需要和数组定义的长度一致！否则抛参数异常。 

Java代码  

1. import android.content.Context;  
2. import android.text.Spannable;  
3. import android.text.SpannableStringBuilder;  
4. import android.text.style.ImageSpan;  
5. import android.util.Log;  
6. import java.util.HashMap;  
7. import java.util.regex.Matcher;  
8. import java.util.regex.Pattern;  
9.   
10. public class SmileyParser {  
11.     private Context mContext;  
12.     private String[] mSmileyTexts;  
13.     private Pattern mPattern;  
14.     private HashMap<String, Integer> mSmileyToRes;  
15.     public static final int[] DEFAULT_SMILEY_RES_IDS = {  
16.         R.drawable.aini,  
17.         R.drawable.aoteman,  
18.         R.drawable.baibai,  
19.         R.drawable.baobao,  
20.         R.drawable.beiju,  
21.         R.drawable.beishang,  
22.         R.drawable.bianbian,  
23.         R.drawable.bishi,  
24.         R.drawable.bizui,  
25.         R.drawable.buyao,  
26.         R.drawable.chanzui,  
27.     };  
28.   
29.     public SmileyParser(Context context) {  
30.         mContext = context;  
31.         mSmileyTexts = mContext.getResources().getStringArray(DEFAULT_SMILEY_TEXTS);  
32.         mSmileyToRes = buildSmileyToRes();  
33.         mPattern = buildPattern();  
34.     }  
35.   
36.     public static final int DEFAULT_SMILEY_TEXTS = R.array.default_smiley_texts;  
37.   
38.     private HashMap<String, Integer> buildSmileyToRes() {  
39.         if (DEFAULT_SMILEY_RES_IDS.length != mSmileyTexts.length) {  
40. //          Log.w("SmileyParser", "Smiley resource ID/text mismatch");  
41.             //表情的数量需要和数组定义的长度一致！  
42.             throw new IllegalStateException("Smiley resource ID/text mismatch");  
43.         }  
44.   
45.         HashMap<String, Integer> smileyToRes = new HashMap<String, Integer>(mSmileyTexts.length);  
46.         for (int i = 0; i < mSmileyTexts.length; i++) {  
47.             smileyToRes.put(mSmileyTexts[i], DEFAULT_SMILEY_RES_IDS[i]);  
48.         }  
49.   
50.         return smileyToRes;  
51.     }  
52.   
53.     //构建正则表达式  
54.     private Pattern buildPattern() {  
55.         StringBuilder patternString = new StringBuilder(mSmileyTexts.length * 3);  
56.         patternString.append(‘(‘);  
57.         for (String s : mSmileyTexts) {  
58.             patternString.append(Pattern.quote(s));  
59.             patternString.append(‘|‘);  
60.         }  
61.         patternString.replace(patternString.length() - 1, patternString.length(), ")");  
62.   
63.         return Pattern.compile(patternString.toString());  
64.     }  
65.   
66.     //根据文本替换成图片  
67.     public CharSequence replace(CharSequence text) {  
68.         SpannableStringBuilder builder = new SpannableStringBuilder(text);  
69.         Matcher matcher = mPattern.matcher(text);  
70.         while (matcher.find()) {  
71.             int resId = mSmileyToRes.get(matcher.group());  
72.             builder.setSpan(new ImageSpan(mContext, resId),matcher.start(), matcher.end(),Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
73.         }  
74.         return builder;  
75.     }  
76. }  

在res/arrays.xml中添加数组： 

Xml代码  

1. <?xml version="1.0" encoding="UTF-8"?>  
2. <resources xmlns:android="http://schemas.android.com/apk/res/android"  
3.     xmlns:xliff="urn:oasis:names:tc:xliff:document:1.2">  
4.   <string-array name="default_smiley_texts">  
5.     <item >[爱你]</item>  
6.      <item >[机器人]</item>  
7.     <item >[拜拜]</item>  
8.     <item >[抱抱]</item>  
9.     <item >[悲剧]</item>  
10.     <item >[悲伤]</item>  
11.     <item >[便便]</item>  
12.     <item >[鄙视]</item>  
13.     <item >[闭嘴]</item>  
14.     <item >[不要]</item>  
15.     <item >[馋嘴]</item>   
16.   </string-array>  
17. </resources>  

使用： 

Java代码  

1. public void onCreate(Bundle savedInstanceState) {  
2.         super.onCreate(savedInstanceState);  
3.         setContentView(R.layout.main);  
4.   
5.         TextView tvShow = (TextView) findViewById(R.id.tvShow);  
6.         TextView tvSource = (TextView) findViewById(R.id.tvSource);  
7.           
8.         SmileyParser parser = new SmileyParser(this);  
9.         String text = "[鄙视][爱你][便便][馋嘴][机器人]";  
10.         tvSource.setText("原文："+text);  
11.         tvShow.setText(parser.replace("SmileyParser类处理后:"+text));  
12.     }  

效果： 
 




付继承关系： 







扩展学习： 
android开发：TextView中显示HTML和图片 
最近有人咨询我如何在TextView中显示<img src=""/> html标签内的图片，大家都知道，在TextView中显示HTML内容的方法如下所示： 

Java代码  

1. TextView description=(TextView)findViewById(R.id.description);  
2. description.setText(Html.fromHtml(htmlStr));  

如果HTML中有图片的话，显示出来的图片会被一个小框取代，那么怎么样才能看到图片呢？查看了一下API，android.text.Html还还有另一个方法：Html.fromHtml(String source,ImageGetter imageGetter,TagHandler tagHandler)，这个方法使用如下所示： 

Java代码  

1. //<img src=‘http://XXX.png‘ />的情况  
2. ImageGetter imgGetter = new Html.ImageGetter() {  
3.         public Drawable getDrawable(String source) {  
4.             Drawable drawable = null;  
5.             Log.d("Image Path", source);  
6.             URL url;  
7.             try {  
8.                 url = new URL(source);  
9.                 drawable = Drawable.createFromStream(url.openStream(), "");  
10.             } catch (Exception e) {  
11.                 return null;  
12.             }  
13.             drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());  
14.             return drawable;  
15.         }  
16.     };  
17. .........  
18. TextView description=(TextView)findViewById(R.id.description);  
19. description.setText(Html.fromHtml(htmlStr,imgGetter,null));  

如果图片在该工程的res/drawable下，那么可以使用下面这种： 

Java代码  

1. //<img src=‘" + R.drawable.icon + "‘ />的情况  
2.  ImageGetter imgGetter = new Html.ImageGetter() {  
3.    @Override  
4.    public Drawable getDrawable(String source) {  
5.     int id = Integer.parseInt(source);  
6.     Drawable drawable = getResources().getDrawable(id);  
7.     //int height = fontH;  
8.     //int width = (int) ((float) drawable.getIntrinsicWidth() / (float) drawable.getIntrinsicHeight()) * fontH;  
9.     //drawable.setBounds(0, 0, width, height);  
10.     drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());  
11.     return drawable;  
12.    }  
13.   };  

怎么样？很简单，第二个参数TagHandler是干什么的呢？从名称我们就知道是处理HTML中的标签的，比如说遇到某个标签就把它替换为….之类的操作都可以通过TagHandler来处理，呵呵，我可没试过哦，瞎猜的，程序员一定要发挥充分的想像力，自己去试一下吧！ 
最后我要说的是，如果你的图片是从网络上获取的，那么你一定不要用这种方法显示一张图片，因为这是最垃圾的办法，你的程序会经常被卡死。 
那么有没有更好的方法呢？也许不是最好，但我建议您可以使用WebView来显示HTML内容。

在EditText中插入表情图片 (CharacterStyle&SpannableString)

标签：des   android   style   http   io   color   os   ar   使用   

原文地址：http://www.cnblogs.com/banxian/p/4064039.html