Android Question Panel different corner

[imgsimonebiliato]

Hello,
look at the attached image. Is it possible to create a panel, where the image is red?
I need to set different event for every slot on the ball

 

[derez]

I need to set different event for every slot on the ball

You can have one touch event for the whole panel and then check the color in the x y point. That will work if every piece has a different color.
If it is red - do one thing, if another color - do something else...
For example, the following code checks for black:

Sub coverpanel_Touch (Action As Int, X As Float, Y As Float) As Boolean 'Return True to consume the event
If  getcolor(bmp.GetPixel(x,y )) then ...
end sub

Sub getcolor(clr As Int) As Boolean
Dim argb() As Int
argb = GetARGB(clr)
            '  For black :
If argb(1) < 2 AND _
   argb(2) < 2 AND _
   argb(3) < 2 Then Return True Else Return False
End Sub

Sub GetARGB(Color As Int) As Int()
    Dim res(4) As Int
    res(0) = Bit.UnsignedShiftRight(Bit.AND(Color, 0xff000000), 24)
    res(1) = Bit.UnsignedShiftRight(Bit.AND(Color, 0xff0000), 16)
    res(2) = Bit.UnsignedShiftRight(Bit.AND(Color, 0xff00), 8)
    res(3) = Bit.AND(Color, 0xff)
    Return res
End Sub

For each color leave margin for the test to enable some variation in the getpixel function.

 

[LucaMs]

Probably this was a similar question.

 

[imgsimonebiliato]

You can have one touch event for the whole panel and then check the color in the x y point. That will work if every piece has a different color.
If it is red - do one thing, if another color - do something else...
For example, the following code checks for black:

Sub coverpanel_Touch (Action As Int, X As Float, Y As Float) As Boolean 'Return True to consume the event
If  getcolor(bmp.GetPixel(x,y )) then ...
end sub

Sub getcolor(clr As Int) As Boolean
Dim argb() As Int
argb = GetARGB(clr)
            '  For black :
If argb(1) < 2 AND _
   argb(2) < 2 AND _
   argb(3) < 2 Then Return True Else Return False
End Sub

Sub GetARGB(Color As Int) As Int()
    Dim res(4) As Int
    res(0) = Bit.UnsignedShiftRight(Bit.AND(Color, 0xff000000), 24)
    res(1) = Bit.UnsignedShiftRight(Bit.AND(Color, 0xff0000), 16)
    res(2) = Bit.UnsignedShiftRight(Bit.AND(Color, 0xff00), 8)
    res(3) = Bit.AND(Color, 0xff)
    Return res
End Sub

For each color leave margin for the test to enable some variation in the getpixel function.

Nice Idea. But I would like to keep the image gray in this case and not to color every each slot. Any idea?

 

[derez]

You can check by mathematics. Lets call the center of the circle cx and cy. Lets call x2 and x3 the x coordinates of the centers of the two circles. Lets call R and r the radius of the big circle and the other two circles.
Now you have these checks to do for the touched point x and y:
1. (x-cx)^2 + (y-cy)^2 < R*R if true then inside the circle, continue
2. x> cx , if true - right side, wrong - left side
3. y<cy , if true upper side, if wrong - bottom side
Lets say left top quarter is selected.
4. (x-x2)^2 + (y-cy)^2 > r*r if true its the red piece, if wrong - the other part.
The last check is for left side, for the right side use x3 instead of x2

Hint - do all these in percentages otherwise it will not work in various display sizes.

 

[LucaMs]

http://www.b4x.com/android/forum/threads/code-module-hotspots.27614/#content
?

 

[imgsimonebiliato]

I must try before write any other problems.
Using you first method derez, I've got the attacched error

 

[sorex]

Nice Idea. But I would like to keep the image gray in this case and not to color every each slot. Any idea?

simple, you have the image twice.

once with hotspot colors that is hidden and a visible one with the gray colors.


The error you get is because the "hit" happends at a position going beyond the image dimensions.

I guess you use a panel that is wider than the image size?

 

[imgsimonebiliato]

simple, you have the image twice.

once with hotspot colors that is hidden and a visible one with the gray colors.

not bad.. But I don't know what hotspot is because I never worked with then

 

[sorex]

a hotspot is a clickable thing inside an image or other object.

 

[sorex]

in this case the hotspot is that red shape in your example image

 

[imgsimonebiliato]

Please
Help the error above

 

[derez]

My proposed solution in code

 

[imgsimonebiliato]

My proposed solution in code

WONDERFUL!! It will give me huge help. Many thanks!

 

[imgsimonebiliato]

Right now I must different each slot. I thought that I can place some label, but can I write them like this?

U
S
E
R

 

[derez]

If the panel width is less then 100%x, you should multiply all the variables by panel.width, to get the ratio correct.
cx and cy should be the values of the center of the panel. R1 and r2 should match the radius accordingly.
Also note that the strokewidth (sw variable) should also be in percentage to meet all kinds of display size.

 

[imgsimonebiliato]

If the panel width is less then 100%x, you should multiply all the variables by panel.width, to get the ratio correct.
cx and cy should be the values of the center of the panel. R1 and r2 should match the radius accordingly.
Also note that the strokewidth (sw variable) should also be in percentage to meet all kinds of display size.

Yep, I did it ... Do you advise me labels for each slot?

 

[derez]

Wrote it again for a panel, placed anywhere.

 

[derez]

Do you advise me labels for each slot?

You can draw text or put labels. If you put labels you cannot make them click because then the panel's touch will not work.

 

[imgsimonebiliato]

You can draw text or put labels. If you put labels you cannot make them click because then the panel's touch will not work.

Looking something like this (attacched):