Cheap way to do array of buttons?

The game I'm working on uses full width strips of color as buttons for controls, initially there are 2 buttons(strips) which then shrink along their y axis to make room for a 3rd button(strip) and so on until there are 6 buttons. This happens during the course of one layout. Each button does the same thing but passes a different value so my main character can change colors accordingly

I'm wondering what the cheapest way to do this might be, as it is now I have 6 separate sprites which all have an on touch action, I'm sure this is overkill events wise.

I thought perhaps I could use a single sprite containing all the color strips (building up over frames), on touch it would compare the y value and if it corresponded to the location of the color it would then trigger the action. Although I'm not sure how or it's even possible to get the coordinates of a touch event.

Any tips on how to get the touch y value or any other methods that might be more lightweight than my less than elegant solution would be appreciated.

Cheers!

Create 6 instances of the same sprite. Give instance variable to the sprite, containing a value or id to indicate which color it has. With this, you can call a function while passing the value from the variable as a parameter. You can also use an array to specify how many sprite you need.

Example:

arr_colors = [red, green, yellow, ...];
on start of layout {
	for each arr_colors.x element {
		create object bt_sprite
		set bt_sprite.value to arr_color[arr_color.curX]
	}
}
on clicked bt_sprite {
	call function set_color(bt_sprite.value)
}
on function call set_color(var clr) {
	player set animation/frame to clr
}[/code:18b2nmiy]

I would recommend you set all the different colors into the main character's animation/frame instead of the buttons. This allow the button to be independent as it will only pass the value needed, so if in case you add more color, you'll only need to modify the main character (no need to add new frame to the button).

Create 6 instances of the same sprite. Give instance variable to the sprite, containing a value or id to indicate which color it has. With this, you can call a function while passing the value from the variable as a parameter. You can also use an array to specify how many sprite you need.

Example:

> arr_colors = [red, green, yellow, ...];
on start of layout {
	for each arr_colors.x element {
		create object bt_sprite
		set bt_sprite.value to arr_color[arr_color.curX]
	}
}
on clicked bt_sprite {
	call function set_color(bt_sprite.value)
}
on function call set_color(var clr) {
	player set animation/frame to clr
}[/code:1k6lxplx]

I would recommend you set all the different colors into the main character's animation/frame instead of the buttons. This allow the button to be independent as it will only pass the value needed, so if in case you add more color, you'll only need to modify the main character (no need to add new frame to the button).

Great ideas, thanks so much. I'm not 100% sure what you mean by the last paragraph though, I'm currently using a gl effect for the hue shift if that makes any difference. Here's a gif of the game to better understand whats going on, the background colors are the buttons.

I mean that it might be better to use just 1 frame for the button sprite and multiple frames on the character (because you were considering making a button with multiple frame). Having multiple frame on either the character and buttons can sometimes makes it difficult to manage latter on. This of course depends on the overall design of your project. If you manage the frames well then it shouldn't be a problem too. Just an idea. But since you're using hue, then passing a value probably makes even more sense.

Your game look interesting though. Cute monster...

Cheap enough ?

https://www.dropbox.com/s/o23xb0k5bnmpg ... .capx?dl=0

99Instances2Go your "cheap" ColorCyle example rocks.

Sorry to interrupt the thread guys

Just I need to ask a quick question to 99Instances2Go

I'm mostly interested just on how you pick the (color object instance) as I need something similar related to picking instances but without the oberlaping.

My Question is related from code line 4 to 8: as is a bit confusing for me to comprehend for my lack of knowledge of course

This is how I understand the code:

Every thick: previousTouched will be -9 an less Color variable( touched ) is true, wich we change previousTouched to color.UID

But Next Every thick: Set (Touched) to false (This is one part that confuses me as it contradicts the above code as both of them run at everythick) and for me will look like previousTouched will be always -9

On code line 15: you chose the color instance that we wanna change the color to So (code 9) will pick up this object instance and set previousTouched to this color.UID that we just choosed

