Feb 142011
 

This tutorial will show you how to set up a D-pad in your iPhone application. The idea is to use the arrows to control your hero.

Dpad iphone

PASTE the below code into your main.lua file, or if you are using director, into the appropriate file. (Eg, “game.lua”.)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
display.setStatusBar (display.HiddenStatusBar)
-- Hides the status bar

local background = display.newImage ("background.png")
-- Sets the background

local peach = display.newImage ("peach.png")
peach.x = 240
peach.y = 160
-- Puts the usual picture of me into the app and positions it

----------------------------------------------------------------------
local up = display.newImage ("upx.png")
up.x = 70
up.y = 230

local down = display.newImage ("downx.png")
down.x = 70
down.y = 290

local left = display.newImage ("leftx.png")
left.x = 30
left.y = 260

local right = display.newImage ("rightx.png")
right.x = 110
right.y = 260

-- Puts in all four movement arrow images and positions them
----------------------------------------------------------------------

local motionx = 0
local motiony = 0
local speed = 10
-- Speed can be adjusted here to easily change how fast my picture moves. Very convenient!

local function stop (event)
if event.phase =="ended" then

motionx = 0
motiony = 0
end
end

Runtime:addEventListener("touch", stop )
-- When no arrow is pushed, this will stop me from moving.

local function movepeach (event)
peach.x = peach.x + motionx
peach.y = peach.y + motiony
end

Runtime:addEventListener("enterFrame", movepeach)
-- When an arrow is pushed, this will make me move.

function up:touch()
motionx = 0
motiony = -speed
end
up:addEventListener("touch", up)

function down:touch()
motionx = 0
motiony = speed
end
down:addEventListener("touch", down)

function left:touch()
motionx = -speed
motiony = 0
end
left:addEventListener("touch",left)

function right:touch()
motionx = speed
motiony = 0
end
right:addEventListener("touch",right)

-- The above four functions are stating the arrows should all listen for touches and defining
-- the way I should move based on each touch.

local function wrap (event)

if peach.x < 50 then
peach.x = 50
end
----
if peach.x > 430 then
peach.x = 430
end
----
if peach.y > 270 then
peach.y = 270
end
----
if peach.y < 50 then
peach.y = 50
end
----
if speed < 0 then
speed = 0
end
end

Runtime:addEventListener("enterFrame", wrap)

-- This will keep me from going off the sides of the screen. It's not actually a wrap, that would
-- involve me disappearing and popping back on the opposite side, but I'm in the habbit of calling
-- whatever function I use to keep the main "hero" on screen "wrap", and I doubt that will change any
-- time soon.

DOWNLOAD THE PROJECT HERE

Naturally, you will want to replace the images with your own, (mine all end in “x” for the arrows as I was experimenting with multiple sets,) and possibly change the orientation as well, depending on your needs.

I hope that this will be of use, it’s been requested a few times by different people and although I’m not really meant to be working at the moment I needed to spend some time out of bed and at a desk, even if only briefly. (I’ve been bored a lot of the time and using an iPad lying down makes my arms tired eventually, lol.)
Peach Pellen :)

PS - If this tutorial helped you, please feel free to throw some money at me, and if you haven’t done so yet consider registering for the Techority 48 Hour Challenge - entries close in just under 2 weeks!

Like this post? Subscribe to the monthly newsletter!

 

  29 Responses to “Controlling A Character With A D-Pad”

  1. I know I’m late to reply to this but if you post in the forum I will help you with your code ;)

  2. Thanks for the link, but I couldn’t get it to work lol, I’m too noob :(

  3. I tired to find in forum but couldn’t get it, can you show me? thanks.

  4. Hey,

    You’d just add *2 after speed in the function tied to the button. Keeping track of touches there is code for on the forum :)

  5. Hi Peach,

    Thanks for the tutorials, how if i wanna do single-touch *1 speed, double-touch *2 speed to move faster at any direction?

    Thank you.

  6. tankyou pellen you is the best.. your tutor is the best GBU

  7. This D-Pad just allows only 1 button work?
    How can I add a “fire” button on the right of the screen? The purpose is that a character is moving and press another button to jump

  8. Excellent tutorial and project file!

    Within an hour of opening it (first time using Corona) I worked out how to implement diagonal controls by editing the provided code (this would’ve taken me weeks otherwise)

    I’ve also purchased your Package#2 so I’m going to try adding some invisible diagonal controls to your Side Scrolling Shooter template next

    Thanks for creating a great learning resource :)

    • Thank you :)

      I’m glad that both my tutorial and of course the ease of Corona have been good for you :D It’s exciting learning to make apps, I think.

      Thanks very much for your business as well – always appreciate people buying my templates.

      Peach :)

  9. First of all… Peach**

    Second, I figured it out. I just made some walls, thanks

    • I’m glad you figured it out but if you need help with the wrap, let me know if you’re using landscape or portrait and I can tell you what numbers you should be using ;)

      Peach

  10. Hey Peace,

    Thank you so much for this tutorial, it was great. I just ran into some trouble at the end with the wrap. I tried everything I know, every number. my character just keeps going. Any advice? thanks in advance

  11. Hey Vlad,

    Just include the functions for left and right and ignore the ones for up and down.

    You can leave out any reference to Y as well, so no motiony, no peach.y, etc :)

    Make sense?

  12. Hey, Peach!
    I have got a problem, I hope you can help me
    I have got an elemet(dude) , and i’ ve got two buttons (left, right)
    what should i write (code) to move this dude when i press the button?

  13. Hi Jake,

    I actually do provide personal training now, yes – it’s actually aimed at those who are VERY new to Corona as opposed to those who have are a bit further along.

    There’s a link up top in the bar to “Corona Training”, that’s got some details on it.

    Peach :)

  14. Thanks you have been wonderful Peach. Can you do personal training?

  15. The dimensions of the iPad are 768 x 1024

    It’s the same as the iPhone – for y do the height and for x do the width.

    EG if it is portrait you’ll likely wrap x on 0 and 768 and then play with it until it looks good to you.

    Same thing exactly, just different numbers.

  16. Also peach Im working on a ipad and not a iphone what should I put for the wrap function?

  17. Yes but it was a simple answer; it requires you to have gravity turned on and your player as a physics body.

    If you don’t it wont come back down. (Although you could add code to do so with a timer; physics is easier IMHO.)

    Peach.

  18. Thanks for getting back to me so fast. That last bit of code will make the player jump using a button?

  19. Hi Jake,

    First, you need to describe the actual problem you’re having; I don’t know if I can help if I don’t know what it is!

    Second, yes;

    1
    transition.to( yourplayername, { time = 1000, y = -100} )

    Put that on a button then have a play with it :)

    Peach

  20. do you know how to make the player jump instead of go up and down?

  21. Hey peach. I am having some trouble controlling the player can you help me?

  22. Good job, thanks for sharing.

  23. Thank you Andre.

    Hopefully in the future; I have so many requested tutorials and am presently not up to doing much, but when I am I’m trying to work through them all in order from most requested to least, but I will add it to my (mental) list.

    Peach :)

  24. Congratulations, excellent tutorial! A version with camera tracking, acceleration and braking (like a racing game) would be awesome!

    Thanks!!!

 Leave a Reply

(required)

(required)

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Notify me of followup comments via e-mail. You can also subscribe without commenting.