Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

Swipe movement makes the character to "teleport". How to fix?
Started by Nel Capati Mar 10 2020 08:40 AM

5 replies to this topic
[TOPIC CONTROLS]
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#1

Nel Capati

[GLOBAL: userInfoPane.html]
Nel Capati
  • Observer

  • 2 posts
  • Corona SDK

Context of the game:

As most of the plane fighter / arcade shoot em up games nowadays, the basic control is to swipe anywhere in the screen to move the plane character.

 

Summary of Issue: 

The Plane character "teleports to the swiping position"

 

Things already done:

1. The design is to move the character by swiping anywhere on the screen. Most tutorials I've searched in Google is either Plane fighter with D-pad controller or the character should be dragged (event.target during run time)

 

2. I came across to this topic and gave it a try. < link >

 

Current code chunk:

local function f_planeTouchEvent( im_event )
	if ( im_event.phase == "began" ) then

		--Lets the program focus on the touched object
		display.getCurrentStage():setFocus( im_event.target, im_event.id)
		im_event.target.isFocus = true

		--Store the original X and Y values of touched object
		im_event.target.markX = im_event.target.x
		im_event.target.markY = im_event.target.y

	elseif ( im_event.phase == "moved" ) then	--Object was moved/dragged
		
		if ( im_event.target.isFocus ) then
		
			im_event.target.x = im_event.x
			im_event.target.y = im_event.y
		
		end
	end
end


--< other codes of the program here >

ld_s_plane:addEventListener( "touch", f_planeTouchEvent)

Simulation (please see attached image for visualization )

1. Start of simulation, image is at the  bottom part

2. As I swipe the upper part, the plane character teleported to where I swiped.

 

Expected Outcome:

The plane should still be at the bottom part with movement imitating my swipe

 

 

Other information:

Corona SDK release: 2018.3326

Computer OS: Windows 10 64 bit

Simulation views encountered: All devices

 

Notes:

-Let me know if there are statements that are confusing in my post. Apologies as I am not a native English speaker.

-If there are things that I forgot to include, please let me know.

-If this is already solved from other post/sites. Please direct me. Maybe I am using the incorrect keywords

 

Attached Files



[TOPIC: post.html]
#2

XeduR @Spyric

[GLOBAL: userInfoPane.html]
XeduR @Spyric
  • Corona Geek

  • 1,246 posts
  • Corona SDK

You should update to the latest daily build.

Your issue seems to be that you are setting the coordinates for your ship based on the event.x and event.y. This means that the ship will jump wherever you touch.

 

You'll get the correct movement if you use delta x and y (i.e. the measure of how far the touch event has moved) and add those to the ship's original coordinates, i.e.

local function f_planeTouchEvent( im_event )
	if ( im_event.phase == "began" ) then

		--Lets the program focus on the touched object
		display.getCurrentStage():setFocus( im_event.target, im_event.id)
		im_event.target.isFocus = true

		--Store the original X and Y values of touched object
		im_event.target.markX = im_event.target.x
		im_event.target.markY = im_event.target.y

	elseif ( im_event.phase == "moved" ) then	--Object was moved/dragged
		
		if ( im_event.target.isFocus ) then
		
			im_event.target.x = im_event.target.markX + event.xDelta
			im_event.target.y = im_event.target.markY + event.yDelta
		
		end
        else
            display.getCurrentStage():setFocus( im_event.target, nil )
            im_event.target.isFocus = false

	end
end

Seems like xDelta and yDelta are undocumented atm. These would be easy to calculate manually too.

 

I also added a few extra steps to the bottom of the function since you need to release focus and set isFocus to false once you are done to prevent bugs.


  • sporkfin and pixec like this

[TOPIC: post.html]
#3

sporkfin

[GLOBAL: userInfoPane.html]
sporkfin
  • Contributor

  • 809 posts
  • Corona SDK

