Don't show image in TextView by ImageSpan in Android

Question

I want to show an image in TextView as a smiley. I have a method that gets a string and adds ImageSpans to a CharSequence that replace textual emoticons such as :-) with a graphical version.

public Spannable addSmileySpans(CharSequence text) {
    SpannableStringBuilder builder = new SpannableStringBuilder(text);

    Matcher matcher = mPattern.matcher(text);
    while (matcher.find()) {
        int resId = mSmileyToRes.get(matcher.group());
        builder.setSpan(new ImageSpan(mContext, resId),
                        matcher.start(), matcher.end(),
                        Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
    }

    return builder;
}

Then I use it on my adapter:

viewHolder.txtReceivedBody.setText(parser.addSmileySpans(message.body));

Also, here defined TextView elemnt:

<TextView
            android:id="@+id/txtReceivedBody"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@+id/imgReceivedDirection"
            android:layout_marginRight="30dp"
            android:background="@drawable/selector_conversation_received"
            android:minHeight="40dp"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:paddingTop="4dp"
            android:paddingBottom="4dp"
            android:textSize="18sp"
            android:autoLink="all"
            android:gravity="right"/>

Unfortunately, didn't show image in TextView and only show a main string. What should I do to solve it?

Answer 1

provide your pattern

my pattern is [id of image]

textview.setText(addSmileySpans(context,edit_text.getText()));

public CharSequence addSmileySpans(Context context, CharSequence msg) {
SpannableStringBuilder builder = new SpannableStringBuilder(your_recieved_message);
Pattern pattern = Pattern.compile("\\[([^\\[\\]]+)\\]");
if( pattern != null )
{
    Matcher matcher = pattern.matcher( your_recieved_message );
    int matchesSoFar = 0;
    while( matcher.find() )
    {
        CharSequence cs =matcher.group().subSequence(1, matcher.group().length()-1);
        int value = Integer.parseInt(cs.toString());
        System.out.println("pattern is::"+matcher.group().subSequence(1, matcher.group().length()-1)); 
        int start = matcher.start() - (matchesSoFar * 2);
        int end = matcher.end() - (matchesSoFar * 2);
        Drawable Smiley = context.getResources().getDrawable(value);
        Smiley.setBounds(0, 0,15,15);
        builder.setSpan(new ImageSpan(Smiley), start + 1, end - 1, 0 );
        builder.delete(start, start + 1);
        builder.delete(end - 2, end -1);
        matchesSoFar++;

    }
}
return builder;
}

Answer 2

Kotlin version of Manthan Patel answer

open fun addSmileySpans(context: Context, msg: CharSequence?): CharSequence? {
        val builder = SpannableStringBuilder(msg)
        val pattern: Pattern = Pattern.compile("\\[([^\\[\\]]+)\\]")
        val matcher: Matcher = pattern.matcher(msg)
        var matchesSoFar = 0
        while (matcher.find()) {
            val cs: CharSequence = matcher.group().subSequence(1, matcher.group().length - 1)
            println("pattern is::" + matcher.group().subSequence(1, matcher.group().length - 1))
            val start: Int = matcher.start() - matchesSoFar * 2
            val end: Int = matcher.end() - matchesSoFar * 2
            val value = cs.toString()
            val resources: Resources = context.resources
            val resourceId: Int = resources.getIdentifier(value, "drawable", context.packageName)
            val drawable = ContextCompat.getDrawable(context, resourceId)
            drawable?.setBounds(0, 0, drawable.intrinsicHeight, drawable.intrinsicWidth)
            builder.setSpan(ImageSpan(drawable), start + 1, end - 1, 0)
            builder.delete(start, start + 1)
            builder.delete(end - 2, end - 1)
            matchesSoFar++
        }
        return builder
    }

Usage:

Create drawable res with name ic_smile So now you have drawable at R.drawable.ic_smile And can get it by

val icSmile = ContextCompat.getDrawable(context,R.drawable.ic_smile)

To add it to text view use:

val text = "[ic_smile] My text"
textView.text = addSmileySpans(requireContext(),text)