playMaker

Author Topic: Camera Mouse Drag [SOLVED]  (Read 412 times)

Schleckenmiester

  • Playmaker Newbie
  • *
  • Posts: 11
    • View Profile
    • schleck.dev
Camera Mouse Drag [SOLVED]
« on: July 29, 2019, 10:45:08 PM »
Is there a way to make a sort of tap and drag camera thing like in Google Maps? I'm trying to make a replica of a game I used to play as a kid and I need that sorta feature to look around.

I searched around and didn't seem to find anything except one action that's called "Drag Camera" but that one is sorta directional, I'm looking for like if you tap and drag on Google Maps. Thanks.

== SOLUTION ==

This took way longer for me to solve than expected but it's made to work on any size phone and be consistently the same moving speed.

So, first, there are 3 states in a loop. The first one is just checking the input for a Mouse Down or Touch if ya like. But it's got nothing really in it. I'll list the rest in paragraphs because there's a lot more in those. But the diagram looks like this.

Touch Down:

Enter: this state is checking a lot of things, it get's the height (H) and width (W) of the screen, position of the mouse normalized, then converts that normalized mouse coordinates to convert the mouse coordinates in the editor by dividing the H with W for the screen ration. Then, it stores all the mouse coordinates there just for Button Down, so this is all happening in one frame and one frame only. Ends with a Next Frame Event. As well as storing the main camera's position in a variable.
Diagram:

Move: this is kinda the tough part, it get's the same information as the last state except in realtime, and constantly updates where the current mouse position is in editor coordinates. Then it gets the difference of the two and moves the main camera according to those two coordinates, adding the difference at the end of the loop, then to not move the camera exponentially it has to subtract the difference right after the camera is moved because it adds the difference right before. This state only finishes when the Button Up event is called. Then when it gets out it loops back to the Mouse Down event.
Diagram:

Probably not the best solution, but it's the solution I came up with. Catch ya'll later!
« Last Edit: August 03, 2019, 12:55:29 PM by Schleckenmiester »
Check out my blog, I'm making a game with Playmaker! https://schleck.dev

daniellogin

  • Full Member
  • ***
  • Posts: 166
    • View Profile
Re: Camera Mouse Drag
« Reply #1 on: July 30, 2019, 02:01:06 AM »
lol "unsolved". Good one.  ;)

OK so to start with, I think you should think about it in terms of the 'tap' being irrelevant. All you need to do is have the camera move based on mouse input. This can happen always, or be activated by some kind of action (such as holding the left mouse button). I don't think it actually matters where on the screen you click with Google maps, it's just an on off switch to click anywhere.

So now you think about it in terms of just 'moving' and 'camera', first you need to get the input from the mouse. I mostly just use gamepad input and using third party actions for some of it, but I think you use Get Axis Vector: https://hutonggames.fogbugz.com/default.asp?W453

Next you need to use that input to move the camera. I don't know if it's a weird thing to do, but one way that comes to mind is to use a Unity Character Controller module, and the Controller Simple Move action: https://hutonggames.fogbugz.com/default.asp?W522
Using that, you can just input the vector (your x and y mouse vectors combined) and it handles movement.

You just need to do it so the mouse X is X, but the mouse Y is Z by the time you send it to the character controller. This is because pushing forward moves the camera 'up' as in North on a map, and not 'up' as in higher in to the air.

Back to the click part, or tap? Use a Get X Down, like for example Get Mouse Button Down or Get Button Down. Use that to transition in to the State which gets the inputs and send it to the character controller (or other method to apply the input as movement), which will also have a Get Mouse Button Up or etc, to transition back to the idle state. Alternatively this can be monitored in another FSM which does that alone, but sends an event to your input/moving FSM to start or go to an idle state.

Maybe this will help get you started. Someone else better may chime in to, so you can changed that 'unsolved' to 'solved'  ;D
« Last Edit: August 01, 2019, 01:35:39 AM by jeanfabre »

Schleckenmiester

  • Playmaker Newbie
  • *
  • Posts: 11
    • View Profile
    • schleck.dev
Re: Camera Mouse Drag
« Reply #2 on: July 31, 2019, 12:46:57 PM »
Oh, I never thought of using the controller on anything else besides the player. That's a good idea. I'll try your suggestions as soon as I can then get back to here. Sorry I'm new and I didn't find any clear answer as to what I was looking for.

Also did a bit of trial and error learning other things since I asked the question so I may be a bit more inclined to do this now. Thanks for your suggestions though and I'll reply back here when I'm done!
« Last Edit: August 01, 2019, 01:35:48 AM by jeanfabre »
Check out my blog, I'm making a game with Playmaker! https://schleck.dev

jeanfabre

  • Administrator
  • Hero Member
  • *****
  • Posts: 14595
  • Official Playmaker Support
    • View Profile
Re: Camera Mouse Drag
« Reply #3 on: August 01, 2019, 01:35:23 AM »
Hi,

 Also, please refrain from marking [UNSOLVED], mark a thread [SOLVED] when it's solved instead.

I have edited your titles.

Thanks :)

Bye,

 Jean

Schleckenmiester

  • Playmaker Newbie
  • *
  • Posts: 11
    • View Profile
    • schleck.dev
Re: Camera Mouse Drag
« Reply #4 on: August 03, 2019, 12:08:16 PM »
Oh sorry, I didn't know. But thanks! I solved my problem with a lot of hard work and I'm going to update my results in my main post.
Check out my blog, I'm making a game with Playmaker! https://schleck.dev

daniellogin

  • Full Member
  • ***
  • Posts: 166
    • View Profile
Re: Camera Mouse Drag [SOLVED]
« Reply #5 on: August 03, 2019, 09:59:28 PM »
Good job. Very considerate and helpful for you to show your solution (pictures and all) so someone else one day may be able to use it as a guide for a similar question.  :)

Schleckenmiester

  • Playmaker Newbie
  • *
  • Posts: 11
    • View Profile
    • schleck.dev
Re: Camera Mouse Drag [SOLVED]
« Reply #6 on: August 03, 2019, 10:36:19 PM »
Thanks! I've come across way too many posts where people don't show the solution and it's just frustrating for everyone so I put in the little bit of effort.
Check out my blog, I'm making a game with Playmaker! https://schleck.dev

jeanfabre

  • Administrator
  • Hero Member
  • *****
  • Posts: 14595
  • Official Playmaker Support
    • View Profile
Re: Camera Mouse Drag [SOLVED]
« Reply #7 on: August 05, 2019, 10:48:59 PM »
Hi,

 Excellent, thanks for sharing your findings, indeed it helps others!

Bye,

 Jean