Question

My problem is pretty simple, I guess.

I want to draw a dot to the canvas as soon I touch it. The dot will be drawn to the position I touch. Next I want to draw another dot to the screen, but not on the position of the first dot. Means I want to prevent drawing an image over another image.

I tried to archieve that with the following code:

Activity Class

    public class Draw extends Activity {
    DrawView drawView;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Set full screen view
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, 
                                         WindowManager.LayoutParams.FLAG_FULLSCREEN);
        requestWindowFeature(Window.FEATURE_NO_TITLE);

        drawView = new DrawView(this);
        setContentView(drawView);
        drawView.requestFocus();
    }
}

Canvas Class

    public class DrawView extends View implements OnTouchListener {
    private static final String TAG = "DrawView";

    List<Point> points = new ArrayList<Point>();
    Vector<Bitmap> bitmaps = new Vector<Bitmap>();
    Paint paint = new Paint();


    public DrawView(Context context) {
        super(context);
        setFocusable(true);
        setFocusableInTouchMode(true);

        this.setOnTouchListener(this);
    }

    @Override
    public void onDraw(Canvas canvas) {
        canvas.drawColor(Color.WHITE);
        for (Point point : points) {
            canvas.drawBitmap(bitmaps.get(point.i), point.x, point.y, paint);
        }
    }

    public boolean onTouch(View view, MotionEvent event) {
        Log.d("Touch","Touch");
        Log.d("Points", "" + points.size());
        Log.d("Bitmaps", "" + bitmaps.size());

        int i = 0;
        for (Point point : points) {
            int height = bitmaps.get(i).getHeight();
            int width = bitmaps.get(i).getWidth();
            //Log.d("dimensions", height + ", " + width);

            for (int x = 0; x <= width; x++) {
                if (Math.floor(point.x + x) == Math.floor(event.getX())) {
                    points.get(i).isTaken = true;
                    Log.d("isTakenX", "" + point.isTaken);
                    break;
                }
                for (int y = 0; y <= height; y++) {
                    if (Math.floor(point.y + y) == Math.floor(event.getY())) {
                        points.get(i).isTaken = true;
                        Log.d("isTakenY", "" + point.isTaken);
                        break;
                    }
                }
            }
            i++;
        }
        if (event.getAction() == MotionEvent.ACTION_DOWN) {
            Log.d("EventDown","DOWN");
            boolean isTaken = false;
            for (Point point : points) {
                if (point.isTaken) {
                    isTaken = true;
                }
            }
            if (!isTaken) {
                bitmaps.add(BitmapFactory.decodeResource(getResources(), R.drawable.greenstar));
                Point point = new Point();
                point.x = event.getX();
                point.y = event.getY();
                point.i = bitmaps.size() - 1;
                points.add(point);
                //Log.d("pointClick",point.toString());
                invalidate();
                return true;
            }
        }
        return false ;
    }
}

    class Point {
        float x, y;
        int i;
        boolean isTaken = false;

        @Override
        public String toString() {
            return i + ": " + x + ", " + y;
        }
    }

In the onTouch Method you can see how I’m figuring out the position of the image that I dont want to overdraw. I’m saving all images and their points I draw to lists to be able to modify them. Next I check how much space the image takes on the screen and if I just clicked on that space.

However, after the first image got drew to the canvas, I can’t draw another one. Seems like the program is stuck on “isTaken”. Probabbly my logarithm on how to check if the space is taken is wrong. Can’t figure out what is wrong, though.

Do u have an idea?

THanks in advance

Answer 1

ok several points. One logical error and several enhancements. (code and idea)

First: When you use the foreach construct use the variable from the loop (e.g. point) to access the instance from the list you are looping over. So change your points.get(i) with a simple point.

Second: As you have circle you don’t have to check if the point is in the rectangle (I suppose that is what you want to achieve). Do a check if the distance of the centers of the two point (the ones already drawn and the new one to be drawn) is big enough. Use the Pythagoras equation for this (c^2 = a^2 * b^2).

Third(the actual error):
You logic of the two for loops is wrong you are treating x and y separately but you have to check them together. You don’t need for loops to achieve what you want.

Change your for loops to:

if(Math.pow(radius*2,2) > Math.pow(event.getX-point.x,2)+Math.pow(event.getY-point.Y, 2))
        point.isTaken = true;

Where the radius is the radius of drawn circle.
Try it with that and report back if you have more problems.