我的Android进阶之旅------>Android关于ImageSpan和SpannableString的初步了解
2015-07-29 10:55
573 查看
最近要实现一个类似QQ聊天输入框,在输入框中可以同时输入文字和表情图像的功能。如下图所示的效果:
为了实现这个效果,先去了解了一下ImageSpan和SpannableString的用法。下面用一个小实例来看看具体的用法,效果如下:
代码如下:
代码中主要是将 [smile]文本 替换成了 R.id.smile图像
布局文件:
==================================================================================================
至于要实现第一图所示的QQ聊天输入框的效果,需要找到多张QQ表情图片,然后和相对应的文本,用一个Map<String key,Integer value>来存储起来。然后使用网格布局,将所有的表情都进行相关的缩放效果后再显示出来,还得使用分页技术,以及添加立体翻转效果特效等,这里就不贴代码了。
可以参考网上的相关博客:
Android
UI【android 仿微信、QQ聊天,带表情,可翻页,带翻页拖动缓冲】
地址:http://blog.csdn.net/lnb333666/article/details/8546497
下面是一个简单的工具栏
====================================================================================
作者:欧阳鹏 欢迎转载,与人分享是进步的源泉!
转载请保留原文地址:http://blog.csdn.net/ouyang_peng
====================================================================================
[align=left] [/align]
为了实现这个效果,先去了解了一下ImageSpan和SpannableString的用法。下面用一个小实例来看看具体的用法,效果如下:
代码如下:
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); TextView mDetailView = (TextView) findViewById(R.id.detail); String text = "大家好啊,多笑笑嘛,就像这样[smile]"; ImageSpan imageSpan=new ImageSpan(this, R.drawable.smile); SpannableString spannableString = new SpannableString( text); spannableString.setSpan(imageSpan, text.indexOf('['), text.indexOf(']') + 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); mDetailView.setText(spannableString); }
代码中主要是将 [smile]文本 替换成了 R.id.smile图像
布局文件:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context=".MainActivity" > <TextView android:id="@+id/detail" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/hello_world" /> </RelativeLayout>
==================================================================================================
至于要实现第一图所示的QQ聊天输入框的效果,需要找到多张QQ表情图片,然后和相对应的文本,用一个Map<String key,Integer value>来存储起来。然后使用网格布局,将所有的表情都进行相关的缩放效果后再显示出来,还得使用分页技术,以及添加立体翻转效果特效等,这里就不贴代码了。
可以参考网上的相关博客:
Android
UI【android 仿微信、QQ聊天,带表情,可翻页,带翻页拖动缓冲】
地址:http://blog.csdn.net/lnb333666/article/details/8546497
下面是一个简单的工具栏
import java.util.HashMap; import java.util.Map; import java.util.Map.Entry; import java.util.regex.Matcher; import java.util.regex.Pattern; import android.content.Context; import android.text.Spannable; import android.text.Spannable.Factory; import android.text.style.ImageSpan; import com.fanxin.app.R; public class SmileUtils { public static final String ee_1 = "[):]"; public static final String ee_2 = "[:D]"; public static final String ee_3 = "[;)]"; public static final String ee_4 = "[:-o]"; public static final String ee_5 = "[:p]"; public static final String ee_6 = "[(H)]"; public static final String ee_7 = "[:@]"; public static final String ee_8 = "[:s]"; public static final String ee_9 = "[:$]"; public static final String ee_10 = "[:(]"; public static final String ee_11 = "[:'(]"; public static final String ee_12 = "[:|]"; public static final String ee_13 = "[(a)]"; public static final String ee_14 = "[8o|]"; public static final String ee_15 = "[8-|]"; public static final String ee_16 = "[+o(]"; public static final String ee_17 = "[<o)]"; public static final String ee_18 = "[|-)]"; public static final String ee_19 = "[*-)]"; public static final String ee_20 = "[:-#]"; public static final String ee_21 = "[:-*]"; public static final String ee_22 = "[^o)]"; public static final String ee_23 = "[8-)]"; public static final String ee_24 = "[(|)]"; public static final String ee_25 = "[(u)]"; public static final String ee_26 = "[(S)]"; public static final String ee_27 = "[(*)]"; public static final String ee_28 = "[(#)]"; public static final String ee_29 = "[(R)]"; public static final String ee_30 = "[({)]"; public static final String ee_31 = "[(})]"; public static final String ee_32 = "[(k)]"; public static final String ee_33 = "[(F)]"; public static final String ee_34 = "[(W)]"; public static final String ee_35 = "[(D)]"; private static final Factory spannableFactory = Spannable.Factory .getInstance(); private static final Map<Pattern, Integer> emoticons = new HashMap<Pattern, Integer>(); static { addPattern(emoticons, ee_1, R.drawable.ee_1); addPattern(emoticons, ee_2, R.drawable.ee_2); addPattern(emoticons, ee_3, R.drawable.ee_3); addPattern(emoticons, ee_4, R.drawable.ee_4); addPattern(emoticons, ee_5, R.drawable.ee_5); addPattern(emoticons, ee_6, R.drawable.ee_6); addPattern(emoticons, ee_7, R.drawable.ee_7); addPattern(emoticons, ee_8, R.drawable.ee_8); addPattern(emoticons, ee_9, R.drawable.ee_9); addPattern(emoticons, ee_10, R.drawable.ee_10); addPattern(emoticons, ee_11, R.drawable.ee_11); addPattern(emoticons, ee_12, R.drawable.ee_12); addPattern(emoticons, ee_13, R.drawable.ee_13); addPattern(emoticons, ee_14, R.drawable.ee_14); addPattern(emoticons, ee_15, R.drawable.ee_15); addPattern(emoticons, ee_16, R.drawable.ee_16); addPattern(emoticons, ee_17, R.drawable.ee_17); addPattern(emoticons, ee_18, R.drawable.ee_18); addPattern(emoticons, ee_19, R.drawable.ee_19); addPattern(emoticons, ee_20, R.drawable.ee_20); addPattern(emoticons, ee_21, R.drawable.ee_21); addPattern(emoticons, ee_22, R.drawable.ee_22); addPattern(emoticons, ee_23, R.drawable.ee_23); addPattern(emoticons, ee_24, R.drawable.ee_24); addPattern(emoticons, ee_25, R.drawable.ee_25); addPattern(emoticons, ee_26, R.drawable.ee_26); addPattern(emoticons, ee_27, R.drawable.ee_27); addPattern(emoticons, ee_28, R.drawable.ee_28); addPattern(emoticons, ee_29, R.drawable.ee_29); addPattern(emoticons, ee_30, R.drawable.ee_30); addPattern(emoticons, ee_31, R.drawable.ee_31); addPattern(emoticons, ee_32, R.drawable.ee_32); addPattern(emoticons, ee_33, R.drawable.ee_33); addPattern(emoticons, ee_34, R.drawable.ee_34); addPattern(emoticons, ee_35, R.drawable.ee_35); } private static void addPattern(Map<Pattern, Integer> map, String smile, int resource) { map.put(Pattern.compile(Pattern.quote(smile)), resource); } /** * replace existing spannable with smiles * * @param context * @param spannable * @return */ public static boolean addSmiles(Context context, Spannable spannable) { boolean hasChanges = false; for (Entry<Pattern, Integer> entry : emoticons.entrySet()) { Matcher matcher = entry.getKey().matcher(spannable); while (matcher.find()) { boolean set = true; for (ImageSpan span : spannable.getSpans(matcher.start(), matcher.end(), ImageSpan.class)) if (spannable.getSpanStart(span) >= matcher.start() && spannable.getSpanEnd(span) <= matcher.end()) spannable.removeSpan(span); else { set = false; break; } if (set) { hasChanges = true; spannable.setSpan(new ImageSpan(context, entry.getValue()), matcher.start(), matcher.end(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); } } } return hasChanges; } public static Spannable getSmiledText(Context context, CharSequence text) { Spannable spannable = spannableFactory.newSpannable(text); addSmiles(context, spannable); return spannable; } public static boolean containsKey(String key) { boolean b = false; for (Entry<Pattern, Integer> entry : emoticons.entrySet()) { Matcher matcher = entry.getKey().matcher(key); if (matcher.find()) { b = true; break; } } return b; } }
====================================================================================
作者:欧阳鹏 欢迎转载,与人分享是进步的源泉!
转载请保留原文地址:http://blog.csdn.net/ouyang_peng
====================================================================================
[align=left] [/align]
相关文章推荐
- 【Android 工具类】常用工具类(方法)大全
- Android Fragment 你应该知道的一切
- android-RelativeLayout实现顶部、中部、底部布局
- Android布局中match_parent和fill_parent的用法和区别
- android webview js交互 第一节 (java和js交互)
- Android Fragment 真正的完全解析(下)
- android多线程下载
- Android Fragment 真正的完全解析(上)
- android-RelativeLayout实现水平布局
- Android 的适配问题
- IMX6DL 在Android4.4.2版本插入SD卡不能开机
- 如何成为受市场欢迎的Android开发
- 浅谈被加壳ELF(即android的so文件)的调试
- 9个Web工具提高Android开发效率
- Android一个TextView设置多种颜色的2种高效方法
- android 模拟器 hosts文件修改
- Android动画初学
- Android SharedPreferences Api
- Android学习之联系人PinnedHeaderListView(通讯录)
- android动画介绍之 自定义Animation动画实现qq抖一抖效果