How to create a line with a repeated sprite on 2d map between 2 points

Question

Hello there, tried to use LineRenderer for that, but without a good result. The thing is, that I need to draw a line with my own sprite, which looks like a little arrow, between two points on the map, but when I tried to use LineRenderer, sometimes it adds half of an arrow if the distance need it, but I want to add and draw only full sprites. So I think maybe about just adding these sprites by instantiating prefabs with Sprite Renderer having this sprite (but now as I'm writing this, I think that there will be a lot o these prefabs, cause map will be big, like in Slay the Spire, so it could impact performance). So what do you guys think or how can you help me, will appreciate every feedback and help. Thx <3

Answer 1

Best Answer

Answer by AaronBacon · Jun 03 at 12:39 AM

I'd Look into Slicing Sprites, It's typically used for UI, with borders that stay consistent on a resizeable UI box, but I've used it for an arrow with a sprite before. You simply set up the Arrow sprite in the sprite Editor so that the arrow head is outside the green box and considered a border. You also likely want to set it's pivot point to be at the base of the arrow (0.5,0 in my case below):

⠀

link text

⠀

Then You make the sprite and set its Draw Mode to Tiled

⠀

link text

⠀

And now you can resize it and it should keep the arrow head while still resizing the line:

⠀ link text

⠀

Quick Note for scripting, You have to Modify the Sprite Renderers size property, not its scale. Here's a Script I wrote a While back that should make the arrow go from 1 point to another:

 public class ArrowScript: MonoBehaviour
 {
     public Transform startPoint;
     public Transform endPoint;
     private Vector3 offset;
     private SpriteRenderer spr;
 
     // Awake is called when the script instance is being loaded.
     protected void Awake()
     {
         offset = new Vector3(0,90,90);
         spr = GetComponent<SpriteRenderer>();
     }
     
     void FixedUpdate()
     {
         if(startPoint != null)
         {
             transform.position = startPoint.position;
             transform.LookAt(endPoint);
             transform.Rotate(offset);
             spr.size = new Vector2(spr.size.x, Vector3.Distance(startPoint.position,endPoint.position));
         }
     }
 }

Add comment · Show 3 · Share

Kirpich158 · Jun 03 at 01:04 AM 0

Share

it's pretty awesome dude, but I have a sprite that looks like an arrow head, so this arrow head should be repeated, so there are a couple of them between the points, not like the line before a normal arrow as you show on gif. idk if I'm describing it well and clear?

AaronBacon Kirpich158 · Jun 03 at 02:03 AM 1

Share

In that case just skip the First step of setting the Sprite Borders (Green Box). If you just set its pivot and make the sprite tiled, the sprite will repeat as a whole

Kirpich158 AaronBacon · Jun 03 at 10:34 AM 0

Share

ok, thx, I will try to repeat it today, thx <3

How to create a line with a repeated sprite on 2d map between 2 points

1 Reply

Your answer

Follow this Question

Related Questions