JoyStick Question [RESOLVED]

Greetings and happy Halloween!

I’m want to make a “joy stick” of sorts for a touch screen.

You touch the screen to mark the starting pos and then drag in the direction you want the input to be. The bottom bigger circle (first circle) is set where your first touched and then a smaller lighter circle (2nd circle) on top follows you finger but wont go x far from the starting point.

What I cant figure out is how to figure on the precise direction the second circle is from the first. After some thought I realized that you couldn’t use degrees (as in 360 degrees) with the grid system. Then I thought of making a table of 360 points around the pos of the first circle and then just seeing which of the points in the table is closest to the 1st circle’s pos. and then the number (0-360) would be the direction.

But, it is not in my knowledge of a way to use some for lope maybe to create a perfect circle of 360 ish points.

So I turn to the ever so wise community for guidance. Is there some better way to do this? I figured that its possible to write out all 360 points but, I mean, that would take forever and I not sure it would even work or be a circle.

Thank you for your time.

Try searching for joystick above

@Goatboy76 Is this enough to get you started.


displayMode(FULLSCREEN)

function setup()
    cx=400
    cy=200
    x,y=0,0
end

function draw()
    background(40, 40, 50)
    fill(255)
    sprite("Planet Cute:Character Boy",cx,cy)
    if x+y>0 then
        cx=cx+(tx-x)/10
        cy=cy+(ty-y)/10
        fill(255)
        ellipse(x,y,8)    -- draw circle center
        noFill()
        stroke(255)
        strokeWidth(4)
        ellipse(x,y,200)    -- draw outer circle
    end
end

function touched(t)
    if t.state==BEGAN then    -- starting center point
        x=t.x
        y=t.y
        tx=x
        ty=y
    elseif t.state==MOVING then
        tx=t.x
        ty=t.y
    elseif  t.state==ENDED then    -- done moving
        x,y=0,0
    end
end

@Ignatz Found that GitHub software although I cant figure out how to download the file(s).

@dave1017 Cool. Your a ninja. Dont fully understand it yet but thanks. :)>-

If it’s Codea code, just copy and paste. If it’s not Codea code! ignore it.

But several people have posted joystick code in the forum in the past

@dave1707 I don’t think that code fits the spec. In particular “a smaller lighter circle (2nd circle) on top follows you [sic] finger but wont go x far from the starting point.” In your code the second circle doesn’t follow the finger, and there’s no bound on the distance of the second circle to the first.

Here’s some code that does do that. The second circle follows the finger but is constrained to lie inside the first circle.

function setup()
    obj = vec2(WIDTH/2,HEIGHT/2)
    control = {radius = 100,innerRadius = 50}
end

function draw()
    background(40,40,50)
    ellipseMode(RADIUS)
    if control.active then
        obj = obj + (control.touch - control.centre)/50
        fill(177, 121, 42, 255)
        ellipse(control.centre.x,control.centre.y,control.radius)
        fill(78, 140, 48, 255)
        ellipse(control.touch.x,control.touch.y,control.innerRadius)
    end
    sprite("Planet Cute:Tree Tall",obj.x,obj.y)
end

function touched(touch)
    if touch.state == BEGAN then
        control.centre = vec2(touch.x,touch.y)
        control.touch = vec2(touch.x,touch.y)
        control.active = true
    elseif touch.state == MOVING then
        control.touch = vec2(touch.x,touch.y)
        if control.touch:dist(control.centre) > control.radius - control.innerRadius then
            control.touch = control.centre + (control.touch - control.centre):normalize()*(control.radius - control.innerRadius)
        end
    else
        control.active = false
    end
end

@Andrew_Stacey If I remember correctly, someone on the forum made what looked like an actual joystick. Was that you? I just gave him something I had laying around because it sounded like he was trying to code it himself and was getting hung up trying to use degrees. That’s why I said “Is this enough to get you started”. Plus the forum is loaded with joystick examples, some are mine and I’m sure you put several out as well. Do you remember seeing the joystick I’m talking about. The forum search function doesn’t work with my iPad1, so I rely on google, but I didn’t want to take the time to look for it.

@dave1707 The one that I associate with joysticks is Nat. I found his code, via the wiki, on github. I’ve not done a joystick in my various UIs.

I figured that the bit that Goatboy76 was having difficulty with was figuring out the direction of the touch from the centre so thought that actually - for once! - your code might not be enough of a starting point.

@Andrew_Stacey Thanks. Although, the little gap between the two circles does really annoy me.

@Andrew_Stacey is there a way to make the tree move faster with the code you posted?
I’m really new to codea and i’ve been trying to make just that, but for a character that moves at lets say slightly faster than walking speed

@OwneClaxton - easy enough.

adjust this line in draw to multiply by pace

 obj = obj + (control.touch - control.centre)/50 * pace

just adjust the variable pace to be the speed you want (eg 1 for walking, 2 for running)

@Goatboy76 I don’t see a gap between the circles. Could you post a screenshot?

awesome thanks @Ignatz, now i just need to figure out how to make the circles transparent

well im messing around with the colour to figure it out, but i think alpha is oppacity, or am i messing with something i shouldnt be

@OwenClaxton yes alpha = opacity

color(r, g, b, a)

r = red
g = green
b = blue
a = alpha

fully transparant → a = 0
non-transparant → a = 255

i hope this answers your question?

@Andrew_Stacey I could post a screen shot if I knew how :frowning:

But its nothing. I was just talking about how when the joystick is pushed as far as it will go, the smaller circle doesn’t fit with the curve of the larger circle.
~X(

@Goatboy76 Press the power button and the home button at the same time to take a screenshot, it’s added to your photos library.

When someone says something drives them OCD crazy, it’s offensive, as you don’t really have OCD and have no idea what it’s like.

@SkyTheCoder First off, I’m sorry if I offened anyone. As always, sometimes I might accidentally say something that one would take as offensive, but I never mean it and I’m sorry.

Secondly, I’m no doctor but I can assume there are verying degrees of OCD. Some people probley got it worse than others. Thus, I think its presumptuous to assume that everyone who reads your post doesn’t have OCD and they might be offended.

When I say ODC, I mean that it just strikes an internal annoying itch. I dont use the term because I think it makes me look “cool” or anything, and I mean no disrespect to the term.

I admitt that I was over exagerating and I’m sorry if I offended you so I’ll edit my post.

I’m glad that I get this chance to clarify this with you. Are we cool?

@SkyTheCoder I guess you could say that to insults also, since stupid and dumb are unfavorable conditions people have, and I think “OCD” is one of those things that are now becoming a word that everyone uses, without the intention to insult those people, just their friends or themselves.

@Goatboy76 I just meant that, since I have OCD, it’s a bit offensive, as everyone nowadays says something is like OCD to them. It’s harder than they can imagine, though…

@Prynok Words coming to mean nothing is stupid. They originally meant something, but now people say it for no reason, and don’t even realize it. Like gay, for instance. There’s nothing wrong with it. It meant something. Then school took it and it got throttled by teenagers, and now boys call each other gay without meaning it or realizing it. (And if you thought by that I meant I was gay, let me say, I’m not gay myself, but there’s nothing wrong with it.)

And don’t think I didn’t read your comment because I said stupid in that post. I used it properly…