码迷，mamicode.com
首页 > 移动开发 > 详细

android 新浪微博客户端的表情功能的实现

时间：2015-02-13 18:16:19      阅读：306      评论：0      收藏：0      [点我收藏+]

标签：

这是一篇好文章，我转来收藏，技术的最高境界是分享。

 

最近在搞android 新浪微博客户端，有一些心得分享
弄android客户端表情功能可以用以下思路
1.首页把新浪的表情下载到本地一文件夹种，表情图片的命名要用新浪微博表情原来的命名
比如 新浪的害羞表情是shame.gif 那么你在本地也得命名为shame.gif,命名相同主要是为了能够匹配表情对应的code.
2.把本地的表情都放进android的资源文件里----drawable下面
3.访问新浪的表情接口(新浪返回的数据类型有json和xml两种，本人用xml)，把返回的信息，利用xml解析器解析出来的信息储存在一个Emotion.java的bean里，这样就可以根据Emotion.java的code找到一一对应的资源表情图片了
4.实现一个可以让用户选择的表情界面，本人用GridView实现
5.实现点击GridView的每一个item，处理根据item的index查找对应的表情code，然后再把code利用正则把code转换为相对应的表情图片，最后表情插入EditText进行发送。

 

下面是具体的实现过程

1.把新浪表情图片下载到本地的实现如下：(这个可以建一个java工程进行下载)

  1. public void getFriendList() throws Exception {  
  2.         BlogReleaseServiceImpl service = new BlogReleaseServiceImpl();  
  3.         List<Emotions> list = service.getEmotion();  
  4.         for (Emotions emotions : list) {  
  5.             String path = emotions.getUrl();  
  6.             String filename = path.substring(path.lastIndexOf("/") + 1,path.length());  
  7.             URL url =  new URL(path);  
  8.             HttpURLConnection conn = (HttpURLConnection)url.openConnection();  
  9.             conn.setRequestMethod("GET");  
  10.             conn.setReadTimeout(5 * 1000);  
  11.             if(conn.getResponseCode() == 200){  
  12.                 InputStream is = conn.getInputStream();  
  13.                 byte[] data = readStream(is);  
  14.                 File file = new File("f: \\sina_images\\" + filename);  
  15.                 FileOutputStream fs = new FileOutputStream(file);  
  16.                 fs.write(data);  
  17.                 fs.close();  
  18.             }else{  
  19.                 System.out.println("请求失败");  
  20.             }  
  21.         }  
  22.     }  
  23.       
  24.     public byte[] readStream(InputStream is) throws Exception {  
  25.         ByteArrayOutputStream os = new ByteArrayOutputStream();  
  26.         byte[] buffer = new byte[2048];  
  27.         int len = 0;  
  28.         while((len = is.read(buffer)) != -1){  
  29.             os.write(buffer,0,len);  
  30.         }  
  31.         is.close();  
  32.         return os.toByteArray();  
  33.     }  

2:把本地的表情都放进android的资源文件里----drawable下面(这个就不用多说了，直接选取所有文件复制就行了)

3:

3.1访问新浪的表情接口，把返回的信息如下：

  1.      <emotion>  
  2. <phrase>[嘻嘻]</phrase>  
  3. <type>face</type>  
  4. <url>http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/c2/tooth.gif  
  5. </url>  
  6. <is_hot>false</is_hot>  
  7. <is_common>true</is_common>  
  8. <order_number>0</order_number>  
  9. <category></category>  
  10. lt;/emotion>  


