Android: Setting onClickListener to a Part of text in a TextView - Issue

Question

I am trying to recognise hashtags in my TextView and make them clickable such that I can take the user to another View when they click on the Hashtag.

I managed to identify Hashtags in the TextView using Pattern Matching and they appear colored in Runtime. However, I need to make the Hashtag clickable.

Here's my Code:

 SpannableString hashText = new SpannableString("I just watched #StarWars and it was incredible. It's a #MustWatch #StarWars");
 Matcher matcher = Pattern.compile("#([A-Za-z0-9_-]+)").matcher(hashText);

 while (matcher.find())
 {
          hashText.setSpan(new ForegroundColorSpan(Color.parseColor("#000763")), matcher.start(), matcher.end(), 0);
          String tag = matcher.group(0);
 }

 holder.caption.setText(hashText);

 //I need to set an OnClick listener to all the Hashtags recognised

Using the same solution above, how can I add onclick listeners to every hashtag?

there are libraries out there to do the same, check this out : https://github.com/Danylo2006/HashTagHelper — Sachin Rao, Dec 31 '15 at 05:23
@SachinRao Looks like that library is not available for minimum sdk 9 :( — Jay, Dec 31 '15 at 05:28
try pasting the 2 java files into any of your package. (HashTagHelper and ClickableForegroundColorSpan) — Sachin Rao, Dec 31 '15 at 05:39

score 23 · Accepted Answer · edited May 23 '17 at 12:25

there is a way... after seeing your question i was just googling .. and i found this, i hope it will work...

1. you can use android.text.style.ClickableSpan link

SpannableString ss = new SpannableString("Hello World");
    ClickableSpan span1 = new ClickableSpan() {
        @Override
        public void onClick(View textView) {
            // do some thing
        }
    };

    ClickableSpan span2 = new ClickableSpan() {
        @Override
        public void onClick(View textView) {
            // do another thing
        }
    };

    ss.setSpan(span1, 0, 4, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    ss.setSpan(span2, 6, 10, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

    textView.setText(ss);
    textView.setMovementMethod(LinkMovementMethod.getInstance());

another way.. link

 TextView myTextView = new TextView(this);
    String myString = "Some text [clickable]";
    int i1 = myString.indexOf("[");
    int i2 = myString.indexOf("]");
    myTextView.setMovementMethod(LinkMovementMethod.getInstance());
    myTextView.setText(myString, BufferType.SPANNABLE);
    Spannable mySpannable = (Spannable)myTextView.getText();
    ClickableSpan myClickableSpan = new ClickableSpan()
    {
     @Override
     public void onClick(View widget) { /* do something */ }
    };
    mySpannable.setSpan(myClickableSpan, i1, i2 + 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);

answer just copied from those link...

Ravi · Answer 2 · 2015-12-31T05:48:09.870

Yes you can do it, you need to use ClickableSpan with SpannableString

paste this code inside your while loop

final String tag = matcher.group(0);
ClickableSpan clickableSpan = new ClickableSpan() {
                @Override
                public void onClick(View textView) {
                    Log.e("click","click " + tag);
                }
                @Override
                public void updateDrawState(TextPaint ds) {
                    super.updateDrawState(ds);

                }
            };
            hashText.setSpan(clickableSpan, matcher.start(), matcher.end(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

Dont forget to set setMovementMethod() on your TextView

holder.caption.setMovementMethod(LinkMovementMethod.getInstance());

score 5 · Answer 3 · answered Dec 31 '15 at 05:43

You can change the color with clickable any key(@,#) text from textview by using this code.I use this formate.It work well in my side.

private void setTags(TextView pTextView, String pTagString) {
    SpannableString string = new SpannableString(pTagString);

    int start = -1;

    for (int i = 0; i < pTagString.length(); i++) {
        if (pTagString.charAt(i) == '@' || pTagString.charAt(i) == '#') {               
            start = i;

        } else if (pTagString.charAt(i) == ' '
                || (i == pTagString.length() - 1 && start != -1)) {
            if (start != -1) {
                if (i == pTagString.length() - 1) {
                    i++; // case for if hash is last word and there is no
                            // space after word
                }

                final String tag = pTagString.substring(start, i);              
                string.setSpan(new ClickableSpan() {

                    @Override
                    public void onClick(View widget) {

                        Toast.makeText(mContext, "" + tag, 3000)
                                .show();
                    }
                    @Override
                    public void updateDrawState(TextPaint ds) {

                        if (tag.contains("@"))
                            ds.setColor(Color.parseColor("#0474be"));
                        else
                            ds.setColor(Color.parseColor("#ed6057"));

                        ds.setUnderlineText(false);
                    }
                }, start, i, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
                start = -1;
            }
        }
    }

    pTextView.setMovementMethod(LinkMovementMethod.getInstance());
    pTextView.setText(string);
}

Please try this way hope you can solve your problem.

score 3 · Answer 4 · answered Dec 31 '15 at 06:34

//Got But Without Pattern Match

    SpannableString hashText = new SpannableString("I just watched #StarWars and it was incredible. It's a #MustWatch #StarWars");



    ClickableSpan clickableSpanstar1stWarsHashText = new ClickableSpan() {
        @Override
        public void onClick(View widget) {
            //Intent starWars = new Intent(MainActivity.this,starWars.class); //starWars is a class file which extends Activity
            //startActivity(starWars);
            Toast.makeText(MainActivity.this,"Clicked On 1st #StarWars Remove comments of above line",Toast.LENGTH_LONG).show();
        }
    };

    ClickableSpan clickableSpanmustWatchHashText = new ClickableSpan() {
        @Override
        public void onClick(View widget) {
            //Intent mustWatch = new Intent(MainActivity.this,mustWatch.class); //starWars is a class file which extends Activity
            //startActivity(mustWatch);
            Toast.makeText(MainActivity.this,"Clicked On #MustWatch Remove comments of above line",Toast.LENGTH_LONG).show();
        }
    };

    ClickableSpan clickableSpanstar2ndWarsHashText = new ClickableSpan() {
        @Override
        public void onClick(View widget) {
            //Intent starWars = new Intent(MainActivity.this,starWars.class); //starWars is a class file which extends Activity
            //startActivity(starWars);
            Toast.makeText(MainActivity.this,"Clicked On 2nd #StarWars Remove comments of above line",Toast.LENGTH_LONG).show();
        }
    };

    hashText.setSpan(clickableSpanstar1stWarsHashText,15,24, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    hashText.setSpan(clickableSpanmustWatchHashText, 55, 65, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
    hashText.setSpan(clickableSpanstar2ndWarsHashText,66,75, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);




    //SpannableString hashText = new SpannableString("I just watched #StarWars and it was incredible. It's a #MustWatch #StarWars");

    TextView  textView = (TextView) findViewById(R.id.textView); //textView id i.e. android:id="@+id/textView"
    textView.setText(hashText);
    textView.setMovementMethod(LinkMovementMethod.getInstance());
    textView.setHighlightColor(Color.TRANSPARENT);

score 2 · Answer 5 · edited May 23 '17 at 12:32

2

You can use android.text.style.ClickableSpan for this: Refer answer

edited May 23 '17 at 12:32

Community

1
1

answered Dec 31 '15 at 05:35

Jas

3,207
2
15
45

score 1 · Answer 6 · answered Dec 31 '15 at 06:18

You can achieve it by using split function and populate textview's in a Layout like this :

 layout=(LinearLayout)findViewById(R.id.layout);
 String data="I just watched #StarWars and it was incredible. It's a #MustWatch #StarWars";
TextView textView;
     String [] s=data.split(" ");
     for(int i=0;i<s.length;i++){
         if(s[i].matches("#([A-Za-z0-9_-]+)")){

              textView=new TextView(this);
              textView.setText(s[i]);
              textView.setTextColor(Color.parseColor("#000763"));
              textView.setTag(s[i]);
              textView.setOnClickListener(viewClicked(textView));
         }else{
             textView=new TextView(this);
              textView.setText(" "+s[i]);
         }
         layout.addView(textView,i);
     }

and a Method to handle click event to required Textview's :

 View.OnClickListener viewClicked(final TextView textView)  {
    return new View.OnClickListener() {
        public void onClick(View v) {
            Toast.makeText(getApplicationContext(), v.getTag().toString(), 1000).show();

        }
    };
}

score 0 · Answer 7 · answered Jan 25 '19 at 09:38

I had similar problem - I had to do sth on a part of text clicked, but string was created at runtime. Maybe it will help someone - in this solution we do not care about finding indexStart, indexEnd in whole text (what can be quite awful) etc.:

 val action1ClickedSpan = object : ClickableSpan() {
     override fun onClick(widget: View?) {
          presenter.action1Clicked()
     }
 }

 val possibleActionsHint = SpannableStringBuilder().apply {
     val action1Start = this.length
     append(getString(R.string.action1))
     val action2Start = this.length

     append(...)
     append(...) 

     val action2Start = this.length
     append(getString(R.string.action1))
     val action2End = this.length

     setSpan(action1ClickedSpan, action1Start, action1End, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE)
     setSpan(...)
 }

 this.possibleActionsTextView.apply {
     text = possibleActionsHint
     movementMethod = LinkMovementMethod.getInstance()
 }

Android: Setting onClickListener to a Part of text in a TextView - Issue

7 Answers7

Linked