Difference between revisions of "Article Tutorials/Touch Input and Mouse Input"

From GiderosMobile
(Created page with "== Touch Input and Mouse Input == === Touch Input === You will no doubt want people to tap a Start Button to get the game going from your title screen. Here’s how to set up...")
 
 
(One intermediate revision by the same user not shown)
Line 1: Line 1:
 +
__TOC__
 
== Touch Input and Mouse Input ==
 
== Touch Input and Mouse Input ==
  
 
=== Touch Input ===
 
=== Touch Input ===
You will no doubt want people to tap a Start Button to get the game going from your title screen. Here’s how to set up a button. This example will print the co-ordinates where the player taps the button.<br><br>
+
You will no doubt want people to tap a Start Button to get the game going from your title screen. Here’s how to set up a button. This example will print the co-ordinates where the player taps the button.
 
 
 
<syntaxhighlight lang="lua">
 
<syntaxhighlight lang="lua">
 
local yinyang = Sprite.new()
 
local yinyang = Sprite.new()
Line 21: Line 21:
  
 
stage:addChild(yinyang)
 
stage:addChild(yinyang)
</syntaxhighlight><br>
+
</syntaxhighlight>
  
When you run this code, you will see the usual image on the screen. Click on it with your mouse in the Player. You will see the co-ordinates of where you clicked on the image displayed in the console Output area of Gideros Studio.<br>
+
When you run this code, you will see the usual image on the screen. Click on it with your mouse in the Player. You will see the co-ordinates of where you clicked on the image displayed in the console Output area of Gideros Studio.
The other events are: TOUCHES_BEGIN, TOUCHES_MOVE and TOUCHES_CANCEL.<br><br>
+
 
 +
The other events are: TOUCHES_BEGIN, TOUCHES_MOVE and TOUCHES_CANCEL.
  
 
=== Mouse Input ===
 
=== Mouse Input ===
 
+
Handling Mouse Input is pretty much the same as Touch Input, however you don’t use the ‘touch’ handler nor event information. The code for Mouse Input is below.
Handling Mouse Input is pretty much the same as Touch Input, however you don’t use the ‘touch’ handler nor event information. The code for Mouse Input is below.<br>
 
 
 
 
<syntaxhighlight lang="lua">
 
<syntaxhighlight lang="lua">
 
local yinyang = Sprite.new()
 
local yinyang = Sprite.new()
Line 46: Line 45:
  
 
stage:addChild(yinyang)
 
stage:addChild(yinyang)
</syntaxhighlight><br>
+
</syntaxhighlight>
  
 
You should check for when the mouse button is UP on your object as the player may change their mind and move the mouse away so as to not activate the button. This is more common on iOS and you will want to use Event.TOUCHES_END if programming with touches for mobile devices.
 
You should check for when the mouse button is UP on your object as the player may change their mind and move the mouse away so as to not activate the button. This is more common on iOS and you will want to use Event.TOUCHES_END if programming with touches for mobile devices.
  
The other Mouse options are: MOUSE_DOWN and MOUSE_MOVE.<br><br>
+
The other Mouse options are: MOUSE_DOWN and MOUSE_MOVE.
 +
 
 +
You can download the yinyang image from here: [[:File:Yinyang.png]]
 +
 
  
You can download the yinyang image from here: [[:File:Yinyang.png]]<br>
+
'''Note: This tutorial was written by [http://bluebilby.com/author/waulokadmin/ Jason Oakley] and was originally available Here: http://bluebilby.com/2013/04/26/gideros-mobile-tutorial-touch-input-and-mouse-input/'''
  
  
'''Note:''' This tutorial was written by [http://bluebilby.com/author/waulokadmin/ Jason Oakley] and was originally available Here: http://bluebilby.com/2013/04/26/gideros-mobile-tutorial-touch-input-and-mouse-input/.
+
'''[[Written Tutorials]]'''
 +
{{GIDEROS IMPORTANT LINKS}}

Latest revision as of 10:20, 26 August 2024

Touch Input and Mouse Input

Touch Input

You will no doubt want people to tap a Start Button to get the game going from your title screen. Here’s how to set up a button. This example will print the co-ordinates where the player taps the button.

local yinyang = Sprite.new()
local yinyangimg = Bitmap.new(Texture.new("images/yinyang.png"))
yinyang:addChild(yinyangimg)

local function imagetouch(button, event)
    if button:hitTestPoint(event.touch.x, event.touch.y) then
        local x = event.touch.x
        local y = event.touch.y
        print("touched: X=" .. x .. " Y=" .. y)
    end
end

yinyang:setPosition(100,200)
yinyang:addEventListener(Event.TOUCHES_END, imagetouch, yinyang)

stage:addChild(yinyang)

When you run this code, you will see the usual image on the screen. Click on it with your mouse in the Player. You will see the co-ordinates of where you clicked on the image displayed in the console Output area of Gideros Studio.

The other events are: TOUCHES_BEGIN, TOUCHES_MOVE and TOUCHES_CANCEL.

Mouse Input

Handling Mouse Input is pretty much the same as Touch Input, however you don’t use the ‘touch’ handler nor event information. The code for Mouse Input is below.

local yinyang = Sprite.new()
local yinyangimg = Bitmap.new(Texture.new("images/yinyang.png"))
yinyang:addChild(yinyangimg)
local function imagetouch(button, event)
    if button:hitTestPoint(event.x, event.y) then
        local x = event.x
        local y = event.y
        print("clicked: X=" .. x .. " Y=" .. y)
    end
end

yinyang:setPosition(100,200)
yinyang:addEventListener(Event.MOUSE_UP, imagetouch, yinyang)

stage:addChild(yinyang)

You should check for when the mouse button is UP on your object as the player may change their mind and move the mouse away so as to not activate the button. This is more common on iOS and you will want to use Event.TOUCHES_END if programming with touches for mobile devices.

The other Mouse options are: MOUSE_DOWN and MOUSE_MOVE.

You can download the yinyang image from here: File:Yinyang.png


Note: This tutorial was written by Jason Oakley and was originally available Here: http://bluebilby.com/2013/04/26/gideros-mobile-tutorial-touch-input-and-mouse-input/


Written Tutorials