Analogue Joystick - Sample Code WIP

Games
#1

Hey Guys

Im working on an Analogue Joystick, for use with the game edition most probably. I will post the finished item in the Sample Code area but I though I would get your feedback first.

This v1.0 demo shows it working with a quick top down scrolling shooter style game I mocked up to get visual feedback on the output of the control.

Get it here http://www.alienhorde.com/files/joystick_1_0.zip

Ignore the plane.lua / background.lua / sprite.lua / main.lua, the code we are looking at is in joystick.lua

Its my aim that you include the joystick file

local joystick = require( "joystick" )

You initialise the joystick, passing it 2 files for the outer and inner joystick elements, alpha and position

joystick.loadJoystick( "joystickOuter.png", 0.75 , "joystickInner.png", 0.75 , 15 , 345 )

The code will then setup the joystick and all other elements ( I still need to include a stop / start and a reorientation for landscape)

You can then, from anywhere in the code, in main.lua or any other included files query the following

joyVector ( returns 0 to 1 )
joyAngle ( returns full 360 degrees, 0 pointing up and degrees increasing clockwise )
joyX ( -1 to 1 )
joyY ( -1 to 1 )

Each attribute returns false when the joystick is not in use.

I have left a “Ghost” on the screen that will follow the touch, I track the touch past the boundaries of the outer joystick market but I limit the values to 1 at the marker limit. This just allows the user to retain control even if they accidentally drag outside of the joystick.

The joystick currently points to where the touch currently is, this wont be in the final release and it just for testing of orientations.

[import]uid: 5354 topic_id: 1632 reply_id: 301632[/import]

#2

Excellent Work! [import]uid: 7664 topic_id: 1632 reply_id: 4748[/import]

#3

Ive updated the graphics with my own rendered sprites now.

Im going to include a digital joystick as well, thats the next step.

If anyone notices any bad coding habits, as im still relatively new to lua, please let me know! [import]uid: 5354 topic_id: 1632 reply_id: 4752[/import]

#4

Thanks man for sharing. Could you add support for multiple buttons please? [import]uid: 5712 topic_id: 1632 reply_id: 4773[/import]

#5

Do you mean multitouch or multiple analogue sticks? [import]uid: 5354 topic_id: 1632 reply_id: 4774[/import]

#6

Hi Matthew,

I would need an analog joystick and 3 buttons. Shoot, Shield and Options. When I port my Game CometCrusher to Corona, your code will be very welcomed.

But having the ability to use two analog/digital joysticks would also be great for future projects.

Thanks again for sharing this with us.

Best wishes
Michael Hartlef

http://www.whiteskygames.com
http://www.twitter.com/mhartlef [import]uid: 5712 topic_id: 1632 reply_id: 4775[/import]

#7

Hey Mike

I will make the final version work like the ui,lua where you can have multiple controls.

It will also work with multitouch (would otherwise be useless)

I will also have it setup a standard digital joypad for those who require that.

Matt [import]uid: 5354 topic_id: 1632 reply_id: 4776[/import]

#8

One I thing I noticed is that when the joystick returns to the center it communicates the x, y, vector and angle for the return trip, this is problematic when using the joystick to control a targeting system. Is there a way to disable the joystick from returning that information when it is bouncing back to the start position? [import]uid: 7664 topic_id: 1632 reply_id: 4779[/import]

#9

I will have it set everything to false when the user lifts their finger [import]uid: 5354 topic_id: 1632 reply_id: 4781[/import]

#10

Awesome Matthew! [import]uid: 5712 topic_id: 1632 reply_id: 4782[/import]

#11

One more request. I think it would be of value to allow the alpha of the touch ghost to be set in the joystick constructor
[import]uid: 7664 topic_id: 1632 reply_id: 4783[/import]

#12

Hey Runseld

The touch ghost will be removed from the final build, do you think I should leave it as an option so you guys can use it as a test?

If you want me to look at how the joystick is interacting with your code feel free to email me a sample matt@mattpringle.co.uk

I will try to get it updated tonight and a newer featured build should be out on the weekend

Matt [import]uid: 5354 topic_id: 1632 reply_id: 4788[/import]

#13

I do think you should leave it as an option. I actually like the touch ghost, but I would like to be able to disable it and set the alpha. I do want to say again how excited I was to see this project. I have been able to integrate it without issue. I think you have done a great job on the joystick. [import]uid: 7664 topic_id: 1632 reply_id: 4796[/import]

#14

Thanks Runseld for the support

Ive not been able to replicate the values of the return trip of the joystick as you described. The output from the touch event looks like this