3.2 储存在一个Emotion.java里。Emotion.java代码如下：

  1. package com.uim.microblog.model;  
  2.   
  3. import java.io.Serializable;  
  4.   
  5. public class Emotions implements Serializable {  
  6.   
  7.     /** 
  8.      *  
  9.      */  
  10.     private static final long serialVersionUID = 1L;  
  11.       
  12.     private String phrase;//表情使用的替代文字  
  13.     private String type;  
  14.     private String url;//表情图片存放的位置  
  15.     private String isHot;//是否为热门表情  
  16.     private String isCommon;//是否属于通用  
  17.     private String orderNumber;//该表情在系统中的排序号码  
  18.     private String category;//表情分类  
  19.     private String imageName;//表情名称  
  20.       
  21.     public String getImageName() {  
  22.         return imageName;  
  23.     }  
  24.     public void setImageName(String imageName) {  
  25.         this.imageName = imageName;  
  26.     }  
  27.     public String getPhrase() {  
  28.         return phrase;  
  29.     }  
  30.     public void setPhrase(String phrase) {  
  31.         this.phrase = phrase;  
  32.     }  
  33.     public String getType() {  
  34.         return type;  
  35.     }  
  36.     public void setType(String type) {  
  37.         this.type = type;  
  38.     }  
  39.     public String getUrl() {  
  40.         return url;  
  41.     }  
  42.     public void setUrl(String url) {  
  43.         this.url = url;  
  44.     }  
  45.     public String getIsHot() {  
  46.         return isHot;  
  47.     }  
  48.     public void setIsHot(String isHot) {  
  49.         this.isHot = isHot;  
  50.     }  
  51.     public String getIsCommon() {  
  52.         return isCommon;  
  53.     }  
  54.     public void setIsCommon(String isCommon) {  
  55.         this.isCommon = isCommon;  
  56.     }  
  57.     public String getOrderNumber() {  
  58.         return orderNumber;  
  59.     }  
  60.     public void setOrderNumber(String orderNumber) {  
  61.         this.orderNumber = orderNumber;  
  62.     }  
  63.     public String getCategory() {  
  64.         return category;  
  65.     }  
  66.     public void setCategory(String category) {  
  67.         this.category = category;  
  68.     }  
  69.           
  70. }  

 

3.2 储存在一个Emotion.java里。Emotion.java代码如下：

 

  1. package com.uim.microblog.net.handler;  
  2.   
  3. import java.util.ArrayList;  
  4. import java.util.List;  
  5.   
  6. import org.xml.sax.Attributes;  
  7. import org.xml.sax.SAXException;  
  8. import org.xml.sax.helpers.DefaultHandler;  
  9.   
  10. import com.uim.microblog.model.Emotions;  
  11. import com.uim.microblog.model.ResponseResult;  
  12.   
  13. public class BlogEmotionsHandler extends DefaultHandler {  
  14.       
  15.     private List<Emotions> list;  
  16.       
  17.     private Emotions emotions;  
  18.     private ResponseResult responseresult;  
  19.       
  20.     private String tag = null;//正在解析的元素  
  21.       
  22.       
  23.     public List<Emotions> getEmotionsList(){  
  24.         return list;  
  25.     }  
  26.   
  27.     @Override  
  28.     public void characters(char[] ch, int start, int length)  
  29.             throws SAXException {  
  30.         if (tag != null) {  
  31.             String textArea = new String(ch,start,length);  
  32.               
  33.             /**开始解析表情数据*/  
  34.             if ("phrase".equals(tag)) {  
  35.                 emotions.setPhrase(textArea);  
  36.             } else if ("type".equals(tag)) {  
  37.                 emotions.setType(textArea);  
  38.             } else if ("url".equals(tag)) {  
  39.                 try {  
  40.                     emotions.setUrl(textArea);  
  41.                     String imageName = textArea.substring(textArea.lastIndexOf("/") + 1,textArea.length() - 4);  
  42.                     emotions.setImageName(imageName);  
  43.                 } catch (Exception e) {  
  44.                     e.printStackTrace();  
  45.                 }  
  46.             } else if ("is_hot".equals(tag)) {  
  47.                 emotions.setIsHot(textArea);  
  48.             } else if ("is_common".equals(tag)) {  
  49.                 emotions.setIsCommon(textArea);  
  50.             } else if ("order_number".equals(tag)) {  
  51.                 emotions.setOrderNumber(textArea);  
  52.             } else if ("category".equals(tag)) {  
  53.                 emotions.setCategory(textArea);  
  54.             } else if ("retn".equals(tag)) {  
  55.                 responseresult.setRetn(textArea);  
  56.             } else if ("desc".equals(tag)) {  
  57.                 responseresult.setDesc(textArea);  
  58.             }  
  59.         }  
  60.           
  61.     }  
  62.   
  63.     @Override  
  64.     public void endDocument() throws SAXException {  
  65.         super.endDocument();  
  66.     }  
  67.   
  68.     @Override  
  69.     public void endElement(String uri, String localName, String qName)  
  70.             throws SAXException {  
  71.         tag = null;  
  72.         if ("mb".equals(localName)) {  
  73.               
  74.         } else if ("emotions".equals(localName)) {  
  75.             responseresult =null;  
  76.         } else if ("emotion".equals(localName)) {  
  77.             list.add(emotions);  
  78.               
  79.             emotions = null;  
  80.         }   
  81.     }  
  82.   
  83.     @Override  
  84.     public void startDocument() throws SAXException {  
  85.         list = new ArrayList<Emotions>();  
  86.     }  
  87.   
  88.     @Override  
  89.     public void startElement(String uri, String localName, String qName,  
  90.             Attributes attributes) throws SAXException {  
  91.         if ("mb".equals(localName)) {  
  92.             responseresult = new ResponseResult();  
  93.         } else if ("emotions".equals(localName)) {  
  94.               
  95.         } else if ("emotion".equals(localName)) {  
  96.             emotions = new Emotions();  
  97.         }   
  98.           
  99.         tag = localName;  
  100.     }  
  101.       
  102.       
  103.   
  104. }  


