Develop Reference

Finger selection UI screen

I am creating layout for finger selection. In this I am trying to achieve click events for each individual finger. This layout should be uniform on any type of screen resolution.
My approach:
Inside relative layout, I am assigning radio buttons (not radio group but individual) to each finger inside hand image using margins and padding but it is not resting properly over finger image. They are slightly moving left or right.
Problem in this - radio button positions is changing if screen resolution changes.
I failed to find library for such click events. Also in SO I didn't find any related questions. Can someone guide me in this to library or example or better approach than this?

A several years ago I worked on the similar task. Unfortunately, I don't remember the whole solution, but idea was pretty simple. In my case it was an image of the map where a user could select a district by tapping the map. I knew the resolution of the original image that I used to display in UI. I encoded each district against its boundaries so it gave me a list of pair's number. I had a touch listener attached to ImageView that was used to display the map. So every time a user clicked on the map I got a position of his click, multiply this value by a scale factor(this one was calculated based on the size of original image and the one that was scaled by Android). Then I checked if that value laid in any polygons.
So to make it more clear:
Let width, height = size of original image
x, y = user touch
scaleWidth, scaleHeight = size of the image displayed by Android on the user device
scaleX = scaleWidth / width, scaleY = scaleHeight / height
originalX = scaleX * x, originalY = scaleY * y
Then check if originalX and originalY fits in polygons. In your case those polygons could be just squares around every finger.

View coordinate in Screen

I have the next question:
Im developing an app that when i move a imageView and drop it, if the view drops under the half height of the screen goes to a (X,Y) position and if is over the half height screen, goes to another position.
I need to calculate the half of the screen generic, so i use the next code:
DisplayMetrics displaymetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
halfHeight = displaymetrics.heightPixels / 2;
This works great, im trying in a screen 1920x1080, the code returns 540.
But when im going to see if when i drop the view is under or over the half, here is what i dont understand. i get the Y position of the view and is ok, what i dont understand is why the Y = 0 is not on the TOP of the screen, if i move the view to the top, i get a negative Y position like -260.
Someone can explain me why this happen?
Is there i way that the (0,0) position starts in the top left of the screen?
Greets, hope you understand

If you call getX() or getY() then you are getting relative values for x and y (relative to the view that the call was dispatched from). If you call getRawX() or getRawY() it will give you the absolute position of the view relative to the device's screen.
Most likely you are getting negative values of -260 because you are dragging the ImageView 260 away from the view in which the call was made (perhaps the view on the top of the screen has a height of 260). If you are trying to use getX() or getY() to calculate the middle of the screen then you would have to take all sizes of all views into consideration but I think you want to use getRawX() and getRawY()

An angle of 0 degrees correspond to the geometric angle of 0 degrees (3 o'clock on a watch.)
try using translate to translate the co-ordinates to top of the screen.
http://developer.android.com/reference/android/graphics/Canvas.html#translate(float, float)

Android: MotionEvent's x and y pixel do not translate to image coordinates

I am using the getX() and getY() functions in MotionEvent to get the x and y positions of where the user touched the screen. I am also capturing images using the android camera. These images are 480x640. My intention is to use have the user draw a box and the get the start and end x,y positions and use them to create a box and crop the image.
Unfortunately, even if the user boxes the correct area using the android screen (which shows video from the camera), the coordinates from MotionEvent do not relate at all to the correct location on the image. Sometimes the x,y coordinates I get from the MotionEvent are actually more than 480 or 640.
Are the dimensions of the android screen different than the image's? Or do the x,y positions from MotionEvent correspond to something else

The coordinates returned depend on the pointer being used but in general are in screen coordinates, so to get the coordinates relative from the view you need to offset by the views position.
See:
http://developer.android.com/reference/android/view/MotionEvent.html#AXIS_X
For offset of the view use:
https://developer.android.com/reference/android/view/View.html#getLeft()
https://developer.android.com/reference/android/view/View.html#getTop()

Android ImageView hot spot mapping

I have an image of size 1024x768 where hotspots are mapped to work on 10" tablet but when I run my application on kindle fire the image size is reduced and hotspots won't work. Is there any formula to map the coordinates on a smaller image to be mapped with larger image ?

You don't give enough detail to provide a precise answer.
What are you using to display the image? ImageView?
Is the image scaled/cropped to maintain the aspect ratio?
Are you getting X and Y in a touch listener?
Are your hot spots implemented with some kind of hit tester comparing touched X,Y with the hot spot definitions?
Assuming ImageView and a touch listener getting X and Y, then you need to scale the hot spots to whatever resolution your image is shown at. I've done this recently by extending the ImageView class and overriding the onMeasure() callback. In onMeasure, determine whether the image is landscape or portrait then calculate the scaling factor between your images native size (the size for which you specified the hot spots) and the display size.
Something like this:
if (this.getWidth() > this.getHeight()) {
scaleFactor = ((float)this.getWidth() / (float)this.originalBitmapWidth);
} else {
scaleFactor = ((float)this.getHeight() / (float)this.originalBitmapHeight);
}
for (Hotspot hotspot : hotspots){
hotspot.setScale(scaleFactor);
}

how to draw a small bitmap on a large bitmap at a psition outside the screen in android?

Assuming that i have an android phone with max x=400 and max y=300
I have a 5000 by 5000 px bitmap and i display a 400 by 300 part of it on screen. I scroll it around using touch events. I want to draw a smaller bitmap(30 by 30px) onto that larger bitmap at location (460,370). But i cant statically do it(as my game requires). I want to draw and undraw that smaller image according to the player's input or collision detections.
What i am confused about is that suppose currently (50,50) to (450,350) of the larger image is displayed on the screen and now ,due to a certain requirement of the game at this moment, i have to draw that 30by30 bitmap at (460,370) but this point is in two systems - 1)In the big bitmap's co-ordinate system it's 460,370 but when it will come inside the visible area of screen it will have values something between (0,0) and (400,300) depending upon its position on the screen as per the player's movements...
So how do i track that image- i mean using which co-ordinate system, and how do i go about doing all this?
I know I've put it here in a very confusing way but that's the best way i can put it and i'll be really glad, and grateful to you if somebody could help me on this.....

Terminology:
Let's call the coordinates on the big map world coordinates
Let's call the coordinates on the screen view coordinates. You are talking to the drawing system (canvas?) in view coordinates.
Your currently displayed region of the bigger map is 100% defined by an offset, let's call this (offsetX, offsetY). Formally, this offset maps your world coordinates onto your view coordinates.
If you have the small image displayed at position (x, y) in world coordinates, all you need to do is subtract your offset to get to view coordinates, i.e.
viewX = worldX - offsetX;
viewY = worldY - offsetY;