类似qq聊天表情实现

android qq上有这样的功能,点击表情,然后输入框EditText上显示表情微笑,博客,论坛上也有这样的功能。有些是显示qq表情的代表符号洳:“:()”这样的符号

先是从网上搜索了一下,有好几种,不过我采取ImageSapn和SpannableString来实现的。

像qq一样,先点击表情按钮,弹出表情选择view(GridView)

然后点击某一个表情,EditText上显示表情图片。

看代码:

     传入参数:position,是表情选择GridView的position

     ChatEmotion 是一个内部类,封装了图片R.drawable.xxxx数组EMO_IMAGES,还有每个聊天表情的文字代表EMO_SYMBOLS:()#@:;这样一堆符号

      这个函数返回的是SpanableString

       private SpannableString getImageSpannableString(int position){
        
        Drawable drawable = getResources().getDrawable(ChatEmotion.EMO_IMAGES[position]);
        drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
        //需要处理的文本,ChatEmotion.EMO_SYMBOLS[position]是需要被替代的文本  
        SpannableString ss = new SpannableString(ChatEmotion.EMO_SYMBOLS[position]);
        //要让图片替代指定的文字就要用ImageSpan
        ImageSpan imageSpan = new ImageSpan(drawable, ImageSpan.ALIGN_BOTTOM);
        //开始替换,注意第2和第3个参数表示从哪里开始替换到哪里替换结束(start和end)  
        //最后一个参数类似数学中的集合,[5,12)表示从5到12,包括5但不包括12  
        Log.d(TAG, String.valueOf(ChatEmotion.EMO_SYMBOLS[position].length()));
        ss.setSpan(imageSpan, 0, ChatEmotion.EMO_SYMBOLS[position].length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
        return ss;
    }

   
然后调用EditText的setText(getImageSpannableSting(position))就可以显示表情了,是不是很兴奋,哈哈

在GridView也就是表情选择View,表象上看上去像个dialog,其实是个GridView

mGridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                    int position, long id) {
                // TODO Auto-generated method stub
                int currentPos = mEditView.getSelectionStart();
                SpannableStringBuilder ssb = new SpannableStringBuilder();
               ssb.append(getImageSpannableString(position));
               mEditView.getText().insert(currentPos, SpannableString.valueOf(ssb));
                mEditView.invalidate();
            }
            
        });

打工告成



你可能感兴趣的:(android,qq,dialog,聊天)