3.4sax解析

  1. public List<Emotions> getEmotion(){  
  2.         BlogGetData getdata = new BlogGetData();  
  3.         String result = getdata.blogEmotionsServlet();  
  4.         try {  
  5.             //生成SAX解析对象  
  6.             parser = SAXParserFactory.newInstance().newSAXParser();  
  7.             //生成xml读取器  
  8.             reader = parser.getXMLReader();  
  9.             BlogEmotionsHandler handler = new BlogEmotionsHandler();  
  10.             //设置Handler  
  11.             reader.setContentHandler(handler);  
  12.             //指定文件，进行解析  
  13.             reader.parse(new InputSource(new StringReader(result)));  
  14.             //获取 List<Emotions>  
  15.             emotionList = handler.getEmotionsList();  
  16.         } catch (ParserConfigurationException e) {  
  17.             e.printStackTrace();  
  18.         } catch (SAXException e) {  
  19.             e.printStackTrace();  
  20.         } catch (IOException e) {  
  21.             e.printStackTrace();  
  22.         }  
  23.           
  24.         return emotionList;  
  25.     }  


4：

4.1实现表情选择器---GridView

 

  1. <GridView  
  2.             android:id="@+id/blog_sendmsg_gvemotion"  
  3.             android:layout_width="fill_parent"  
  4.             android:layout_height="150sp"  
  5.             android:scrollbars="vertical"  
  6.             android:numColumns="auto_fit"  
  7.             android:verticalSpacing="15dp"  
  8.             android:background="@color/blog_list_back"  
  9.             android:stretchMode="columnWidth"  
  10.             android:gravity="center"  
  11.             android:visibility="gone"  
  12.             android:columnWidth="40dp">  
  13.     </GridView>  


