Android编程实现QQ表情的发送和接收完整实例(附源码下载)

这篇文章主要介绍了Android编程实现QQ表情的发送和接收的方法,涉及Android图片资源、正则表达式及对话框的相关操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了Android编程实现QQ表情的发送和接收。分享给大家供大家参考，具体如下：

在自己做一个聊天应用练习的时候，需要用到表情，于是就想着模仿一下QQ表情，图片资源完全copy的QQ.apk，解压就可以得到，这里不细说。

下面将该应用中的表情模块功能抽离出来，以便自己以后复习回顾。。

先看一下效果图：

首先进入界面：(完全仿照QQ)

点击一下上面的表情图标：

选择一些表情，输入一些文字混合：

点击发送：

可以看到文字和表情图片都一起显示出来了。

下面列出一些关键代码：

表情工具类ExpressionUtil:

1. public class ExpressionUtil {  
2. /**  
3. * 对spanableString进行正则判断，如果符合要求，则以表情图片代替  
4. * @param context  
5. * @param spannableString  
6. * @param patten  
7. * @param start  
8. * @throws SecurityException  
9. * @throws NoSuchFieldException  
10. * @throws NumberFormatException  
11. * @throws IllegalArgumentException  
12. * @throws IllegalAccessException  
13. */ 
14. public static void dealExpression(Context context,SpannableString spannableString, Pattern patten, int start) throws SecurityException, NoSuchFieldException, NumberFormatException, IllegalArgumentException, IllegalAccessException {  
15. Matcher matcher = patten.matcher(spannableString);  
16. while (matcher.find()) {  
17. String key = matcher.group();  
18. if (matcher.start() < start) {  
19. continue;  
20. }  
21. Field field = R.drawable.class.getDeclaredField(key);  
22. int resId = Integer.parseInt(field.get(null).toString()); //通过上面匹配得到的字符串来生成图片资源id  
23. if (resId != 0) {  
24. Bitmap bitmap = BitmapFactory.decodeResource(context.getResources(), resId); 
25. ImageSpan imageSpan = new ImageSpan(bitmap); //通过图片资源id来得到bitmap，用一个ImageSpan来包装  
26. int end = matcher.start() + key.length(); //计算该图片名字的长度，也就是要替换的字符串的长度  
27. spannableString.setSpan(imageSpan, matcher.start(), end, Spannable.SPAN_INCLUSIVE_EXCLUSIVE); //将该图片替换字符串中规定的位置中  
28. if (end < spannableString.length()) { //如果整个字符串还未验证完，则继续。。  
29. dealExpression(context,spannableString, patten, end);  
30. }  
31. break;  
32. }  
33. }  
34. }  
35. /**  
36. * 得到一个SpanableString对象，通过传入的字符串,并进行正则判断  
37. * @param context  
38. * @param str  
39. * @return  
40. */ 
41. public static SpannableString getExpressionString(Context context,String str,String zhengze){  
42. SpannableString spannableString = new SpannableString(str);  
43. Pattern sinaPatten = Pattern.compile(zhengze, Pattern.CASE_INSENSITIVE); //通过传入的正则表达式来生成一个pattern  
44. try {  
45. dealExpression(context,spannableString, sinaPatten, 0);  
46. } catch (Exception e) {  
47. Log.e("dealExpression", e.getMessage());  
48. }  
49. return spannableString;  
50. }  
51. } 

在显示聊天页面的list的适配器中，我们需要做如下的显示，即调用上面工具类的方法：

SimpleChatAdapter中的内部类ViewHolder：

