Question

I am creating a hidden object game and am trying to mark the object when found with an eclipse. I’ve manually saved the top left and bottom right coordinates of each picture which were obtained via the GestureListener_Tap event.

The problem is when I tried to draw an eclipse bounded by the coordinates using this code

WriteableBitmapExtensions.DrawEllipse(writeableBmp, AnsX1, AnsY1, AnsX2, AnsY2, Colors.Red);

The location of the eclipse is always off to the top left. Marking the pixel locations using the following codes show that they are indeed located differently then what I would expect from the GestureListener_Tap.

writeableBmp.SetPixel(AnsX1, AnsY1, Colors.Red);
writeableBmp.SetPixel(AnsX2, AnsY2, Colors.Red);

My code for marking the location:

    private void fadeOutAnimation_Ended(object sender, EventArgs e)
    {

        WriteableBitmap writeableBmp = new WriteableBitmap(bmpCurrent);
        imgCat.Source = writeableBmp;
        writeableBmp.GetBitmapContext();

        WriteableBitmapExtensions.DrawEllipse(writeableBmp, AnsX1, AnsY1, AnsX2, AnsY2, Colors.Red);
        writeableBmp.SetPixel(AnsX1, AnsY1, Colors.Red);
        writeableBmp.SetPixel(AnsX2, AnsY2, Colors.Red);

        // Present the WriteableBitmap
        writeableBmp.Invalidate();       

        //Just some animation code
        RadFadeAnimation fadeInAnimation = new RadFadeAnimation();
        fadeInAnimation.StartOpacity = 0.2;
        fadeInAnimation.EndOpacity = 1.0;
        RadAnimationManager.Play(this.imgCat, fadeInAnimation);

    }

What am I missing?

EDIT:

My answer below does not take into account the screen orientation changed. See my comment below the answer. How do you map pixel coordinates to image coordinate?

EDIT 2:

Found a correct solution. Updated my answer

Answer 1

From @PaulAnnetts comment I managed to transform the pixel coordinates. My inital mistake was to assume the image coordinates are the same as the pixel coordinates! I use the following code to convert.

    private int xCoordinateToPixel(int coordinate)
    {
        double x;
        x = writeableBmp.PixelWidth / imgCat.ActualWidth * coordinate;
        return Convert.ToInt32(x);
    }

    private int yCoordinateToPixel(int coordinate)
    {
        double y;
        y = writeableBmp.PixelHeight / imgCat.ActualHeight * coordinate;
        return Convert.ToInt32(y);
    }

EDIT:

Since PixelHeight and PixelWidth is fixed, and ActualHeight & ActualWidth isn’t, I should convert pixel to coordinate in the GestureListerner_Tap event.

        if ((X >= xPixelToCoordinate(AnsX1) && Y >= yPixelToCoordinate(AnsY1)) && (X <= xPixelToCoordinate(AnsX2) && Y <= yPixelToCoordinate(AnsY2)))
        {...}

And my pixel to coordinate converters

    private int xPixelToCoordinate(int xpixel)
    {
        double x = imgCat.ActualWidth / writeableBmp.PixelWidth * xpixel;

        return Convert.ToInt32(x);
    }

    private int yPixelToCoordinate(int ypixel)
    {
        double y = imgCat.ActualHeight / writeableBmp.PixelHeight * ypixel;
        return Convert.ToInt32(y);
    }