Multiple groups, same object

akak · November 9, 2014, 8:46pm

Hello,

I am new to programming so this an orientation question.

I have this simple app: one screen - three buttons - a text object

Each button triggers a separate function to add, subtract and set to 0 a variable which value is shown by the text object.

Imagine it as a very rudimental calculator or even better an abacus. This is very simple I managed to make it work…awesome.

But suppose now I want three ‘rows’ in my app one of each displaying identical sets of the three buttons operating on three separate values displayed by their respective text object.

I how do I proceed? Being code illiterate I would write the same code to display each single object and creating similar functions to handle every single event in each row… This wouldn’t be too time consuming 'cause I only want three rows, but If I’d want to do it the ‘right’ way where should I look at?

Creating a group and multiply it as twins groups? And how to use the same function to handle different values?

Sorry if I didn’t make myself too clear but I’d need guidance at least at what tutorial-library look at.

Thanks!!!

rob · November 9, 2014, 9:23pm

Without knowing more about what your code does or looks like, it almost sounds like you’re making a calculator. Let’s use the calculator to get you thinking about the problem a little.

In a traditional calculator, for the numbers, the buttons are all identical except for the number shown and the value that gets entered into the equation and where they are on the face of the calculator. The action when each of the buttons is pressed, it adds the number to the display.

You have other buttons that are close, but behave differently. Pressing the + button causes an add operation which is different than adding a number to the display. The buttons could also be a different color and so on.

The number buttons can also be done programmatically:

for i = 0, 9 do

makeNumberButton(i)

end

By using a loop, you can create all numbers because the code is basically the same and you can use the index value (i) to set the numeric properties of the button as well as potentially position the button. But the Add and Subtract buttons need to be different. They need their unique processing. You can’t gain any advantage from the loop in providing the display for the button.

You also need to probably save a reference to each button. The loop method when combined with an array of buttons will give you a good way to track them if a numeric index makes sense.

buttonFred, buttonBarney, buttonWilma, buttonBetty would not make sense to be numerically indexed. button[1], button[2], button[3] does.

If you can’t come up with a solid reason to use a loop to create your buttons, you may as well just define them individually.

Rob

akak · November 9, 2014, 9:54pm

Hi Rob,

thanks for always being on the spot!

Here’s the code I’m using so far:

current = 0 &nbsp; &nbsp;&nbsp; local textNumber = display.newText ( "0", centerX, centerY - 180, nil , 50 ) &nbsp;&nbsp; sceneGroup:insert(textNumber) &nbsp;&nbsp; local function adding () &nbsp;&nbsp; current = current + 1 &nbsp;&nbsp; textNumber.text = current &nbsp; end &nbsp;&nbsp; local plusButton = display.newImage( "plus.png" ) &nbsp;&nbsp; sceneGroup:insert(plusButton) &nbsp;&nbsp; plusButton:addEventListener( "tap", adding ) &nbsp;&nbsp; local function subbing () &nbsp;&nbsp;&nbsp; current = current - 1 &nbsp;&nbsp;&nbsp; textNumber.text = current &nbsp;&nbsp; end &nbsp;&nbsp; local minusButton = display.newImage ("minus.png") &nbsp;&nbsp; sceneGroup:insert(minusButton) &nbsp; &nbsp;&nbsp; minusButton:addEventListener( "tap", subbing ) &nbsp;&nbsp; local function refresh() &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; current = 0 &nbsp;&nbsp;&nbsp; textNumber.text = current &nbsp;&nbsp; end &nbsp;&nbsp; local resetButton = display.newImage( "refresh.png" ) &nbsp;&nbsp; sceneGroup:insert(resetButton) &nbsp;&nbsp; resetButton.x = centerX - 80 &nbsp;&nbsp; resetButton.y = minusButton.y &nbsp;&nbsp; resetButton:addEventListener( "tap", refresh ) &nbsp; &nbsp; end

Three buttons :add, subtract, refresh. Now they’re all placed around the screen without particular criteria.

The intention is to create one of those screen you have in RPG for instance, where you have to attribute ability points, one by one to several skills on a column.

Now, forget about the amount of points available, I’d like to have say three horizontal rows each with add, sub refresh buttons and result text at this moment, all able to add-subtract by one to their respective value shown in text object.

Should I go ‘copy/paste’ for each object to create the rows and ‘copy/paste’ to create identical add-sub-refresh functions individual for each row?

Thank you!

rob · November 10, 2014, 12:22am

That may be the easiest course of action.

Rob

akak · November 10, 2014, 4:50pm

