Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

line and touch
Started by luantiang Nov 21 2018 10:28 PM

- - - - -
6 replies to this topic
line touch

Best Answer ldurniat , 22 November 2018 - 01:49 PM

Hi @luantiang,

 

From documentation

 

Currently, display.newLine() objects do not support touch/tap events.

 

See display.newLine() for more information.

 

Use rectangle instead as @XeduR @Spyric suggest.

 

 

Have a nice day:)

 

ldurniat

[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

luantiang

[GLOBAL: userInfoPane.html]
luantiang
  • Enthusiast

  • 35 posts
  • Corona SDK

Hello all,

 

Can "touch" function work on "line" display object (aka "display.newLine()" )? Please see the stripped down code (for troubleshooting) below. I am not sure if I have missed out anything, but there is no "print" on the Corona Simulator's console, no matter, how much I tried "to touch" on the "line.

-- text display object 
local text = display.newText( "text", 20, 20 )

-- table touch listener function
-- stripped down for troubleshooting 
local function touch( self, event )
	print( event.phase, event.target.id, self.id )
	text.text = tostring( event.phase ) .. " | " .. tostring( self.id )
	
	if event.phase == "began" then
		print( event.phase, event.target.id, self.id )

	elseif event.phase == "moved" then 
		print( event.phase, event.target.id, self.id )
			
	elseif event.phase == "ended" then
		print( event.phase, event.target.id, self.id )
		
	end 
	return true
end

-- create new line display object and attach listener 
local line = display.newLine( 50, 50, 300, 300 )
line.strokeWidth = 50
line.touch = touch 
line.id = "line03"
line:addEventListener( "touch" )	

Any suggestion or alternative solution? I need the ability to touch the line, in order to show additional information on the line itself.

 

Please help to advise. Thanks.

Regards, Luan

 

 



[TOPIC: post.html]
#2

nick_sherman

[GLOBAL: userInfoPane.html]
nick_sherman
  • Corona Geek

  • 1,780 posts
  • Corona SDK

You forgot to add the function that will be called.

line:addEventListener("touch",touch)

[TOPIC: post.html]
#3

XeduR @Spyric

[GLOBAL: userInfoPane.html]
XeduR @Spyric
  • Contributor

  • 716 posts
  • Corona SDK

For the touch event listener, you'd need to write it as "line:addEventListener("touch",line)". You already tell what function should run in the case of touch with "line.touch = touch".
 

Secondly, the main reason as to why this won't work is because you are working with display.newLine. You can't realistically touch a line and I think that Corona ignores touch events on lines, even if you add stroke width of 50 to them. If you change that display.newLine to display.newRect, you'll manage to touch it (including the stroke area).

 



[TOPIC: post.html]
#4

ldurniat

[GLOBAL: userInfoPane.html]
ldurniat
  • Contributor

  • 389 posts
  • Corona SDK

  Best Answer

Hi @luantiang,

 

From documentation

 

Currently, display.newLine() objects do not support touch/tap events.

 

See display.newLine() for more information.

 

Use rectangle instead as @XeduR @Spyric suggest.

 

 

Have a nice day:)

 

ldurniat



[TOPIC: post.html]
#5

luantiang

[GLOBAL: userInfoPane.html]
luantiang
  • Enthusiast

  • 35 posts
  • Corona SDK

Hello all,

 

Many thanks for your prompt response. For all the documentation I have gone through on this, I had certainly missed the most important one, as highlighted by ldurniat.

 

https://docs.coronalabs.com/api/library/display/newLine.html

 

However, a display.newRect() cannot replace display.newLine() in what I am trying to do. Please see below attached diagram. This is dynamically generated from a a subset (depending on query) of a database. The nodes show the entities and the links (represented by lines connected to two nodes) show the relation between the entities.

 

I wanted to "touch" on a link (or line) to show the relation and other actions (that can be performed) on the relation. I do not want to show all the relations, as they are likely to clutter the entire screen, when there are a high number of nodes (represented by circle). A node, however, can have more than one links with more than one other node, in a more complex relationship. Further, I wanted to "touch" a node to move it, to show other data on the entity, and other actions (that can be performed) on the entity.

 

Since display.newLine() display object currently does NOT support touch/tap events, I suppose I would have to explore other workaround.

 

In any case, many thanks for your help and suggestions.

Regards, Luan

 

 

 

 

 

Attached Thumbnails

  • ScreenShot.png


[TOPIC: post.html]
#6

XeduR @Spyric

[GLOBAL: userInfoPane.html]
XeduR @Spyric
  • Contributor

  • 716 posts
  • Corona SDK

So pointing all of the issues and fixes wasn't a good enough answer :D

Now, you are wrong about not being able to use rectangles since lines with a width equal to or larger than 1 pixel are really just rectangles.

You can turn lines into rectangles in Corona by simply:
1) Calculating the distance between a line's point A and point B. It's as simple as distanceX = x1 - x2 and distanceY = y1 - y2. Then you use Pythagoras theorem. The width of the rectangle is the same as the distance.
2) The height of the rectangle is the same as the stroke width you apply to your line.
3) The x and y coordinates of the rectangle are the average of x1+x2 and y1+y2.
4) The rotation of the rectangle is the angle between a line's point A and point B. Use https://docs.coronalabs.com/api/library/math/atan2.html to solve it.

That's it. 

Now, based on your image, any user would have difficulty touching lines as thin as those if they didn't have a mouse. To mitigate this, you could create (additional) invisible rects that are larger than the lines to act as touch sensors for the lines, so that users can touch them with ease. 



[TOPIC: post.html]
#7

luantiang

[GLOBAL: userInfoPane.html]
luantiang
  • Enthusiast

  • 35 posts
  • Corona SDK

Hello XeduR,

 

Noted. This could be one of the possible workarounds.

 

Thank you again.

Regards, Luan




[topic_controls]
[/topic_controls]