How to add click action for the ImageSpan

Question

I have a ImageSpan set in the TextEdit. And I want to add the action - when user click on the ImageSpan, it will popup a dialog and show the big image.

I checked the SDK and seems the ImageSpan doesn't support onclick. Is there anyway to enable the onclick for the ImageSpan or other Span that support Image?

I checked the code and found there is a URLSpan created with the ImageSpan because the input string is

But seems the URLSpan doesn't work and there is no click action create for it. Any idea?

Thanks.

Take a look at this sample.. This will help u.. [Sample](http://www.devdaily.com/java/jwarehouse/android/core/java/android/text/style/ImageSpan.java.shtml) [sample2](http://groups.google.com/group/android-developers/browse_thread/thread/1de938a66eecedd5) [Good one](http://www.devdaily.com/java/jwarehouse/android/core/java/com/android/internal/widget/EditStyledText.java.shtml) — Hussain, Apr 07 '11 at 04:28
I go through the sample but none of them are talking about the Click for the ImageSpan. The first Sample is the source code of ImageSpan which can't help me much. And the second sample is about how to add the imagespan to the TextView which I already know it. And the third isn't related with ImageSpan. But thanks for your help. — John Wu, Apr 07 '11 at 09:01
I came across [this tutorial](http://krishnalalstha.wordpress.com/2012/06/07/making-gosmsproevernote-like-edittext/) and it was exactly what I needed. Hope it helps you too. — robisaks, Jun 25 '12 at 15:10
Please see below url, may be help you. http://stackoverflow.com/a/16182500/596555 — boiledwater, Apr 24 '13 at 08:05

score 13 · Answer 1 · answered Jun 15 '11 at 12:26

I've been trying to solve the same problem today and find the solution. To make the image clickable you need to attach a ClickableSpan object to the same range as ImageSpan for your image. When you get your Spanned object from Html.fromHtml() you can go through the set of ImageSpan objects assigned for it and attach additional ClickableSpan object.

Like this:

            ImageSpan[] image_spans = s.getSpans(0, s.length(), ImageSpan.class);

            for (ImageSpan span : image_spans) {

                final String image_src = span.getSource();
                final int start = s.getSpanStart(span);
                final int end = s.getSpanEnd(span);

                ClickableSpan click_span = new ClickableSpan() {

                    @Override
                    public void onClick(View widget) {

                        Toast.makeText(HtmlImagesTestActivity.this,
                                "Image Clicked " + image_src,
                                Toast.LENGTH_SHORT).show();

                    }

                };

                ClickableSpan[] click_spans = s.getSpans(start, end, ClickableSpan.class);

                if(click_spans.length != 0) {

                    // remove all click spans

                    for(ClickableSpan c_span : click_spans) {
                        s.removeSpan(c_span);
                    }


                }


                s.setSpan(click_span, start, end, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

            }

The method setSpan(ClickableSpan, int, int, int) is undefined for the type Spanned, isn't the variable s an instance of the Spanned class? — Massimo Fazzolari, Jul 23 '13 at 12:23

score 11 · Answer 2 · edited Sep 29 '11 at 10:21

11

I have found the key point。 In order to response to click action, we not only set clickablespan , but also set edittext'setMovementMethod, the code is like this:

EditText.setMovementMethod(LinkMovementMethod.getInstance());

Here is the problem. If set setMovementMethod to LinkMovementMethod.getInstance(), the edittext's cursor will be gone. I don't know why

edited Sep 29 '11 at 10:21

Paresh Mayani

127,700
71
241
295

answered Sep 29 '11 at 01:24

miaohua1982

111
1
2

I am facing the same problem. Still have no solution. – Ben Lee Oct 25 '11 at 09:32
yaps. i am facing same problem (cursor disable) when i set LInkMovementMehod – Krishna Shrestha May 20 '12 at 04:38

score 0 · Answer 3 · answered Apr 09 '13 at 04:19

following the miaohua1982's answer above, it is clear that cursor is getting disabled after setting the setmovementmethod to LinkMovementmethod. I have faced similar problem in textview where action mode(which will appear on LongPress of textview) is cancelled and i m not getting any action items.I have solved this problem by extending the LinkMovementMethod and overriding a method as below. I hope even in editext it solves the problem.

class MyMovementMethod extends LinkMovementMethod{

 @Override
  public boolean canSelectArbitrarily() {
       return true;
    }    

}

score 0 · Answer 4 · answered Apr 07 '11 at 03:34

0

First, make the area clickable from the properties.
Next, add OnClickListner for the same.

Do your custom action onclick method.

answered Apr 07 '11 at 03:34

Vinay

2,395
3
30
35

Can you help to make it more specific? The ImageSpan is added into the TextView. I don't know how to enable the click in ImageSpan with properties. Is any code snipper I can reference? Thanks. – John Wu Apr 07 '11 at 08:59

score 0 · Answer 5 · answered May 27 '11 at 20:15

0

You might want to check out using ClickableSpan and attach the TextView to a LinkMovementMethod and override its onTouchEvent etc....

Hope that helps

answered May 27 '11 at 20:15

wnafee

2,126
16
23

How to add click action for the ImageSpan

5 Answers5

Linked