Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Help Controlling Joystick keeping center circle innerly bounded to larger circle

edited July 2014 in General Posts: 134

Hello friends! My name is Kirk and I've been dabbling in Codea for about a month now and to be honest, I'm not very good...but that's just one of those things that takes time and patience and in another 2 months I'll be Luing like a champ.

in the mean time, I have an idea for a physicsy game in which the person controls a swordsman (bladerMan) who uses his blade to slay monsters, deflect lasers and who knows what'll be an arena game in that there's one boxed in stadium that the bladerMan is trapped in and stuff just keeps on coming, progressively getting more and more difficult.

I've started, modeling off the physicsLab tutorial in Codea, but my skills are lacking and I'm asking if anyone who has a fair amound of free time and a good amount of experience would be willing to mentor/work with me on this game idea :) this will be a learning experience and a little bit of puzzle solving fun with coding :-)

Thank you very much


  • dave1707dave1707 Mod
    Posts: 8,725

    @Invad3rZIM You're off to a good start. As far as looking for someone with free time and experience who is willing to mentor/work with you, you're in the right forum. There are a lot of people here that fit that description. All you need to do is keep working on your code and when you get stuck or need advice, just ask because everyone is here to help. One suggestion, try not to start a new discussion for the same subject. This discussion could have been continued in your other discussion on your game.

  • Posts: 134

    How would I handle touches on the screen so that the first touch would activate event sequence 1 and the second would active event sequence 2?

  • dave1707dave1707 Mod
    Posts: 8,725

    @Invad3rZIM See the example code I have in the discussion below. It shows how to keep different screen touches separate.
  • dave1707dave1707 Mod
    edited July 2014 Posts: 8,725

    @Invad3rZIM How are the touches done. Does touch 1 start then end before touch 2 starts or does touch 1 start, then touch 2 starts before touch 1 ends.

  • Posts: 134

    Well it's going to be a double virtual joystick type thing. If you hold your thumb/finger on the right part of the screen, a virtual joystick (smaller circle that's bounded into a larger circle appears under your thumb. By then moving your finger up the smaller circle will follow and an object will move at a speed relative to the circle inside the larger limit circle. The same will happen with the right part of the screen. However there are 2 objects (a red object and a blue object for now) the red object is controlled by the right dpad-joystick an the blue one is controlled by the left. Additionally if you simply tap the screen on either side, the blue object will accelerate 30 pixels /1 second then decelerate back to normal speed. That's my final product, over simplified for the purpose of this disambiguation would you go about doing this?

  • dave1707dave1707 Mod
    Posts: 8,725

    @Invad3rZIM Try this example. Each finger on the screen controls a different sprite with a separate joystick.

    displayMode(FULLSCREEN) function setup() stab={ readImage("Planet Cute:Character Boy"), readImage("Planet Cute:Character Cat Girl"), readImage("Planet Cute:Character Pink Girl"), readImage("Planet Cute:Character Princess Girl"), readImage("Planet Cute:Character Horn Girl") } rm=-1 js={} end function draw() background(40, 40, 50) fill(255) for a,b in pairs(js) do b:draw(a) end end function touched(t) if t.state==BEGAN then aa=0 for a,b in pairs(js) do if then aa=1 break end end if aa==0 then table.insert(js,jst(t.x,t.y, end elseif t.state==MOVING or t.state==ENDED then for a,b in pairs(js) do b:touched(t) end end end jst=class() function jst:init(cx,cy,id) self.dx=0 self.dy=0 end function jst:draw(a) fill(255) if>0 then fill(255) ellipse(,,8) -- draw circle center noFill() stroke(255) strokeWidth(4) ellipse(,,200) -- draw outer circle end sprite(stab[a%5+1],, end function jst:touched(t) if t.state==MOVING then if then self.dx=( self.dy=( end end if t.state==ENDED then if then self.dx=0 self.dy=0 end end end
  • edited July 2014 Posts: 134

    Okay so I dissected your example code Dave (thank you for that) and I fully understand how multi-touch sensors work but I after 2 hours of test programming, I have 2 follow up questions:

    (And here's my code if you'd like to copy it and run to get a better idea..I started fiddling with a circle and using joysticks to modify with it's vector properties...

    -- MyTouches
    -- Use this function to perform your initial setup
    function setup()
        ball = physics.body(CIRCLE,45)
        ball.x = WIDTH/2
        ball.y = HEIGHT/2
        ball.g =170
        w1= physics.body(EDGE, vec2(0,0),vec2(WIDTH,0))
        w2 = physics.body(EDGE,vec2(WIDTH,0),vec2(WIDTH,HEIGHT))
    -- This function gets called once every frame
    function draw()
        -- This sets a dark background color 
        background(40, 40, 50)
        -- This sets the line thickness
        for key, value in pairs(touches) do
        -- Do your drawing here
        fill(ball.r, ball.g, math.random(150,255), 255)
        if ball.r > 255 then ball.r=255 end --sets limits on the color values
        if ball.r<0 then ball.r=0 end
        if ball.g > 255 then ball.g = 255 end
        if ball.g < 0 then ball.g = 0 end
    function touched(t)
     --   table.insert(touches, addTouch(,t.x,t.y) )
        if(t.state == BEGAN) then
            aa = 0--controller to see if the touch is already created
            for key, value in pairs(touches) do
              if( == 0) then
                    value.x = t.x
                    value.y = t.y
                    print("  "..value.x)--debug print
            if(aa==0) then
        else if(t.state == MOVING or t.state == ENDED) then
                for key, value in pairs(touches)do
    addTouch =class()
    function addTouch:init(id,x,y)
        self.x = x
        self.y = y
        self.count = count
        count = count + 1
        self.color = color(math.random(100,255), math.random(100,255),math.random(100,255)) = id
    function addTouch:touched(t)
        if(t.state == MOVING) then
            if( == then
                self.dx = (t.x)--/200
                self.dy = (t.y)--/200
                if(self.count==2)then--xval for second joystick controls r val, y =g val
                    ball.r = ball.r + (self.dx-self.x)/10
        if(t.state == ENDED) then
            if( == then
                self.x =0
    function addTouch:draw()
      if > 0 then
    1. When I'm not moving the joystick continuously, the force in the ball stops accelerating and the ball eventually crashes due to gravity. How can I make it so that just by holding the circle passively it will register as an active touch?
    2. How can I bind the moving circle joystick so that the It can not exit the larger circle?

    Thank you for all your help!

  • dave1707dave1707 Mod
    Posts: 8,725

    @Invad3rZIM For question 1, you're going to have to move the applyForce out of the touched function and into the draw function. In the touched function, calculate the force like you are when moving the joystick and move that value into another variable, then apply that force in draw so that when you're not moving the joystick, you're still applying the last force in the draw routine. For question 2, you'll have to calculate the distance between where you're touching and the center of the joystick based on the equation of a circle. If the distance is greater than 100 then limit it to 100.

  • dave1707dave1707 Mod
    edited July 2014 Posts: 8,725

    @Invad3rZIM Just in case you want an example for your question 2, this limits the smaller circle to the size of the larger one.

    EDIT: corrected an error

    displayMode(FULLSCREEN) function setup() cx,cy=0,0 v1=vec2(0,0) end function draw() background(40, 40, 50) noFill() if cx+cy>0 then stroke(255) strokeWidth(2) ellipse(cx,cy,200) -- large circle 200 pixels in diameter ellipse(v1.x+cx,v1.y+cy,25) -- small circle end end function touched(t) if t.state==BEGAN then -- center of circle cx=t.x cy=t.y end if t.state==MOVING then -- direction to move and limit direction v1=vec2(cx,cy) d=v1:dist(vec2(t.x,t.y)) -- distance, center to touch point v1=vec2(t.x-cx,t.y-cy) v1=v1:normalize()*math.min(d,100) -- limit distance to 100 pixels end if t.state==ENDED then -- clear values cx,cy=0,0 end end
Sign In or Register to comment.