Search Unity

  1. Welcome to the Unity Forums! Please take the time to read our Code of Conduct to familiarize yourself with the forum rules and how to post constructively.

Discussion Techniques for Line Drawing on Canvas

Discussion in 'Scripting' started by AnimalMan, Nov 17, 2022.

  1. AnimalMan

    AnimalMan

    Joined:
    Apr 1, 2018
    Posts:
    1,164
    So i want to draw a box on my canvas,meaning I want to draw a line between the four points of screen space that make the square. Currently represented correctly by four canvas images at each point.

    My approach is likely going to be scaling some Rect transforms so that their corners are in the suitable locations and so that the line has some width two it aswell. This would require four images to be stretched and fitted accordingly using Rect Transform methods to position those corners, as oppose to using a localScale of course.

    I just wonder before I jump into it if there is another way? A small inbuilt function or anything available to render that line in screen space without the use of Rect transform controls. (I know about the line renderer of course, but it is never that suitable when working on a canvas)

    Thanks

    POINTS.png
     
  2. Kurt-Dekker

    Kurt-Dekker

    Joined:
    Mar 16, 2013
    Posts:
    31,368
  3. AnimalMan

    AnimalMan

    Joined:
    Apr 1, 2018
    Posts:
    1,164
    I almost changed to select objects through the screen position of their health bar within the canvas. Instead of checking tiles. But it opens up issues such as iterating through a list of UI bars. So I am certain selecting the tile itself this way is the way to go.

    however,

    still no progress on the line. :)
    I think I am on the trail of a way to draw a line but I think I will do the stretched image line first to see what the code might end up looking like. My brain too scrambled to navigate that man’s code but maybe in a few hours il come around to it. Not sure what it may entail but I assume a line maker of some kind. Graphics draw 2D or something I am looking at not sure what I am doing though. Might just try the image :)
     
  4. Kurt-Dekker

    Kurt-Dekker

    Joined:
    Mar 16, 2013
    Posts:
    31,368
    So the
    UILineRenderer
    contained in the above project doesn't work?!
     
    AnimalMan likes this.
  5. AnimalMan

    AnimalMan

    Joined:
    Apr 1, 2018
    Posts:
    1,164
    Il look properly :)
     
  6. Kurt-Dekker

    Kurt-Dekker

    Joined:
    Mar 16, 2013
    Posts:
    31,368
    Seems odd to look in any other way.
     
    orionsyndrome and MelvMay like this.
  7. AnimalMan

    AnimalMan

    Joined:
    Apr 1, 2018
    Posts:
    1,164
    Not sure if selecting UI health bars that are always on the canvas space is more suitable as selecting from the tile and checking ground, bridge and airspace will mean I could technically select an airborune unit or rather it is unavoidable to do anything but select all units on tile. However the method of selection could be useful for the editor.

    Il swap the codes out and worry about the line later. :D
     
  8. karliss_coldwild

    karliss_coldwild

    Joined:
    Oct 1, 2020
    Posts:
    382
    To me it sounds like what you actually need is to draw an axis aligned rectangle not arbitrary lines. You could also very easily draw this using single 9-sliced image, no need to manually calculate and stretch each side separately.
     
  9. AnimalMan

    AnimalMan

    Joined:
    Apr 1, 2018
    Posts:
    1,164
    Yes_Mi_Lord.png

    Nice in the end. I just positioned 4 images on the canvas

    CERTAINLY.png

    Settled on the hybrid because, using the Screen positions mouse clicks results jittery movement of the square as it draws i don't know why. But using the tile select positions, which are also derived from mouse position as if it were on the plane, as a reference no jitters at all, quite nice. Just needs some fiddlesticks and that'll be that. Never the less is a good base to work with. Doesn't cost a thing really to set the delta size and throw it in position.