cool, I’ll try going with that…

Thanks Rob!

akak · November 10, 2014, 9:02pm

Ok done.

Just to give you an idea, 'cause to me it looks pretty prolix, is there a way to make it more concise?

------------- ROW1 --------------- current1 = 0 local Row\_1 = display.newGroup( ) local textNumber1 = display.newText ( "0", 0, 0, nil , 25 ) local function adding1 () &nbsp;&nbsp; current1 = current1 + 1 &nbsp;&nbsp; textNumber1.text = current1 &nbsp;&nbsp; audio.play( plusClick) &nbsp;&nbsp; end local function subbing1 () &nbsp;&nbsp;&nbsp; current1 = current1 - 1 &nbsp;&nbsp;&nbsp; textNumber1.text = current1 &nbsp;&nbsp;&nbsp; audio.play( minuClick ) &nbsp;&nbsp; end &nbsp; local function refresh1() &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; current1 = 0 &nbsp;&nbsp;&nbsp; textNumber1.text = current1 &nbsp;&nbsp;&nbsp; audio.play( ResetClick )&nbsp;&nbsp; &nbsp; &nbsp;&nbsp; end&nbsp;&nbsp;&nbsp; &nbsp; local plusButton1 = display.newImage( "plus.png" ) &nbsp;&nbsp; plusButton1:scale(.5,.5) &nbsp;&nbsp; plusButton1.x = textNumber1.x - 240 &nbsp;&nbsp; plusButton1:addEventListener( "tap", adding1 ) local minusButton1 = display.newImage ("minus.png") &nbsp;&nbsp; minusButton1:scale(.5,.5) &nbsp;&nbsp; minusButton1.x = textNumber1.x - 158 &nbsp;&nbsp; minusButton1:addEventListener( "tap", subbing1 ) local resetButton1 = display.newImage( "refresh.png" ) &nbsp;&nbsp; resetButton1:scale(.5,.5) &nbsp;&nbsp; resetButton1.x = textNumber1.x - 75 &nbsp;&nbsp; resetButton1:addEventListener( "tap", refresh1 ) Row\_1:insert(textNumber1) Row\_1:insert(plusButton1) Row\_1:insert(minusButton1) Row\_1:insert(resetButton1) sceneGroup:insert(Row\_1) Row\_1.y = centerY - 180 Row\_1.x = centerX + 120 ------------- ROW2 --------------- current2 = 0 local Row\_2 = display.newGroup( ) local textNumber2 = display.newText ( "0", 0, 0, nil , 25 ) local function adding2 () &nbsp;&nbsp; current2 = current2 + 1 &nbsp;&nbsp; textNumber2.text = current2 &nbsp;&nbsp; audio.play( plusClick) &nbsp;&nbsp; end local function subbing2 () &nbsp;&nbsp;&nbsp; current2 = current2 - 1 &nbsp;&nbsp;&nbsp; textNumber2.text = current2 &nbsp;&nbsp;&nbsp; audio.play( minuClick ) &nbsp;&nbsp; end &nbsp; local function refresh2() &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; current2 = 0 &nbsp;&nbsp;&nbsp; textNumber2.text = current2 &nbsp;&nbsp;&nbsp; audio.play( ResetClick )&nbsp;&nbsp; &nbsp; &nbsp;&nbsp; end&nbsp;&nbsp;&nbsp; &nbsp; local plusButton2 = display.newImage( "plus.png" ) &nbsp;&nbsp; plusButton2:scale(.5,.5) &nbsp;&nbsp; plusButton2.x = textNumber2.x - 240 &nbsp;&nbsp; plusButton2:addEventListener( "tap", adding2 ) local minusButton2 = display.newImage ("minus.png") &nbsp;&nbsp; minusButton2:scale(.5,.5) &nbsp;&nbsp; minusButton2.x = textNumber2.x - 158 &nbsp;&nbsp; minusButton2:addEventListener( "tap", subbing2 ) local resetButton2 = display.newImage( "refresh.png" ) &nbsp;&nbsp; resetButton2:scale(.5,.5) &nbsp;&nbsp; resetButton2.x = textNumber2.x - 75 &nbsp;&nbsp; resetButton2:addEventListener( "tap", refresh2 ) Row\_2:insert(textNumber2) Row\_2:insert(plusButton2) Row\_2:insert(minusButton2) Row\_2:insert(resetButton2) sceneGroup:insert(Row\_2) Row\_2.y = Row\_1.y + 99 Row\_2.x = centerX + 120 ------------- ROW3 --------------- current3 = 0 local Row\_3 = display.newGroup( ) local textNumber3 = display.newText ( "0", 0, 0, nil , 25 ) local function adding3 () &nbsp;&nbsp; current3 = current3 + 1 &nbsp;&nbsp; textNumber3.text = current3 &nbsp;&nbsp; audio.play( plusClick) &nbsp;&nbsp; end local function subbing3 () &nbsp;&nbsp;&nbsp; current3 = current3 - 1 &nbsp;&nbsp;&nbsp; textNumber3.text = current3 &nbsp;&nbsp;&nbsp; audio.play( minuClick ) &nbsp;&nbsp; end &nbsp; local function refresh3() &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; current3 = 0 &nbsp;&nbsp;&nbsp; textNumber3.text = current3 &nbsp;&nbsp;&nbsp; audio.play( ResetClick )&nbsp;&nbsp; &nbsp; &nbsp;&nbsp; end&nbsp;&nbsp;&nbsp; &nbsp; local plusButton3 = display.newImage( "plus.png" ) &nbsp;&nbsp; plusButton3:scale(.5,.5) &nbsp;&nbsp; plusButton3.x = textNumber3.x - 240 &nbsp;&nbsp; plusButton3:addEventListener( "tap", adding3 ) local minusButton3 = display.newImage ("minus.png") &nbsp;&nbsp; minusButton3:scale(.5,.5) &nbsp;&nbsp; minusButton3.x = textNumber3.x - 158 &nbsp;&nbsp; minusButton3:addEventListener( "tap", subbing3 ) local resetButton3 = display.newImage( "refresh.png" ) &nbsp;&nbsp; resetButton3:scale(.5,.5) &nbsp;&nbsp; resetButton3.x = textNumber3.x - 75 &nbsp;&nbsp; resetButton3:addEventListener( "tap", refresh3 ) Row\_3:insert(textNumber3) Row\_3:insert(plusButton3) Row\_3:insert(minusButton3) Row\_3:insert(resetButton3) sceneGroup:insert(Row\_3) Row\_3.y = Row\_1.y + 200 Row\_3.x = centerX + 120 ------------ ROW4 ----------------- current4 = 0 local Row\_4 = display.newGroup( ) local textNumber4 = display.newText ( "0", 0, 0, nil , 25 ) local function adding4 () &nbsp;&nbsp; current4 = current4 + 1 &nbsp;&nbsp; textNumber4.text = current4 &nbsp;&nbsp; audio.play( plusClick) &nbsp;&nbsp; end local function subbing4 () &nbsp;&nbsp;&nbsp; current4 = current4 - 1 &nbsp;&nbsp;&nbsp; textNumber4.text = current4 &nbsp;&nbsp;&nbsp; audio.play( minuClick ) &nbsp;&nbsp; end &nbsp; local function refresh4() &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; current4 = 0 &nbsp;&nbsp;&nbsp; textNumber4.text = current4 &nbsp;&nbsp;&nbsp; audio.play( ResetClick )&nbsp;&nbsp; &nbsp; &nbsp;&nbsp; end&nbsp;&nbsp;&nbsp; &nbsp; local plusButton4 = display.newImage( "plus.png" ) &nbsp;&nbsp; plusButton4:scale(.5,.5) &nbsp;&nbsp; plusButton4.x = textNumber4.x - 240 &nbsp;&nbsp; plusButton4:addEventListener( "tap", adding4 ) local minusButton4 = display.newImage ("minus.png") &nbsp;&nbsp; minusButton4:scale(.5,.5) &nbsp;&nbsp; minusButton4.x = textNumber4.x - 158 &nbsp;&nbsp; minusButton4:addEventListener( "tap", subbing4 ) local resetButton4 = display.newImage( "refresh.png" ) &nbsp;&nbsp; resetButton4:scale(.5,.5) &nbsp;&nbsp; resetButton4.x = textNumber4.x - 75 &nbsp;&nbsp; resetButton4:addEventListener( "tap", refresh4 ) Row\_4:insert(textNumber4) Row\_4:insert(plusButton4) Row\_4:insert(minusButton4) Row\_4:insert(resetButton4) sceneGroup:insert(Row\_4) Row\_4.y = Row\_1.y + 300 Row\_4.x = centerX + 120

akak · November 11, 2014, 2:33pm

Since I’m very new to programming, my question would be:

How do I create, at least, single adding, subbing and resetting function that get passed the 4 differente ‘current’ variables and operate on them?

I am trying to trim fat to this code…

rob · November 9, 2014, 9:23pm