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.

Djebel

Take a look at this sample.. This will help u.. Sample sample2 Good one – Clambake

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. – Djebel

I came across this tutorial and it was exactly what I needed. Hope it helps you too. – Kerianne

Please see below url, may be help you. https://mcmap.net/q/48956/-android-span-click-event – Otho

Answer 1

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);

            }               

Bacchius

The method setSpan(ClickableSpan, int, int, int) is undefined for the type Spanned, isn't the variable s an instance of the Spanned class? – Kadner

Answer 2

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

Someday

I am facing the same problem. Still have no solution. – Pedometer

yaps. i am facing same problem (cursor disable) when i set LInkMovementMehod – Armenian

Answer 3

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

Do your custom action onclick method.

Hisakohisbe

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. – Djebel

Answer 4

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

Hope that helps

Curvy

Answer 5

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;
    }    

}

Mechelle