4.2 GridView的item-----gridview_emotion_item.xml

 

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout  
  3.   xmlns:android="http://schemas.android.com/apk/res/android"  
  4.   android:layout_width="fill_parent"  
  5.   android:layout_height="fill_parent">  
  6.   <ImageView  
  7.     android:id="@+id/blog_sendmsg_emotion"  
  8.     android:layout_width="wrap_content"  
  9.     android:layout_height="wrap_content"  
  10.     android:layout_weight="50"  
  11.     android:layout_gravity="center">  
  12.   </ImageView>  
  13. </LinearLayout>  
 
 

 4.3代码加载表情图片到GridView进行显示

 

  1. public void addexpression(View view){  
  2.         if (expressionGriView.getVisibility() == View.GONE) {  
  3.             expressionGriView.setVisibility(View.VISIBLE);  
  4.               
  5.             emotionList = BlogHomeActivity.emotions;  
  6.             ArrayList<HashMap<String, Object>> lstImageItem = new ArrayList<HashMap<String, Object>>();  
  7.                
  8.               for(int i=0;i<70;i++)    
  9.               {   
  10.                 emtions = emotionList.get(i);     
  11.                 if (emtions != null) {  
  12.                     HashMap<String, Object> map = new HashMap<String, Object>();  
  13.                   
  14.                     Field f;  
  15.                     try {  
  16.                         f = (Field)R.drawable.class.getDeclaredField(emtions.getImageName());  
  17.                         int j = f.getInt(R.drawable.class);   
  18.                         map.put("ItemImage", j);//添加图像资源的ID    
  19.                         lstImageItem.add(map);    
  20.                     } catch (SecurityException e) {  
  21.                         e.printStackTrace();  
  22.                     } catch (NoSuchFieldException e) {  
  23.                         e.printStackTrace();  
  24.                     }catch (IllegalArgumentException e) {  
  25.                         e.printStackTrace();  
  26.                     } catch (IllegalAccessException e) {  
  27.                         e.printStackTrace();  
  28.                     }  
  29.                       
  30.                 }    
  31.                   
  32.               }    
  33.                 
  34.             //生成适配器的ImageItem <====> 动态数组的元素，两者一一对应    
  35.               SimpleAdapter saImageItems = new SimpleAdapter(this,   
  36.                                                         lstImageItem,//数据来源     
  37.                                                         R.layout.blog_emotion_list,  
  38.                                                             
  39.                                                         //动态数组与ImageItem对应的子项            
  40.                                                         new String[] {"ItemImage"},     
  41.                                                             
  42.                                                         //ImageItem的XML文件里面的一个ImageView  
  43.                                                         new int[] {R.id.blog_sendmsg_emotion});    
  44.                 
  45.               expressionGriView.setAdapter(saImageItems);    
  46.         } else {  
  47.             expressionGriView.setVisibility(View.GONE);  
  48.         }  
  49.           
  50.     }  


5：实现点击GridView的每一个item，处理根据item的index查找对应的表情code，然后再把code利用正则把code转换为相对应的表情图片，最后表情插入EditText进行发送

5.1:code转换为图片:

 

  1. public SpannableString txtToImg(String content){  
  2.         SpannableString ss = new SpannableString(content);  
  3.         int starts = 0;  
  4.         int end = 0;  
  5.           
  6.         if(content.indexOf("[", starts) != -1 && content.indexOf("]", end) != -1){  
  7.             starts = content.indexOf("[", starts);  
  8.             end = content.indexOf("]", end);  
  9.             String phrase = content.substring(starts,end + 1);  
  10.             String imageName = "";  
  11.             List<Emotions> list = BlogHomeActivity.emotions;  
  12.             for (Emotions emotions : list) {  
  13.                 if (emotions.getPhrase().equals(phrase)) {  
  14.                     imageName = emotions.getImageName();  
  15.                 }  
  16.             }  
  17.               
  18.             try {  
  19.                 Field f = (Field)R.drawable.class.getDeclaredField(imageName);  
  20.                 int i= f.getInt(R.drawable.class);  
  21.                 Drawable drawable = BlogSendMsgActivity.this.getResources().getDrawable(i);    
  22.                 if (drawable != null) {  
  23.                     drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());   
  24.                     ImageSpan span = new ImageSpan(drawable, ImageSpan.ALIGN_BASELINE);    
  25.                     ss.setSpan(span, starts,end + 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);    
  26.                 }  
  27.             } catch (SecurityException e) {  
  28.                 e.printStackTrace();  
  29.             } catch (NoSuchFieldException e) {  
  30.                 e.printStackTrace();  
  31.             } catch (IllegalArgumentException e) {  
  32.                 e.printStackTrace();  
  33.             } catch (IllegalAccessException e) {  
  34.                   
  35.             }  
  36.   
  37.         }  
  38.         return ss;  
  39.     }  


 

5.2：插入EditText

  1. emtions = emotionList.get(position);//获取表情bean  
  2.                   int cursor = etcontent.getSelectionStart();  
  3.                   etcontent.getText().insert(cursor, txtToImg(emtions.getPhrase()));  


 

写完收工，给个效果图：

 

技术分享

 

转自：http://jspjson.iteye.com/blog/1109222 

android 新浪微博客户端的表情功能的实现

标签：

原文地址：http://www.cnblogs.com/dongweiq/p/4290472.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！