1. private class ViewHolder{  
2. RelativeLayout chat_layout;  
3. ImageView image;  
4. TextView text;  
5. public ViewHolder(View convertView){  
6. chat_layout=(RelativeLayout) convertView.findViewById(R.id.team_singlechat_id_listiteam);  
7. image=(ImageView) convertView.findViewById(R.id.team_singlechat_id_listiteam_headicon);  
8. text=(TextView) convertView.findViewById(R.id.team_singlechat_id_listiteam_message);  
9. }  
10. public void setData(MessageInfo msg){  
11. RelativeLayout.LayoutParams rl_chat_left=((RelativeLayout.LayoutParams)chat_layout.getLayoutParams());  
12. RelativeLayout.LayoutParams rl_tv_msg_left=((RelativeLayout.LayoutParams)text.getLayoutParams());  
13. RelativeLayout.LayoutParams rl_iv_headicon_left=((RelativeLayout.LayoutParams)image.getLayoutParams());  
14. if(!DicqConstant.DEFAULTMAC.equalsIgnoreCase(msg.getUsermac())){ //根据本地的mac地址来判断该条信息是属于本人所说还是对方所说  
15. //如果是自己说的，则显示在右边；如果是对方所说，则显示在左边  
16. rl_chat_left.addRule(RelativeLayout.ALIGN_PARENT_LEFT,-1);  
17. rl_chat_left.addRule(RelativeLayout.ALIGN_PARENT_RIGHT,0);  
18. rl_iv_headicon_left.addRule(RelativeLayout.ALIGN_PARENT_LEFT,-1);  
19. rl_iv_headicon_left.addRule(RelativeLayout.ALIGN_PARENT_RIGHT,0);  
20. rl_tv_msg_left.addRule(RelativeLayout.RIGHT_OF,R.id.team_singlechat_id_listiteam_headicon);  
21. rl_tv_msg_left.addRule(RelativeLayout.LEFT_OF,0);  
22. text.setBackgroundResource(R.drawable.balloon_l_selector);  
23. }else{  
24. rl_chat_left.addRule(RelativeLayout.ALIGN_PARENT_LEFT,0);  
25. rl_chat_left.addRule(RelativeLayout.ALIGN_PARENT_RIGHT,-1);  
26. rl_iv_headicon_left.addRule(RelativeLayout.ALIGN_PARENT_LEFT,0);  
27. rl_iv_headicon_left.addRule(RelativeLayout.ALIGN_PARENT_RIGHT,-1);  
28. rl_tv_msg_left.addRule(RelativeLayout.RIGHT_OF,0);  
29. rl_tv_msg_left.addRule(RelativeLayout.LEFT_OF,R.id.team_singlechat_id_listiteam_headicon);  
30. text.setBackgroundResource(R.drawable.balloon_r_selector);  
31. }  
32. image.setImageResource(PrortaitUtils.conversionIdToRes(msg.getProtrait())); //设置头像  
33. String str = msg.getMsg(); //消息具体内容  
34. String zhengze = "f0[0-9]{2}|f10[0-7]"; //正则表达式，用来判断消息内是否有表情  
35. try {  
36. SpannableString spannableString = ExpressionUtil.getExpressionString(context, str, zhengze);  
37. text.setText(spannableString);  
38. } catch (NumberFormatException e) {  
39. e.printStackTrace();  
40. } catch (SecurityException e) {  
41. e.printStackTrace();  
42. } catch (IllegalArgumentException e) {  
43. e.printStackTrace();  
44. }  
45. }  
46. } 

关于表情弹出框的实现如下：

MainActivity：

1. /**  
2. * 创建一个表情选择对话框  
3. */ 
4. private void createExpressionDialog() {  
5. builder = new Dialog(MainActivity.this);  
6. GridView gridView = createGridView();  
7. builder.setContentView(gridView);  
8. builder.setTitle("默认表情");  
9. builder.show();  
10. gridView.setOnItemClickListener(new OnItemClickListener() {  
11. @Override 
12. public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,  
13. long arg3) {  
14. Bitmap bitmap = null;  
15. bitmap = BitmapFactory.decodeResource(getResources(), imageIds[arg2 % imageIds.length]);  
16. ImageSpan imageSpan = new ImageSpan(MainActivity.this, bitmap);  
17. String str = null;  
18. if(arg2<10){  
19. str = "f00"+arg2;  
20. }else if(arg2<100){  
21. str = "f0"+arg2;  
22. }else{  
23. str = "f"+arg2;  
24. }  
25. SpannableString spannableString = new SpannableString(str);  
26. spannableString.setSpan(imageSpan, 0, 4, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);  
27. edit.append(spannableString);  
28. builder.dismiss();  
29. }  
30. });  
31. }  
32. /**  
33. * 生成一个表情对话框中的gridview  
34. * @return  
35. */ 
36. private GridView createGridView() {  
37. final GridView view = new GridView(this);  
38. List<Map<String,Object>> listItems = new ArrayList<Map<String,Object>>();  
39. //生成107个表情的id，封装  
40. for(int i = 0; i < 107; i++){  
41. try {  
42. if(i<10){  
43. Field field = R.drawable.class.getDeclaredField("f00" + i);  
44. int resourceId = Integer.parseInt(field.get(null).toString());  
45. imageIds[i] = resourceId;  
46. }else if(i<100){  
47. Field field = R.drawable.class.getDeclaredField("f0" + i);  
48. int resourceId = Integer.parseInt(field.get(null).toString());  
49. imageIds[i] = resourceId;  
50. }else{  
51. Field field = R.drawable.class.getDeclaredField("f" + i);  
52. int resourceId = Integer.parseInt(field.get(null).toString());  
53. imageIds[i] = resourceId;  
54. }  
55. } catch (NumberFormatException e) {  
56. e.printStackTrace();  
57. } catch (SecurityException e) {  
58. e.printStackTrace();  
59. } catch (IllegalArgumentException e) {  
60. e.printStackTrace();  
61. } catch (NoSuchFieldException e) {  
62. e.printStackTrace();  
63. } catch (IllegalAccessException e) {  
64. e.printStackTrace();  
65. }  
66. Map<String,Object> listItem = new HashMap<String,Object>();  
67. listItem.put("image", imageIds[i]);  
68. listItems.add(listItem);  
69. }  
70. SimpleAdapter simpleAdapter = new SimpleAdapter(this, listItems, R.layout.team_layout_single_expression_cell, new String[]{"image"}, new int[]{R.id.image});  
71. view.setAdapter(simpleAdapter);  
72. view.setNumColumns(6);  
73. view.setBackgroundColor(Color.rgb(214, 211, 214));  
74. view.setHorizontalSpacing(1);  
75. view.setVerticalSpacing(1);  
76. view.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.WRAP_CONTENT));  
77. view.setGravity(Gravity.CENTER);  
78. return view;  
79. }  

完整实例代码代码点击此处本站下载。

希望本文所述对大家Android程序设计有所帮助。