Noob question(s)...

Monkey Forums/Monkey Programming/Noob question(s)...

SuperDan(Posted 2012) [#1]
Hi All,

As I did with Blitz, I think I joined the party a bit late, so a big hello to all involved with this rather exciting software...

I am trying to recreate a flash banner using HTML5 instead. I made it some years ago for my works website, it has animated buttons. I have been trying to figure out how to find out where a particular graphic is on the screen to be able to select it. (A button I guess), but the only example I can find assumes any button is rectangular, what do I do if the button is a triangle for example? Or a button overlaps another one, or is just irregularly shaped?

My first idea (before I thought of buttons, I'm a bit slow) was to make a static .png 'map' with solid colour areas of where the buttons are to be located, then select the pixel colour under where the mouse was clicked, but I can't seem to find a way of getting the pixel colour.

Sorry for the long explanation...my questions are...

1) Is there a simple way to use/detect the click of irregular shaped buttons?

2) Is there a way to get a pixel's colour on a click without utilising diddy?

3) Is diddy easy to install and use? (I'm still at the starting blocks with monkey at the moment but it seems there are also a lot of useful features added by diddy)

My apology again... I'm more of a question person on the forums at the moment but hopefully my questions can help other pesky noobs, if they are indeed answerable!

Thanks,
Dan.


Gerry Quinn(Posted 2012) [#2]
I would say the usual thing with buttons is to treat them as rectangular or circular so long as they approximate those shapes. People are going to be clicking somewhere near the middle anyway. There is a PointInPoly() somewhere in code which you could use, and I think there is a ReadPixel() function somewhere (is it in Diddy) but it can get odd results in some formats. I'd recommend you keep it simple and make them rectangles or circles. For overlapping buttons, just check the one on top first and only check the one underneath if the top one doesn't register a hit. But why use overlapping buttons unless your game is actually about someone fighting a terrible UI?

Diddy is as I recall pretty easy to use although I just import diddy.functions myself. To install it, just copy it to your modules directory!


SuperDan(Posted 2012) [#3]
Thanks Gerry,

I have just installed the diddy functions and found some examples to pick the pixel colour. Unfortunately the example I found http://www.monkeycoder.co.nz/Community/posts.php?topic=1853 isn't an actual program to run, it's just some code to use in 'your own' program. I'm not at the level where I know what to do with the example code yet but I intend spending the rest of the day attempting to figure it out!

Regarding the buttons:
The reason I want to figure out how to select irregular shaped 'buttons' is just so I can understand how to tell if a user clicked on a 'game object' for example. Not all game objects will be rectangular or circular.
This is because my next project (after remaking the website banner on works website) is to make a 'sound board'. Yes it's a very noob thing to do and we all know that there's no need for any more sound boards etc etc.. but I am a musician and want to tinker with making virtual instruments... eventually. A sound board is a very basic start to a 'slightly' more complex idea I have.

Thanks again.
Dan.

Udpate...

I've just found this topic http://monkeycoder.co.nz/Community/posts.php?topic=2817 which mentions reading an image into a 2D array to be able to locate the pixel and it's colour. This sounds like just sort of thing I need to do if picking the pixel colour using the diddy method is a little slow.

Dan.


SuperDan(Posted 2012) [#4]
Sorry about the multiple questions and irrelevant topic title, I'm like a dog with two 'bones' at the moment and just don't know where to start. I've decided to shelve to the 'work' project and concentrate on my own project, which will involve needing to know what colour pixel has been selected.

I have now set about trying to read a grey scale image's pixel RGB values into an array. Can anyone tell me the best way to set up an array and read in comma separated integers into it, to be referenced later? To keep things multi platform (so I dont have to read a text file during runtime), would it be better to incorporate a data table of some kind into my code to store the image values?

Here is how I converted a grey scale image to pixel values, just in case it's useful to anyone...

I used PaintShop Pro 10 to save my image as a .pgm (grey scale image format) which is a list of values of each pixel. Because the image I used is greyscale, there is only one value needed per pixel due to the R,G and B values being the same.
When opened in a text editor the first four values can be deleted (for my purpose) because they are the file type (P2), the resolution (x then y), then the highest grey value in the image (255 in my case), I deleted these values and replaced all the spaces and carriage returns with commas to leave just a comma separated list of the pixel values.

Dan.


SuperDan(Posted 2012) [#5]
Sorry...

I've now re-posted this question in a more sensible manner, in a new topic.

http://monkeycoder.co.nz/Community/posts.php?topic=2885

Dan.


Gerry Quinn(Posted 2012) [#6]
The Monkey code is at the bottom of the ReadPixel() example. But the example is slightly advanced because it is using extern functions. The code for the different platforms is in various languages, and the Monkey code calls it.

You can see an example of how this works if you look at the functions part of the diddy module, which calls extern functions in the diddy/native folder.

With regard to speed, you only need to read one pixel every time the user clicks/taps the screen, so speed won't be a problem even if ReadPixel() is very slow. Speed would only be relevant if you were reading every pixel, for example a map showing the height of terrain at every point.


SuperDan(Posted 2012) [#7]
Thanks Gerry.

Making my own functions would be something way out of my league before I started using monkey, but now I can see what is happening on a compile (the android and html5 .build folders for example) it is all becoming clear.
I have dabbled with Java and J2ME in the past but I have learned more about Java in a couple of days by using monkey (and reading the docs/tutorials/posts) than I ever did trying to Google educate myself on Java and OOP.

This is an amazing bit of software for 90 GBP. Thanks Mark.

Dan.