Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

Looping Through Transitions Params
Started by kwesijc Apr 15 2018 06:28 AM

10 replies to this topic
transitions lua table loop
[TOPIC CONTROLS]
This topic has been archived. This means that you cannot reply to this topic.
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#1

kwesijc

[GLOBAL: userInfoPane.html]
kwesijc
  • Observer

  • 11 posts
  • Corona SDK

There are six objects on the screen. The user taps the 3 objects in the order in which they saw it flash on the previous scene.
 

Here is my code below. Keep I mind the code is pulling from different modules.

local fruitShuffle = require("TableShuffle")
local dragFruits = require("dragObject")
local fruits = require("fruits")
local flashObjects = ("flashObjects")
local objectData = require("objectData")

local fruitSheet = graphics.newImageSheet( "fruits.png", fruits:getSheet() )

local t = objectData.Fruits
shuffle(t)
local s = {t[1],t[2],t[3],t[4],t[5],t[6]}
-- Shuffle 6 frames order from original Image Sheet
shuffle(s)

-- Pulling frames from Shuffle table "s"
showFruitsSeqData = { 
{name="S1",sheet=fruitSheet,frames={s[1]} },
{name="S2",sheet=fruitSheet,frames={s[2]} },
{name="S3",sheet=fruitSheet,frames={s[3]} },
{name="S4",sheet=fruitSheet,frames={s[4]} },
{name="S5",sheet=fruitSheet,frames={s[5]} },
{name="S6",sheet=fruitSheet,frames={s[6]} }
					}
-- configure size and placement for each frame store in table data
local showFruitsData = 
{
	{frameIndex=s[1], width=80, height=80, x=50, y=25},
	{frameIndex=s[2], width=80, height=80, x=display.contentCenterX, y=25 },
	{frameIndex=s[3], width=80, height=80, x=270, y=25 },	
	{frameIndex=s[4], width=80, height=80, x=50, y=150 },
	{frameIndex=s[5], width=80, height=80, x=display.contentCenterX, y=150 },
	{frameIndex=s[6], width=80, height=80, x=270, y=150 }
}

local fruitsTransition = {

{time=1000, x=50 ,y=400, onComplete},
{time=1000, x=display.contentCenterX, y=400, onComplete},
{time=1000, x=270, y=400, onComplete}

}

local function moveIt(event)

	for i = 1,#fruitsTransition do
		transition.to(event.target, fruitsTransition[i] ) 
		return true
	end
end

-- Looping the data from the ShowFruitsData Table & enabling objects to to drag
for i = 1,#showFruitsData do

showFruits = display.newImageRect( fruitSheet, showFruitsData[i].frameIndex, showFruitsData[i].width, showFruitsData[i].height )
showFruits.x=showFruitsData[i].x
showFruits.y=showFruitsData[i].y

-- transition.to(showFruits, {time=1000, x=display.contentCenterX ,y=400, onComplete} )

	-- Add touch sensitivity to object
	-- showFruits:addEventListener( "touch", dragObj )
showFruits:addEventListener( "tap", moveIt)

end

When I tap on the fruits it keep going to the first position. It is not looping to the next transition position.

local fruitsTransition = {

{time=1000, x=50 ,y=400, onComplete},
{time=1000, x=display.contentCenterX, y=400, onComplete},
{time=1000, x=270, y=400, onComplete}

}

local function moveIt(event)

	for i = 1,#fruitsTransition do
		transition.to(event.target, fruitsTransition[i] ) 
		return true
	end
end

Attached File  Screen Shot 2018-04-15 at 10.02.36 AM.png   75.16KB   0 downloads

To get a better idea of what I am trying to do would be the popular 4 Pics 1 Word game. In that game the user tap the letter and each one goes into a sequential position based on the order in which you tap the letter to form a word.

 

I am trying to figure a way to do this for the objects. Any help will be appreciated. Thanks.



[TOPIC: post.html]
#2

roaminggamer

[GLOBAL: userInfoPane.html]
roaminggamer
  • Corona Geek

  • 7,585 posts
  • Corona SDK

1. You have not defined an onComplete in that table.

 

2. Your onComplete needs  to be the same function.

 

3. This is ONE way of many to do it:

local fruitsTransition = 
{
   {time=1000, x=50 ,y=400 },
   {time=1000, x=display.contentCenterX, y=400 },
   {time=1000, x=270, y=400 }
}

