Page 1 of 1
Non-rectangular buttons
Posted: Sun May 01, 2016 12:29 am
by Deldrith
What I am attempting to do is make it so you can interact with an object when the mouse is over its image. For example, if there was a saw in the map, when a player put their mouse over it it would display "saw" and they could interact with it by clicking on it. This would be quite easy to do if I were only working with circle or rectangles or other easily definably shaped objects. But what I want to do here is ignore cases when you are mousing over pixels of the image that are transparent, and only have the interaction with visible pixels. Is there a way to do this other than making a ridiculous image size by image size array for every single intractable object in the game?
Re: Non-rectangular buttons
Posted: Sun May 01, 2016 1:59 am
by Kingdaro
The second best way would probably be to use a bunch of smaller simple shapes, or a polygon.
mlib does what you're probably looking for.
Re: Non-rectangular buttons
Posted: Sun May 01, 2016 5:05 am
by rhughes
Here's what I would do.
First, I would have every object set up as a rectangle. When the mouse is at a certain position, I would get all the objects that I could be pointing at by testing to see if the cursor is in the rectangle. I would then sort these objects by their depth. Next, I would test the pixel value for each object's image at the location of the cursor. If it isn't transparent, I am on the object. If it is transparent, then I can proceed to the next object.
We can ignore the depth completely if we avoid having overlapping objects.
The question we should ask first is: 'What kind of resolution do we need here?' Do we need to know the exact pixel we're pointing at? Can we get away with a 'good enough' approach? Is a simple rectangle really not going to suffice?
Re: Non-rectangular buttons
Posted: Sun May 01, 2016 6:03 am
by Deldrith
rhughes wrote:Here's what I would do.
First, I would have every object set up as a rectangle. When the mouse is at a certain position, I would get all the objects that I could be pointing at by testing to see if the cursor is in the rectangle. I would then sort these objects by their depth. Next, I would test the pixel value for each object's image at the location of the cursor. If it isn't transparent, I am on the object. If it is transparent, then I can proceed to the next object.
We can ignore the depth completely if we avoid having overlapping objects.
The question we should ask first is: 'What kind of resolution do we need here?' Do we need to know the exact pixel we're pointing at? Can we get away with a 'good enough' approach? Is a simple rectangle really not going to suffice?
There could be instances where there are multiple sprites close together or overlapping and you'd pretty much need pixel perfect accuracy to select one, unless it was done with layers or something, but that is unwieldy. How do you test pixel values for the images? I was looking at the documentation but did not see anything like that.
Re: Non-rectangular buttons
Posted: Sun May 01, 2016 6:27 am
by deströyer
https://love2d.org/wiki/ImageData:getPixel
Get the image you're pointing to and check the alpha-component of the pixel where your mouse is pointing in that image. It totally works, I've used it for an adventure-type game (that I didn't finish).
And as @rhughes suggests, you need to keep track of which order they are in / how they are layered in the scene.
Re: Non-rectangular buttons
Posted: Sun May 01, 2016 2:53 pm
by Deldrith
deströyer wrote:https://love2d.org/wiki/ImageData:getPixel
Get the image you're pointing to and check the alpha-component of the pixel where your mouse is pointing in that image. It totally works, I've used it for an adventure-type game (that I didn't finish).
And as @rhughes suggests, you need to keep track of which order they are in / how they are layered in the scene.
Thank you guys very much. I had no idea this existed and couldn't find it. This does just what I want it to do.
Re: Non-rectangular buttons
Posted: Mon May 02, 2016 11:04 pm
by CaptainMaelstrom
This all being said... whenever I see hotspots/buttons/ui interaction implemented this way in a game or program it tears me up. I feel like, as a user, I shouldn't have to aim directly onto the button I want to click, I should just have to be close.
Think about it like this: Imagine if in order to highlight text to copy it, you had to put your cursor exactly on a pixel of the character you wanted to select. It would be extremely frustrating to try and highlight several phrases in succession.
Re: Non-rectangular buttons
Posted: Mon May 02, 2016 11:51 pm
by Kingdaro
CaptainMaelstrom wrote:This all being said... whenever I see hotspots/buttons/ui interaction implemented this way in a game or program it tears me up. I feel like, as a user, I shouldn't have to aim directly onto the button I want to click, I should just have to be close.
Think about it like this: Imagine if in order to highlight text to copy it, you had to put your cursor exactly on a pixel of the character you wanted to select. It would be extremely frustrating to try and highlight several phrases in succession.
This is a pretty good point here. Highlighting elements based on proximity may be the best solution overall, all things considered.
Re: Non-rectangular buttons
Posted: Wed May 04, 2016 7:47 am
by Snake174rus
Re: Non-rectangular buttons
Posted: Wed May 04, 2016 8:17 pm
by Deldrith
CaptainMaelstrom wrote:This all being said... whenever I see hotspots/buttons/ui interaction implemented this way in a game or program it tears me up. I feel like, as a user, I shouldn't have to aim directly onto the button I want to click, I should just have to be close.
Think about it like this: Imagine if in order to highlight text to copy it, you had to put your cursor exactly on a pixel of the character you wanted to select. It would be extremely frustrating to try and highlight several phrases in succession.
I was aiming for a space station 13 style interaction, but maybe there is a better way to do it. This is definitely possible, but maybe it can be more user friendly? I'll give it some thought. Not sure though based on how objects can overlap and all that.