Tap to Select

Getting Started Newbie Questions
#1

Hello, 

I’m having a difficult time with the code for selecting the color of a ball a player would want to use in a game. Sorry I don’t have any of my own code, it hasn’t worked at all.

Okay, basically the player taps which ever color she/he wants to use such as Green, Red, Blue, etc. I just can’t figure out how to write that code.

Appreciate any help, 

Thanks

#2

There’s quite a lot of ways of handling this.

I’ve personally preferred using a set of sliders paired a few preset colours to choose from. Whichever you want to go with, the approach is pretty much the same, e.g.

 

local widget = require( "widget" ) local object = display.newRect( display.contentCenterX, display.contentCenterY, 120, 120 ) object.rgb = { r = 1, g = 1, b = 1 } local function sliderListener( event ) if event.target.id == 1 then -- red object.rgb.r = event.value / 100 elseif event.target.id == 2 then -- green object.rgb.g = event.value / 100 else -- blue object.rgb.b = event.value / 100 end object:setFillColor( object.rgb.r, object.rgb.g, object.rgb.b ) end local slider = {} for i = 1, 3 do slider[i] = widget.newSlider( { x = display.contentCenterX, y = display.contentCenterY + 60 + 40 \* i, id = i, width = 200, value = 100, listener = sliderListener } ) end

Now, if you wanted to just give the player a few predetermined colours to choose from, then you could just create a few buttons and assign each button a value for red, green and blue. The button function would then simply take those three values from whatever button is pressed and use them in like in my sliderListener above.

#3

Thank you for responding so quickly, but I left out an important part of my question. The balls that are to be tapped are png’s, how would your answer work with png’s.

Thanks

#4

It doesn’t really change anything. The solution goes exactly as I said above. :stuck_out_tongue:

Well, one solution, you’ve got countless ways to approach this.
 

local object = display.newRect( display.contentCenterX, display.contentCenterY, 120, 120 ) function touchListener( event ) if event.phase == "ended" then object:setFillColor( event.target.rgb[1], event.target.rgb[2], event.target.rgb[3] ) end return true end local button = display.newImage( "yourAmazingButton.png") button.x = display.contentCenterX button.y = object.y + object.height button.rgb = { 1, 0, 0 } button:addEventListener( "touch", touchListener )
#5

There’s quite a lot of ways of handling this.

I’ve personally preferred using a set of sliders paired a few preset colours to choose from. Whichever you want to go with, the approach is pretty much the same, e.g.

 

local widget = require( "widget" ) local object = display.newRect( display.contentCenterX, display.contentCenterY, 120, 120 ) object.rgb = { r = 1, g = 1, b = 1 } local function sliderListener( event ) if event.target.id == 1 then -- red object.rgb.r = event.value / 100 elseif event.target.id == 2 then -- green object.rgb.g = event.value / 100 else -- blue object.rgb.b = event.value / 100 end object:setFillColor( object.rgb.r, object.rgb.g, object.rgb.b ) end local slider = {} for i = 1, 3 do slider[i] = widget.newSlider( { x = display.contentCenterX, y = display.contentCenterY + 60 + 40 \* i, id = i, width = 200, value = 100, listener = sliderListener } ) end

Now, if you wanted to just give the player a few predetermined colours to choose from, then you could just create a few buttons and assign each button a value for red, green and blue. The button function would then simply take those three values from whatever button is pressed and use them in like in my sliderListener above.

#6

Thank you for responding so quickly, but I left out an important part of my question. The balls that are to be tapped are png’s, how would your answer work with png’s.

Thanks

#7

It doesn’t really change anything. The solution goes exactly as I said above. :stuck_out_tongue:

Well, one solution, you’ve got countless ways to approach this.
 

local object = display.newRect( display.contentCenterX, display.contentCenterY, 120, 120 ) function touchListener( event ) if event.phase == "ended" then object:setFillColor( event.target.rgb[1], event.target.rgb[2], event.target.rgb[3] ) end return true end local button = display.newImage( "yourAmazingButton.png") button.x = display.contentCenterX button.y = object.y + object.height button.rgb = { 1, 0, 0 } button:addEventListener( "touch", touchListener )