koobas.hobune.stream
Draw a line in opposite direction of mouse drag
Hi all, I am trying to add a direction indicator to my 2d game.
I drag my projectile backwards and let go to fire.
what I want to do is to have a line or texture that, as you drag the mouse extends out a short distance indicating the shot direction (just a straight line) eg:
mouse drag direction <====== <> ========> line/texture is drawn in this direction, or if mouse dragged diagonal down to the left the line/texture is drawn diagonal up to the right.
any help appriciated, I have a very basic understaning of scripting any help appriciated, thankyou
A little bit of understanding of Vector maths will help you here.
You'd probably start by recording the position of the mouse when it was initially clicked, let's call it (100,100) for now. Then in every update (or some other sensible interval), check the current position of the mouse. Lets assume the new position is (80,80).
Now, to show where your mouse started and where it is now, simply draw a line between the two points. Perhaps using the Unity Line Renderer will be a good start.
To get the line drawing in the opposite way, first work out the vector which describes the movement from point A to point B. In this case that's (80,80) - (100,100) which will give you (-20,-20). This means that from your original point of (100,100), the mouse has moved -20 in the x axis and -20 in the y axis, giving you the new value of (80,80). To get the opposite of this, simply multiply by -1, which would give you (20,20). Add this to your start position and you get (120,120). Draw a line from the start position to this new location and that's it!
Hi phil_me_up, thankyou for your quick answer! I have used a script I found on here for creating a laser and tried to change it.
#pragma strict
@script RequireComponent (LineRenderer)
var projectile : Transform;
var mouse : Vector2;
var hit : RaycastHit;
var range : float = 5.0;
var line : LineRenderer;
var line$$anonymous$$aterial : $$anonymous$$aterial;
var ray : Ray;
function Start()
{
line = GetComponent(LineRenderer);
line.SetVertexCount(2);
line.renderer.material = line$$anonymous$$aterial;
line.SetWidth(0.2f, 0.2f);
}
function Update()
{
ray = Camera.main.ScreenPointToRay(projectile.transform.position);
if(Physics.Raycast(ray, hit, range))
{
if(Input.Get$$anonymous$$ouseButton(0))
{
line.enabled = true;
line.SetPosition(0, projectile.transform.position);
line.SetPosition(1, projectile.transform.position*-1);
}
else
line.enabled = false;
}
}
It is drawing a line from my projectile, however it isnt following the angle, see picture attached, could you please assist me further if possible, thanks
This is what draws your line:
line.SetPosition(0, projectile.transform.position); line.SetPosition(1, projectile.transform.position*-1);
It draws from the projectile.transform.position to the inverse of that position. Assu$$anonymous$$g the transform position is (10,10) for example (2D for simplicity), the inverse is that * -1, which is (-10,-10). This means a line will be drawn from (10,10), to (-10,-10). By definition this will be from the projectile position, to the origin point (0,0) and back out the same distance to (-10,-10)
You need to look at those two lines and decide how you can draw (as a starting point), from the point where the mouse was first clicked, to the point where the mouse is now (hint, the mouse position can be read from Input.mousePosition)
Now you have that, how can you take that line and draw it in the opposite direction. (hint, the vector describing one point to another is one vector $$anonymous$$us the other. You then just need to turn that around. If the startPos is (20,20) and the newPos is (10,10), the line you want to draw will go from (20,20) to (30,30) )
Now hopefully you'll have a line that shows where the mouse was first clicked and a line point directly away from the new mouse position.
The final step is to transfer that point to be drawn on your slingshot. If you have a slingshot at (5,5) and a line which goes from (20,20) to (30,30). moving that so it starts at (5,5) is a case of moving both (20,20) and (30,30) by some vector which will make (20,20) (5,5). In this case, subtract (15,15) from both (20,20) and (30,30) and you'll end up with a line from (5,5) to (15,15).
I'm not giving exact answers and code because it's very, very important that you understand vector mathematics when making a game and going through the above piece by piece will really help with that. Hope that's not obstructive but just handing over the code for questions like these doesn't really help anyone!
Im trying hard to understand this, quite confusing as I have a basic understanding of maths and scripting (i'm trying! :) )
am I correct in thinking I need to set up 2 positions. The first input mouse position eg
function update(){
p1 = Input.mousePosition;
}
so when player clicks the projectile it sets p1 as the current mouse position.
and also have a second position that the line draws to from the current mouse position
function update(){
p1 = Input.mousePosition;
p2 = Input.mousePosition *-1; <<<<this been the exact opposite of mouse position
}
i tried this:
#pragma strict
@script RequireComponent (LineRenderer)
var projectile : Transform;
var p1 : Vector2;
var p2 : Vector2;
var hit : RaycastHit;
var range : float = 20.0;
var line : LineRenderer;
var line$$anonymous$$aterial : $$anonymous$$aterial;
var ray : Ray;
function Start()
{
line = GetComponent(LineRenderer);
line.SetVertexCount(2);
line.renderer.material = line$$anonymous$$aterial;
line.SetWidth(0.2f, 0.2f);
p1 = Input.mousePosition;
p2 = p1*-1;
}
function Update()
{
var p1 = Input.mousePosition;
var p2 = p1*-1;
ray = Camera.main.ScreenPointToRay(projectile.transform.position);
if(Physics.Raycast(ray, hit, range))
{
if(Input.Get$$anonymous$$ouseButton(0))
{
line.enabled = true;
line.SetPosition(0, p1);
//line.SetPosition(0, projectile.transform.position);
line.SetPosition(1, p2);
}
else
line.enabled = false;
}
}
I get a line that does move but its not connected to my mouse click point and seems to be pivoted in the middle of the screen
thats spot on now :) thankyou very much for all your help and descriptions
