Leo Sutton
Leo Sutton

Reputation: 163

How to draw on an ImageView

Why will this code not draw a circle where the user touches in an imageview and output the coordinates to a textview?

package com.smallbore.smallbore;

import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.os.Bundle;
import android.view.MotionEvent;
import android.widget.ImageView;
import android.widget.TextView;

public class targetenter extends Activity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.targetenter);
    }

   public class ImageView1 extends ImageView {
        public int x;
        public int y;
        public ImageView1(Context context) {
            super(context);
            // TODO Auto-generated constructor stub
        }
        public boolean dispatchtouchevent(MotionEvent event){
            x = (int) event.getX();
            y = (int) event.getY();
            TextView t1 = (TextView)findViewById(R.id.textView2);
            t1.setText("x="+x);
            TextView t2 = (TextView)findViewById(R.id.textView3);
            t2.setText("y="+y);
            invalidate();
            return true;
        }
        @Override
        public void onDraw(Canvas canvas){
            super.onDraw(canvas);
            canvas.drawCircle(x,y,10, null );
    }
}
}

and the xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:id="@+id/linearLayout1" android:layout_height="fill_parent" android:layout_width="fill_parent">
    <TextView android:layout_height="wrap_content" android:text="@string/cposition" android:id="@+id/textView1" android:layout_width="wrap_content"></TextView>
    <com.smallbore.smallbore.targetenter.Imageview1 android:id="@+id/imageView1" android:layout_width="300dip" android:layout_height="300dip" android:background="@drawable/target" android:layout_gravity="center_horizontal"></com.smallbore.smallbore.targetenter.Imageview1>
    <TextView android:text="TextView" android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
    <TextView android:text="TextView" android:id="@+id/textView3" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView>
</LinearLayout>

Upvotes: 4

Views: 8105

Answers (3)

bigstones
bigstones

Reputation: 15267

I'm not sure that Cristian's suggestion of using dispatchTouchEvent() is a good one, that method makes sense in ViewGroup descendants to dispatch touch events to its children. Yet his recommendation of using the custom view in xml layout declaration is important. You do that like:

<package.that.contains.targetenter.imageView1 android:id ....

that is, you need to specify the full package to your custom ImageView class (btw, in Java there's the convention of using capital letter for class names: imageView1 -> ImageView1). You simply have to use it were you were using ImageView, and I think you will have to make it public or better declare it in another file.

To have your onDraw() method called, you'll need to call invalidate() as Veeresh suggests, so that your imageView1 will redraw. But you have to call its super, or you will only get the circles drawn:

@Override
public void onDraw(Canvas canvas){
    super.onDraw(canvas);
    canvas.drawCircle(x,y,10, null );
}

If you're still having problems it might be useful to see your targetenter.xml layout.

Upvotes: 0

Veeresh
Veeresh

Reputation: 1052

You are not calling invalidate() in your onTouchEvent. When ever you change something on a canvas it must be redrawn. fyi, if you are not on UI thread you must call postinvalidate(). refer to this api demo to learn more about dealing with drawing on canvas. http://developer.android.com/resources/samples/ApiDemos/src/com/example/android/apis/graphics/FingerPaint.html

Upvotes: 0

Cristian
Cristian

Reputation: 200090

Change onTouchEvent to dispatchTouchEvent. Also, make sure that you are using imageView1 in your XML, and not just ImageView.

Upvotes: 1

Related Questions