but on the subevent confuse me again as (it will only run only if the previousTouched is not Equal to the color instance that we just choose.

Is quite tricky to understand, and I know must have a good explenation is just I cant visualize it

Thank you in advance

For the - 9.

Never forget that object with UID=0 exists. In this case the purple one has UID = zero. Without setting it to -9, the purple colour will not work if it is the first colour accessed by the touch.

I could have deleted the first instance of color in the layout editor, so the first color gets a different UID then zero. But, construct tends to pack the UID's again in the layout editor, so that zero can/will show up again.

I could have added a fake sprite to the layout at the very start, right after making the new project. Now i am sure that this sprite will have UID=zero. And not ever touching it will keep that UID=zero on that sprite. But how do i explain this in a little/short example.

Better is to make the code account for a possible UID = zero.

So, now, if i set previousTouched to - 9. And the first touch goes over the purple one, then the caught UID (zero) is different then -9, or, there is a change in the situation. We got to act.

Also, in this case, when i set the default stat of previousTouched to any existing color UID, the color will not work when touched as first colour.

So, there are 2 things playing here.

1/ I only want to act if the touch is over a different color then it is over in the previous tick

2/ i only want the color that the touch (when touching) is over to go in the state 'touched' (boolean = true). All other colors must go in the state untouched (boolean = false)

About 1/

There can be only one color with boolean 'touched' = true. I am sure of that.

Therefor, if i (before changing anything in that state) set previousTouched to the UID of the 'touched one', then i store the UID of the color that had the state 'touched' in the previous tick (event 5)

As long as the state 'touched' is not changed (and i will change it in event 7, later on) , it reflects the previous tick.

Now, in the current tick, things could be changed. I first pick the color that touch is now/at this moment over. And that can be a different color then in the previous tick.

ONLY if its UID is different (not the same as) then the one in the previous tick (previousTouched) i start the timer that is changing colors. (event 8)

About 2/

I need only the color that the touch is over to be in the state of 'touched'. I could make some complicated inverse or else condition to archive that. But it is a LOT more simple to just set them all in the state 'untouched'. And then set only the one, that has the touch over it, to 'touched'. You see ?

Event 6 just sets them all to 'untouched' ( = boolean touched = false)

Event 7 picks that only one the touch is over and sets its state to 'touched' ( = boolean touched = true)

Sorry off topic, but this is the literally the greatest thing I've seen lately haha.

For the - 9.

Haha 99Instances2Go I read it 100 times or more and checked the capx but I don't get it yet, I'm bad

I will carry on till I get it:

I understand the part why previousTouched has to be -9 so it doesn't cause conflict with instance 0

And I get mostly What you said but the part where I have the big problem and confuse is at number 8 when comparing if is not the same (color.UID) because for me it looks like when the thick reach number 6 it will be always set to -9 because we set touched to false

So number 8 will be always true if I'm not mistaken? so if this is correct why check if is not the same as previousTouched, then run the action timer

Thank you so much for the full explanation I learned a lot

Cheap enough ?

https://www.dropbox.com/s/o23xb0k5bnmpg ... .capx?dl=0

Wow, you sir are a legend, so good. Thanks

The 'Pick overlapping point' picks the 'color' that is under the touch. For this 'color' we set the state touched to true. This is a change. Because in the previous line we set 'touched' for all 'color' to false.

Since it is a new pick, the expression color.UID returns the UID for that newly picked color.

Now we compare that color.UID to previousTouched.

previousTouched is set to the UID of the previous picked 'color', it is set before the color.UID is changed due the new pick, so it is the UID for 'color' that was picked in the previous tick.

If we compare them, we compare previous against current. Read is as ...

EVENT 5

If there is a color picked in the previous tick (is there one 'color' with 'touched' = true) , set previousTouched to color.UID. If the condtion is true, the picklist contains that one 'color' with boolean 'touched' = true. And the action has a picked 'color' to run on.

If the condtion is not true (there is no 'color' with 'touched' = true), then the default (- 9) is just unchanged. Because the actions in event 5 have no 'color' in the picklist, if there is not one 'color' with 'touched' = true. The picklist will be empty. And the action has totaly no picked 'color' to run on.

So, if there is a touched 'color' then previousTouched = color.UID, if there is no touched 'color' then previousTouched = -9.

Since at this point no boolean 'touched' changed yet, color.UID is also = UID for the 'color' that is picked in the previous tick.

EVENT 6

Sets the boolean 'touched' for all 'color' = false.

EVENT 7

Sets the boolean 'touched' according the new situation.

Since touch changed position, it is possible that a different 'color' will be picked.

'Pick overlapping point' looks what is under the touch. And sets the boolean 'touched' for the picked color to true. We need this boolean in the next tick, it will be the previous in the next tick.

As this point we again have 1 'color' with the boolean 'touched' set to true, after we have we set the boolean for all 'color' to false in the previous event(7). That is just an easy a reliable sorta kinda 'else.

In stead of

... If under touch .. set to true ... else .. set to false (that is so difficult to do)

i do

... blindly set them all false .. set the only one under touch to true (so gd easy logic)

Now we need to know if it is the same 'color' as in the previous tick, or is it a new 'color' ?

EVENT 8

So event 8 compares the UID of the PICKED color (color.UID) to UID of the color from before that pick in event 7 changed the situation.

We only need the action to run if there is a new color choosen compared to the previous tick.

99Instances2Go wow Amazing explanation thank you for your patient and for all your help you are awesome men, but it's me that I don't get it just one part because I think will be easier if I give an example for what I understand till now so you can see where I'm wrong:

let's say my first pick will be instance color 1 and we start from line 7 to make it easier

-line 7: I overlap color 1 so we set it to touched and this is the one in the pick list

-line 8: checks color 1 against "previousTouched" from line 5 wich at this moment its still -9 so is not the same then runs the code

Next thick:

line 5: we have still picked color 1 on the list so we set "previousTouched" to color 1

line 6: set all touched to false so "previousTouched" becomes = -9 again

line 7: I overlap color 2 now so we set it to touched and this is the one in the pick list

line 8: checks color 2 against "previousTouched" from line 5 wich at this moment its still -9 because on line 6 we reset it -9 as all touched becomes false

etc.......all the thicks will be the same

That's why I'm confused when on line 8 we compare against line 5 "previousTouched" because it looks for me like its always -9 before reach line 7, because it meets with line 6 before 7 and set them to -9 always

I know I'm wrong with something but I don't know were

let's say my first pick will be instance color 1 and we start from line 7 to make it easier

-line 7: I overlap color 1 so we set it to touched and this is the one in the pick list

-line 8: checks color 1 against "previousTouched" from line 5 wich at this moment its still -9 so is not the same then runs the code

Next thick:

line 5: we have still picked color 1 on the list so we set "previousTouched" to color 1

line 6: set all touched to false so "previousTouched" becomes = -9 again Nope. Only 'touched' is set to 'false'. There is totally no action that is changing 'previousTouched' to anything in line 6

So 'previousTouched' remains set to color 1

line 7: I overlap color 2 now so we set it to touched and this is the one in the pick list

line 8: checks color 2 against "previousTouched" from line 5 wich at this moment its still -9 because on line 6 we reset it -9 as all touched becomes false Nope, 'previousTouched' remains set to color 1

etc.......all the thicks will be the same

That's why I'm confused when on line 8 we compare against line 5 "previousTouched" because it looks for me like its always -9 before reach line 7, because it meets with line 6 before 7 and set them to -9 always

I know I'm wrong with something but I don't know were

99Instances2Go I finally managed to implement this and it's working great, the lerp was going to be my next mission but you have handled that too. I have one query that I can't seem to figure out. I changed the RGB effect to HSL and after doing so the colors only change while the picker is over the color, otherwise it will abandon the color change mid-transition. I solved it (temporarily?) by disabling the move picker off layout event. What am I missing here?