How do I rotate mouse movement around object for weapn wheel

0 favourites
  • 14 posts
From the Asset Store
This is a single chapter from the "Construct Starter Kit Collection". It is the Student Workbook for its Workshop.
  • Hello everyone! I'm trying to create a weapon wheel similar to GTA V. That game slows down, the mouse cursor disappears but seems to be locked in the center of the screen and it extends radially. I hope that make sense. You can then "push" it around the wheel to select different weapons. I think most modern radial wheel/weapon wheels in game function like this nowadays.

    https://youtu.be/pDGGJIvCTZM?t=39

    So I've got a simple and very crude looking weapon wheel system implemented. You hold shift to bring up the weapon wheel. The ammo type switches based on what "ammo/color" I click. Basically, I'd like to create the behavior of the mouse acting like it's locked in the center of screen (or weapon wheel sprite) and can move around highlighting the weapons on the weapon wheel while the player pushes the "locked" invisible mouse. Am I using the correct term? Do I need to clamp the mouse wheel somehow? I found this post but I couldn't get it to work .Hope I explained what I'm trying to do clearly. Thanks for reading my question!

    edit: changed the name of my post title to be a more specific question. It was previous "How do I create a GTA style weapon wheel/clamp mouse movemnt"

    window-bound-mouse_t63058

  • Here's something similar to what I'm trying to replicate. Instead of the missile circling the ship non-stop though, I need a "free" mouse that is temporarily restricted to this sort of circle movement so that the player can circle around the weapon wheel and quickly select a weapon. I'm gonna spend some time looking at that capx and experimenting but any guidance would be appreciated! Thanks!

    edit: the way i imagine the weapon wheel working is when the player holds tab or shift, time pauses/slows down the the wheel pops up. The crosshair would disappear, the mouse would essentially "teleport" over to the weapon wheel, lock itself into a circular movement so that mouse movement highlights the weapons on the wheel and the player can select them. On shift/tab release/weapon select, the new weapon is selected and your cross hair should be where it last was on the game layout. Highlighting, changing the visibility of the cross hair and actually selecting the weapons are the easy parts.

    Just typing out how I want the system to work makes me realize its not as simple as just locking the mouse movement. If that even is simple The "teleportation" of the mouse seems tricky unless I'm over thinking it. I guess I would have to store the location of the cross hair/mouse as I bring up the weapon wheel and place the mouse back there when the weapon wheel is closed.

  • I think you are making it to difficult.

    First. You can not set the mouse to a position, other then the position the player moved the mouse physical to.

    And you should not be able to do that in a 'browser game'.

    That said (and accepted), you can not use the mouse to acces things in the wheel.

    And now it all got a lot more simple. Just as example:

    https://www.dropbox.com/s/fdnydudwf81q3 ... .capx?dl=0

  • You could turn the cursor invisible during selection and turn a different cursor visible. Put its origin way below the actual image, so the cursor appears over the weapon options and its origin is at the center of the wheel. Then use the "set angle to position" action:

    key SHIFT is down -> cursor set angle to (mouse.x, mouse.y)

    I'm not sure what to do to get the original cursor back to the right position, though.

  • 99Instances2Go Thanks for the help and info! This is definitely a good way to get around the problem of re positioning the mouse after selecting a weapon. I'm wondering if maybe I'll keep this in mind but I still really have my heart set on something GTA V-like.

    calebbennetts Awesome! Thanks! I think this is what I'm looking for! It's not working the way it looks like it should though. The cursor seems almost locked into place on its side. The cursor is placed upright in the editor before hand though. I used absoluteX and absoluteY and that actually rotates around the circle but it works wonky. I added short gifs of both. Other cursor there for testing.

    mouse.x,mouse.y

    mouse.absolutex,mouse.absolutey

    Anyway, I'd appreciate some more help if you can calebbennetts. I think I've also come up with a way to replicate this behavior now. So the whole screen will have these invisible zones that correspond with specific weapons. The mouse is always hovering over a weapon unless the mouse is in the center. Player won't necessarily move the mouse around like a wheel but that's ok. It might work better that way. I think this can get very close to the effect I'm looking for. I can check whether the mouse is in the "zone" of any particular weapon and have the weapon highlighted or flashing. What does everyone think of this method? Seems like a pretty good workaround for an artist like me. I'd really like to get what calebbennetts suggested working though. That way seems like it's all ready to go once I can get the angle of the cursor to point to the mouse correctly. Here's a pic of what I'm thinking of.

  • I'm thinking you should just make an invisible, long and thin sprite, make the origin something like "0, 3", have it set angle towards mouse.X and mouse.Y, and use overlap events for the different colors.

    Take this for example:

    googledrive.com/host/0B3W5p8PE6c_7TEt3MWZxQnBQY0k

    I put it together quite hastily, but the point should get across.

  • : Your idea would work similarly to mine, but I think it would also encounter the same problem.

    I think the problem is that the weapon wheel is probably on its own layer with a (0,0) parallax, right? So unless you're in the very top-left of the map, the mouse is actually really far away from the wheel's center, and any movement only means a tiny change in angle.

    Meanwhile, looking at absolute x and y, it seems like that refers to the mouse position for the entire screen, not just your game's window. Possibly not a problem once you port to mobile?

    So a potential workaround: you could use (mouse.x, mouse.y), set the weapon wheel's layer to a (100,100) parallax, then set the wheel's position to (scrollx,scrolly) every tick. It does make the rotation work correctly. However, you would have to put your onscreen buttons in a separate layer or move them every tick as well. This method also makes the weapon wheel look a bit jumpy when it repositions, but it'll only be visible when the timescale is very low, so it might not be noticeable.

  • : Your idea would work similarly to mine, but I think it would also encounter the same problem.

    I think the problem is that the weapon wheel is probably on its own layer with a (0,0) parallax, right? So unless you're in the very top-left of the map, the mouse is actually really far away from the wheel's center, and any movement only means a tiny change in angle.

    Meanwhile, looking at absolute x and y, it seems like that refers to the mouse position for the entire screen, not just your game's window. Possibly not a problem once you port to mobile?

    So a potential workaround: you could use (mouse.x, mouse.y), set the weapon wheel's layer to a (100,100) parallax, then set the wheel's position to (scrollx,scrolly) every tick. It does make the rotation work correctly. However, you would have to put your onscreen buttons in a separate layer or move them every tick as well. This method also makes the weapon wheel look a bit jumpy when it repositions, but it'll only be visible when the timescale is very low, so it might not be noticeable.

    If you want to track the mouse from a layer that has parallax, that's what LayerToCanvas and CanvasToLayer is for

    You can move/relate things on different layers with different parallax values using these expressions

    ~Sol

  • Hey all! Thank you for all the help! Been working on other parts of the game but I'm back at this specifically. I'm not sure what I'm doing wrong but I just can't get the cursor to point to the correct mouse position, no matter what I try.

    calebbennetts I tried you workaround but it still won't read the mouse position correctly. Even if it did, the jitter-ing is difficult to ignore and I think I've implemented the LayerToCanvas and CanvasToLayer expressions correctly into my events. If I can't get it to work that way though, I can pause the game while selecting a weapon. No more jitter-ing.

    SoldjahBoy Thanks for your help. I took a look at the example and I think I got it to work in my project. Still, though, the cursor doesn't correctly point at the mouse. Before LayerToCanvas and CanvasToLayer, the cursor wouldn't rotate fully. Now it does but it's not pointing to where the mouse is.

    Am I doing something wrong with the sprite? I want to describe the way the cursor is acting like there's actually a 2nd invisible cursor and the 2nd cursor is the one actually pointed towards the mouse.

    I recreated the problem in a small capx. I made a small, thin sprite like and I have 3 different ways of controlling the cursor on that capx. None of them have the cursor pointing at the mouse correctly. Can anyone take a look at the file and troubleshoot it please? Shift brings up the "weapon wheel". Also including the pic of the events on my level. Am I using the LayerToCanvas and CanvasToLayer expression correctly? Is the mouse even on a "Layer"?

    edit: Presumably the mouse is on the "Game" Layer with the player collision, enemy collisions and other things like that right? The layout size of this capx is the same size of my prototype level, 2048x1024. Adding a gif of LayerToCanvas/CanvasToLayer working in my level. It works fully rotates unlike mouse.x,mouse.y and the wheel/cursor/icons are on the "UI" layer but I can't get the cursor to spin correctly regardless.

    https://www.dropbox.com/s/s0qo4kl1s8e1k ... .capx?dl=0

  • here fixed for you

    https://www.dropbox.com/s/b3dlvchxp1suh ... .capx?dl=0

    all you need is

    (dont set angle towards

    just set angle from centre wheel to mouse postion

    note the addition of ("UI") to identify specific layer and make sure no parallax or scale on that layer

    eg

    set angle to >>>> angle(hud_weaponWheel.X, hud_weaponWheel.Y, Mouse.X("UI"), Mouse.Y("UI"))

    look fwd to yr game.....

  • NetOne Hey, thanks a bunch! You definitely fixed the problem in the capx. I tried to implement the simple changes into my prototype level but rotation is still broken . Sorry this topic has been going on for so long folks! No matter what I do, I just can't get the cursor to point to the mouse.

    Still the same problem, posted a gif. It rotates nicely but not correctly. I'd post a pic of the event sheet but it's laid out exactly like in the updated capx! I just can't believe nothing I try works. I can't think what the problem might be seeing as the capx example works fine. I have 13 layers. Could that be it? What in my layout could be causing the mouse and weapon wheel cursor not to work correctly?

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • I still perceive the cursor movements as disturbing.

    In GTA, i beleive, the aiming cross is not acting as a cursor. I beleive that it is not locked to the mouse. Also the aiming cross dissapears when bringing up the wheel.

    I think (just an opinion as so many) if you see the aiming cross as 'the direction it will shoot to', things will get easyer to archive. Then the aiming cross can move on a fixed circle arround the player. Effectively show direction the player is shooting towards. Now it is easy to snap that aiming cross back to that place after un-showing the wheel.

    The aiming cross is (in my eyes) not needed to make a selection in the wheel. (see my example). With that cross hopping arround, that HUD gets to complex.

    Using the mouse wheel would be the most natural way to choose, but, on 'touch' thats not gonna work.

    So maybe, if you wanna do this on 'touch' too, why not use the actual 'touch'/'mouse' to choose from the wheel. And use a controlled aiming cross to represent the direction that one shoots to.

    Just mumbling, dont mind me.

  • Hey, thanks for the comment 99Instances2Go So I'm creating two games from all this prototyping I'm doing. One mobile game and one PC game. Both Metroidvania style platformers. Hopefully for the PC release, I can include gamepad support and that's one of the reasons why I want a weapon wheel.

    The cross hair/cursor won't be visible when you bring up the weapon wheel in the final version of the game. Right now I just have it visible in the mean time as I experiment. Maybe that is what is messing up the events from working correctly?

    I'm not sure how GTA handles it's weapon switch behind the scenes but I do know it uses the mouse to scroll around the weapon wheel to select a weapon (when playing with mouse and keyboard). I do agree that the cross hair/mouse hopping around the screen for weapon select seems weird, wonky and complex. I'm not sure how GTA gets around that problem...proprietary engine?

    I really want to replicate something like GTA. And the Witcher 3. Basically every game has a weapon wheel selection system like this. Mouse scroll is actually a really good idea that I forgot to think of. Naturally mouse scroll for weapons will be included on the PC version with using mouse and keyboard.

    [quote:2dzjv6dg]I think (just an opinion as so many) if you see the aiming cross as 'the direction it will shoot to', things will get easyer to archive. Then the aiming cross can move on a fixed circle arround the player. Effectively show direction the player is shooting towards. Now it is easy to snap that aiming cross back to that place after un-showing the wheel.

    [quote:2dzjv6dg]And use a controlled aiming cross to represent the direction that one shoots to.

    Hey sorry, I don't think I understand. Do you think you can elaborate a bit?

  • Does it seem to be 90 degrees off from the mouse? Because I was thinking, what if you just went into the image editor for your selection indicator and rotated the entire image 90 degrees clockwise? Then it would be laying flat at zero degrees and point right at the mouse.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)