Detecting when mouse is a over an image

[xuan]

Hi, I want to make a board games, and so selecting caracters on it. How can I detect when my mouse is over the .gif image of my char (only whith no transparent pix) something looking like mouseEntered but on a weird random pix area.

Hope I made myself clear (sorry for my english)

[turquoise3232]

Hi,
I think that you should use mouseMoved callback and check yourself if the mouse position is in or out your "weird" zone.

[xuan]

Hi again, I finally managed to solve my pb by picking the color under my mouse ( thanx to this topic http://www.java-gaming.org/forums/index.php?topic=12780.0, sorry I should have search better before posting :p), i'll select a char  by clicking on the cell he's standing on,. It took me time to map my board ith a different color on each cell but it works well now

Games published by our own members! Check 'em out!

[DzzD]

maybe a good way would be create a canvas, same size as your image and draw your image on this canvas graphics than add a mouslistener to this canvas. so no complexe programming as(if(imouse>imagesx && etc ....) then .... )

something like:

1   2   3   4   5   6   7   8   9   10   11   12   13   14   15   16

MyImage extends Canvas {  Image image;  MyImage(Image i)  {   this.image=i;  }  public void paint(Graphic g)  {   this.update(g);  }  public void update(Graphics g)  {   g.drawImage(this.image,0,0,null);  } }

than you can use something like that:

1   2   3

MyImage i =new MyImage(anImage); i.addMouseListener(this); this.add(i);

[xuan]

The problem is that i'm using hex for the cases, so no way using a basic grid.
My solution is :
- An ugly .gif with different colors on each cases.
- A nice .jpg image I put in front of the other one
I get the coord of each case by simply picking  the the Blue and Red RGB value on the .gif => gives me X and Y position

it gives something like this :

1   2   3   4   5   6   7   8   9   10   11   12   13   14   15   16   17

public void paint( Graphics g ) {       g.drawImage(land.getLandImageMap(), 10 , 20, this ); //the ugly gif      g.drawImage(land.getLandImage(), 10 , 20, this );  //the pretty jpg   }       public void mousePressed( MouseEvent e ) {          try             {             int pcolor = land.getLandImageMap().getRGB(e.getX()-10,e.getY()-20);             Color c = new Color(pcolor);                               System.out.println("("+(c.getRed())+";"+(c.getBlue())+")");             }             catch(Exception ex)             {                System.out.println("out of image bounds");             }       }

the color of the cases on the .gif looks the same but they are not (+1bleu  for x and +1red for y)

[Abuse]

Given that your grid looks to have been created by a 3d render, if you knew the parameters of the camera with which the projected image was constructed you could mathematically compute the grid tile under the mouse cursor.

It's fairly complicated maths, but would probably be the most future-proof solution.

[xuan]

I'm only trying to do a small game atm. But maybe if I want to do a bigger one later i'll try this way.
Thanx for ur replies

[DzzD]

Given that your grid looks to have been created by a 3d render, if you knew the parameters of the camera with which the projected image was constructed you could mathematically compute the grid tile under the mouse cursor.

It's fairly complicated maths, but would probably be the most future-proof solution.

yep this is a nice solution, but you should be able to achieve this without knowing about camera by using the 2d pos of all your 6 points that make a polygone embeding your grid , than knowing this 6 pos and mouse pos you should be able to compute coordinate on grid. no time right now but I will post more information on how to achieve this later (in reallity you only need four point) , interresting stuff, just give me some minutes I will post explanation.

EDIT:


EDIT2:
hum there is a little mistake on last line computing xscalescreen
xscalescreen=xscale0-((xscale0-xscale)*mousey/fary)

[DzzD]

note that this technic can be applied to any 3d scene it enable retriving uv coordinate without knowing anything about it than three points and there corresponding uv coordinates. than you can know any other point uv from the scene directly with a simple afine tranform

I will try to share such source code soon as it seem an interresting tools to do. may help in extracting map from arbitrary 3d screenshot or pick an uv without cpu cost in a 3d scene, thanks for your question!

[erikd]

My solution is :
- An ugly .gif with different colors on each cases.
- A nice .jpg image I put in front of the other one

It's actually not such a bad solution at all, but you don't have to draw the 'ugly' gif, do you? You could just get the color from the offscreen gif. The pixels then don't have to be a matching color, but could just be indexes to the tiles.

Games published by our own members! Check 'em out!

[xuan]

Well thank you all, especially DzzD. For the moment I really want to put a char on my grid and move it, but once it's done, i'll dig in your way to make random grid, wih high ground for example.

You could just get the color from the offscreen gif

you right ^^