local function onComplete( self )
   self.transNum = self.transNum + 1
   if( self.transNum > #fruitTransition ) then 
     return end
   end
   fruitsTransition[self.transNum].onComplete = self
   transition.to( self, fruitsTransition[self.transNum] ) 
end



local function moveIt( event )
   local target = event.target
   
   target.onComplete = onComplete
   target.transNum  = 0
   target:onComplete()		

   return true
end

Edited by roaminggamer, 15 April 2018 - 08:38 AM.


[TOPIC: post.html]
#3

ldurniat

[GLOBAL: userInfoPane.html]
ldurniat
  • Contributor

  • 389 posts
  • Corona SDK

I'm not sure but you need use variable to keep track which parameters (table) for transition use for tapped fruit.

local index = 1

local function moveIt( event )


    transition.to( event.target, fruitsTransition[index] )


   index = index + 1 


    return true


end

Note:

 

1.

for i = 1,#fruitsTransition do

    transition.to(event.target, fruitsTransition[i] ) 

    return true

end

Your for loop runs only once. After it reach return statement it stops iterate.

 

2.

 

To run some code (yourListener function) after transition completed use  onComplete parameter like that 

transition.to( yourObject, { time=1000, x=50 ,y=400, onComplete=yourListener } )


[TOPIC: post.html]
#4

roaminggamer

[GLOBAL: userInfoPane.html]
roaminggamer
  • Corona Geek

  • 7,585 posts
  • Corona SDK

An alternate way to code what I showed above that may be more clear:

local function moveIt( event )
   local target = event.target

   transition.cancel( target )

   local fruitsTransition
   local transNum = 0

   function target.onComplete( self )
      transNum = transNum + 1
      if( transNum > #fruitTransition ) then return end
      fruitsTransition[transNum].onComplete = self
      transition.to( self, fruitsTransition[transNum] ) 
   end

   fruitsTransition = {
      {time=1000, x=50 ,y=400, onComplete = target },
      {time=1000, x=display.contentCenterX, y=400, onComplete = target },
      {time=1000, x=270, y=400, onComplete = target },
   }
   
   target:onComplete()		

   return true
end

Edited by roaminggamer, 15 April 2018 - 08:38 AM.


[TOPIC: post.html]
#5

roaminggamer

[GLOBAL: userInfoPane.html]
roaminggamer
  • Corona Geek

  • 7,585 posts
  • Corona SDK

Sorry, but I only focused on the transition loop (as per the title).

 

I did not address the implied (is there a better way to do this) question.

 

A link to a YouTube video and a time in the video to watch would help us understand what you want to do.  I don't play the game mentioned, so it doesn't connect with me and while I could find a random 4 pic video I might not be seeing what you're visualizing.


Edited by roaminggamer, 15 April 2018 - 08:11 AM.


[TOPIC: post.html]
#6

ldurniat

[GLOBAL: userInfoPane.html]
ldurniat
  • Contributor

  • 389 posts
  • Corona SDK

@roaminggamer:

 

1. Should be #fruitsTransition instead of #fruitTransitions :)

 

2. I  think line 

fruitsTransition[transNum].onComplete = self

 in target.onComplete function is useless since you specify onComplete parameter later. 



[TOPIC: post.html]
#7

roaminggamer

[GLOBAL: userInfoPane.html]
roaminggamer
  • Corona Geek

  • 7,585 posts
  • Corona SDK

Probably.  I may have typoed.  I generally rely on the OPs to catch them.  I'll check and correct above.

 

 

PS - I make that mistake often.  My 'writing' mind is adding an 's' when I know something is plural....

 

#transitions becomes 'number of transitions' in my mind, then I add an 's'.  Again, I do this often.  :blink:



[TOPIC: post.html]
#8

kwesijc

[GLOBAL: userInfoPane.html]
kwesijc
  • Observer

  • 11 posts
  • Corona SDK

I want to thank the both of you on helping me with this issue.  The code works but it is not exactly what I am looking for.

 

Here is the link below.

 

 

 

As the user clicks the letter it goes to a fix position. Example word CAT. User taps C goes position 1, taps A goes to position 2, taps T goes to position 3.

 

Now imagine these were the positions he used based in my code

 

 

"C" {time=1000, x=50 ,y=400, onComplete = target },
"A"{time=1000, x=display.contentCenterX, y=400, onComplete = target },
"T" {time=1000, x=270, y=400, onComplete = target }
 

I am using 3 for now but it will increase. Now after the user taps T the tap should end because there is no more positions to fill.

 

I am trying to accomplish that with my objects in the code. Hopefully that video made it clear.



[TOPIC: post.html]
#9

nick_sherman

[GLOBAL: userInfoPane.html]
nick_sherman
  • Corona Geek

  • 1,803 posts
  • Corona SDK

Just store the x, y target positions in a table. Track how many positions are filled. If filled < number of positions available, pull the data at that location and use it to transition.

[TOPIC: post.html]
#10

kwesijc

[GLOBAL: userInfoPane.html]
kwesijc
  • Observer

  • 11 posts
  • Corona SDK

@nick_sherman I will give It a try and let you all know the results.



[TOPIC: post.html]
#11

kwesijc

[GLOBAL: userInfoPane.html]
kwesijc
  • Observer

  • 11 posts
  • Corona SDK

Thank you all for helping me out. I got the code to work.
 
If you look at the original this is what I added.
 
local number = 0
local textField = display.newText(number, 30, 30, native.systemFont, 25)

local function moveIt(event)

    number = number + 1
    textField:removeSelf()
    textField = display.newText(number, 30, 30, native.systemFont, 25)

	for i = number,#fruitsTransition do
		transition.to(event.target, fruitsTransition[i] ) 
		return true
	end
end

This is how the program runs. Now that you see it is there a more efficient way of writing this code? Keep I mind I am looking to make this scalable where it can handle multiple transitions with more objects in various positions on the screen in the future. Consider this level 1.

 

Any guidance will help. Thank you.

 

 

 
Move_object_to_position.gif

Attached Files




[topic_controls]
[/topic_controls]