0.028571428571429 90 0.028571428571429 -1.7494954273534e-18  
0.2 90 0.2 -1.2246467991474e-17  
0.45714285714286 90 0.45714285714286 -2.7991926837654e-17  
0.77142857142857 90 0.77142857142857 -4.7236376538541e-17  
1 90 1 -6.1232339957368e-17  
1 90 1 -6.1232339957368e-17  
1 90 1 -6.1232339957368e-17  
1 90 1 -6.1232339957368e-17  
1 90 1 -6.1232339957368e-17  
1 90 1 -6.1232339957368e-17  
1 90 1 -6.1232339957368e-17  
1 90 1 -6.1232339957368e-17  
false false false false

and the code seems to me like it isnt communicating the final values on the end event, it sets everything to false

if "moved" == phase then this.x = event.x - this.x0 this.y = event.y - this.y0 calculateJoystick( this ) positionJoystickInner() elseif "ended" == phase or "cancelled" == phase then display.getCurrentStage():setFocus( this , nil ) this.isFocus = false this.x = joyCentreX this.y = joyCentreY joyVector = false joyAngle = false joyX = false joyY = false positionJoystickInner() end

are you checking for false like in the plane example?

for instance you should ensure your code does something for both 0,0 of the joystick and false,false as they are the same value in reality. One tells you the joystick is passing through 0,0 and the other tells you the joystick is neutral. For both instances your code should perform the same function, you may need to check for false internally in the function and then convert it locally back to 0 so as not to cause any errors in mathematical calculations [import]uid: 5354 topic_id: 1632 reply_id: 4797[/import]

#15

the error only occurred when the object controlled by the joystick reached a defined barrier, in this case the edge of the screen, but the error was more in my handling of the border than your code as I too cannot recreate it. Sorry for the mistake [import]uid: 7664 topic_id: 1632 reply_id: 4798[/import]

#16

Hi matthew,

Please leave the ghost in as optional.

Michael

[import]uid: 5712 topic_id: 1632 reply_id: 4815[/import]

#17

I am doing Mike.

It’s come a long way in past couple of days. The setup is quite different now to allow for multiple joysticks at the same time.

I’ve also got it with a zero configuration option where if you don’t provide texture maps it will draw a circle instead.

Will prob do a big release this weekend. Hopefully I can get ansca to include the file in their sampleCode folder so everyone can use it [import]uid: 5354 topic_id: 1632 reply_id: 4822[/import]

#18

Great sample code !

Thanks for sharing. Very nice graphics and game play. V well done.

Carlos [import]uid: 24 topic_id: 1632 reply_id: 4836[/import]

#19

This is awesome! We’ve been passing it around the office for days! [import]uid: 3007 topic_id: 1632 reply_id: 4862[/import]

#20

Thanks Guys

Its nearly finished now, its been rewritten to resemble the ui.lua button class. I will upload this weekend. It will be Beta 6+ as it needs multitouch and event.id (new and added for multitouch support)

Features Include:

Zero Config Mode
You dont need any images or to provide any attributes. Corona will create a joystick from 2 vector circles and place near the bottom left of the screen. This should be used when you want a quick setup to a new project / you are experimenting and need an easy way of adding user input.

Multitouch Support
Works alongside other buttons you may have created with full Corona based multitouch support (Beta 6+)

Multiple Joysticks
You can now, same as buttons, have as many joysticks as you want on screen at once working independently with multitouch support. Much like a Playstation 2 Control Pad with the 2 analogue control sticks

Any Size / Position
The size of the joystick is defined by the size of the outer image and you can position or transition the full joystick group like any other object.

User Defined Images & Alphas
You can add an image for the stick, the outer joystick and a background and set the alpha of each image separately

Stop / Start
You can pause the joystick so it no longer performs any position based calculations and does not respond to user interaction.

Ghost
Each joystick will draw a ghost image to show you where the current touch is on the screen (optional)

Special Effects
The joystick will fade in when touched and fade out after a few seconds once the user is not interacting with it anymore. It will fade to the initial alpha you provide on setup.

Fully Editable
You can apply any of Coronas styling options to any of the joystick components overriding the default setup
i.e. myJoystick.joystickTouch:setFillColor( 255 , 255 , 255 , 100 ) will change the colour of the ghost

So I just need to clean up the code, do a bit of bug testing, write a few examples and then it will be ready for production!

Im thinking for my next project I might build a tile based engine which uses a sprite sheet to draw a seamless world which would be an extension of the background drawing function used in the current example.

I would see this being used for overhead racing games and the like, it all depends on how fast Corona can swap out textures but as the sprite sheet would be already loaded I think this would work well. [import]uid: 5354 topic_id: 1632 reply_id: 4869[/import]