Ah yes, I forget that xDelta and yDelta were added unofficially and I'm still calculating delta manually everywhere.  I think someone from the community add this feature?



[TOPIC: post.html]
#4

XeduR @Spyric

[GLOBAL: userInfoPane.html]
XeduR @Spyric
  • Corona Geek

  • 1,246 posts
  • Corona SDK

I already made a pull request to update the docs, and yes, it was someone from the community but I can't remember who.



[TOPIC: post.html]
#5

Nel Capati

[GLOBAL: userInfoPane.html]
Nel Capati
  • Observer

  • 2 posts
  • Corona SDK

Hi XeduR @Spyric

 

Thank you for the response, I appreciate it.

 

I'll share my results but first, I would like to ask how to update my Corona SDK as you mentioned? I tried re-downloading from Corona SDK home page but same build number as to what I posted. I also tried checking all the possible links and options in the toolbar in the Corona SDK welcome screen but no update link also.

 

Regarding the issue:

 

Summary response:

i used this < link > and solved my issue 

 

Detailed trial and error

I tried to update the code following your recommendations. I assumed that the formula for x and y Delta are below (since I am receiving errors. I forgot to take note :( )

( event.x - event.xStart )
( event.y - event.yStart )

However, the movement is not fluid and it seems that the plane / ship moves farther than expected. Attached image shows my touch movement (green) and the plane / ship movement (red)

 

I included the below code. Without this, the plane / ship will sometimes go out of screen (due to above statement)

if 	( ld_s_plane.x <= 0 ) then	--X values							
				
	ld_s_plane.x = 0
	ld_s_plane.markX = ld_s_plane.x
			
elseif 	( ld_s_plane.x >= display.contentWidth ) then		
		
	ld_s_plane.x = display.contentWidth
	ld_s_plane.markX = ld_s_plane.x
			
else
	ld_s_plane.markX = ld_s_plane.x				
		
end
			
if 	( ld_s_plane.y <= 0 ) 	then --Y values 
		
	ld_s_plane.y = 0
	ld_s_plane.markY = ld_s_plane.y
			
elseif 	( ld_s_plane.y >= display.contentHeight ) then
		
	ld_s_plane.y = display.contentHeight
	ld_s_plane.markY = ld_s_plane.y
			
else	

	ld_s_plane.markY = ld_s_plane.y
		
end

I also attached the X and Y values during the run using print command. Below is the formula that I am using

ld_s_plane.x = ld_s_plane.markX + event.x - event.xStart
ld_s_plane.y = ld_s_plane.markY + event.y - event.yStart

Currently I don't have good knowledge on how to interpret these numbers. But what I think is that, the event.xStart causes the computation to be incorrect, since it is constant on the point where I initially touched.

 

I tried doing some research again and found this < link > . I tried following the code provided at the bottom and it solved my issue. I just need to include some restrictions since the given code lets the plane / ship to go out of screen.

 

 

 

 

 

Attached Files



[TOPIC: post.html]
#6

XeduR @Spyric

[GLOBAL: userInfoPane.html]
XeduR @Spyric
  • Corona Geek

  • 1,246 posts
  • Corona SDK

The daily builds can be found via the button at the top of these forums (https://developer.coronalabs.com/downloads/daily-builds/).

 

event.xStart is the x value for where the touch event started. You wouldn't need the equations for how to calculate the deltas, you can just copy them from my sample code above as they are automatically calculated by Corona. I just remembered that halfway through writing my post, which is why post is written as it is.

 

Now, my code was written with the expectation that you were actually holding down the touching the ship and trying to move it. If you want to touch the background and move the ship via dragging it, then you'd need to change the values for im_event.target.markX and im_event.target.x accordingly. Also, the safest way to set bounds for the movement is to simply check if the ship is at a certain x or y coordinate, then you don't move it anymore, and if it somehow gets past it, you move it back to the max coordinates.




[topic_controls]
[/topic_controls]