Page 1 of 1

How can i draw a line in this [SOLVED]

Posted: Thu Apr 20, 2023 1:35 pm
by zalander
Hi,
This is dvd screensaver thingy and i was wondering that how can i draw lines where the square goes
The code

Code: Select all

function love.load()
    game = {
        x = love.graphics.getWidth() / 2,
        y = love.graphics.getHeight() / 2,
        mov_x = 0,
        mov_y = 0
    }
end
function love.update(dt)
    if game.mov_x == 0 and game.mov_y == 0 then
        game.mov_x = 10
        game.mov_y = -10
    end
    game.y = game.y + game.mov_y
    game.x = game.x + game.mov_x
    if game.y < 0 then
        game.mov_y = 10
    end
    if game.y + 40 > love.graphics.getHeight() then
        game.mov_y = -10
    end
    if game.x + 40 > love.graphics.getWidth() then
        game.mov_x = -10
    end
    if game.x < 0 then
        game.mov_x = 10
    end
end
function love.draw()
    love.graphics.rectangle("line", game.x, game.y, 40, 40)
    love.graphics.print("X:"..game.x.."mov_x:"..game.mov_x)
    love.graphics.print("Y:"..game.y.."mov_y:"..game.mov_y, 0, 10)
end
Thanks ! :nyu:

Re: How can i draw a line in this

Posted: Thu Apr 20, 2023 3:22 pm
by darkfrei
Just use the zig zag function

Code: Select all

function zigzag (t, p, a)
  p = p or 2
  a = a or 1
  return math.abs (t/p - math.floor (t/p - 0.5) -1) * 2*a
end
Where
a is width or height without picture dimensions,
p is period value, for example twice the a
t is global time value

The zigzag function generates a zigzagging motion over time t with a period p and amplitude a.
The function takes three arguments:

t: the current time
p: the period of the zigzag (how long it takes to complete one full cycle)
a: the amplitude of the zigzag (how far it moves up and down)
The function first calculates the current phase of the zigzag by dividing the current time t by the period p, rounding it to the nearest integer, and then subtracting 0.5. This gives a value that oscillates between -0.5 and 0.5 as time passes.

The function then takes the absolute value of this phase, doubles it, and subtracts 1 to make it oscillate between -1 and 1 instead. Finally, it multiplies this value by the amplitude a to scale the zigzag to the desired size.

The result is a value that oscillates between -a and a, smoothly transitioning between these extremes in a zigzagging motion.

https://www.desmos.com/calculator/zdloawxnjv

Re: How can i draw a line in this

Posted: Thu Apr 20, 2023 3:27 pm
by Bigfoot71
You can display a line with love.graphics.line

For the line in the direction the square is going you can do like this:

Code: Select all

local cx, cy = game.x+20, game.y+20 -- square center
love.graphics.line(cx, cy, cx+game.vx*20, cy+game.vy*20)
If you want the segment to end exactly where the square will hit the edge, you can do something like this (assuming that the first point of the segment must be the center of the square) (I'm trying to keep it simple, say so if you have any problems):

Code: Select all

local cx, cy = game.x+20, game.y+20

local hit_x = (game.vx > 0) and love.graphics.getWidth() or 0
local hit_y = cy + ((hit_x - cx) / game.vx) * game.vy

love.graphics.line(cx, cy, hit_x, hit_y)
If you need precision do not hesitate, I leave you the quick rewrite that I did if you want it. I took the liberty of simplifying it a bit.

Here I replaced your variables mov_x, mov_y by vx, vy which means velocity.

These are values ​​between -1 and 1, and you can multiply them by the speed of the object to get the movement in the right direction with the right speed as well. I also added speed multiplication by 'dt'. Example:

Code: Select all

x = x + vx * 100 * dt -- direction * speed (speed * dt represents the number of pixels traveled in 1 second)
It will be more practical for also calculating the second point of our segment (and also practical for many other types of calculations).

Code: Select all

math.randomseed(os.time()) -- Initialize a seed of randomness with the present time, otherwise the numbers generated by random will always be the same

function love.load()

    game = {

        x = love.graphics.getWidth() / 2,
        y = love.graphics.getHeight() / 2,

        vx = math.random() < .5 and -1 or 1,    -- Start with random direction
        vy = math.random() < .5 and -1 or 1

    }

end

function love.update(dt)

    game.y = game.y + game.vy * 100 * dt     -- (Velocity * Speed * dt) - (100*dt corresponds to 100 pixels per second)
    game.x = game.x + game.vx * 100 * dt

    if game.x < 0 or game.x + 40 > love.graphics.getWidth() then   -- If we touch an edge, we reverse the direction
        game.vx = -game.vx
    end

    if game.y < 0 or game.y + 40 > love.graphics.getHeight() then
        game.vy = -game.vy
    end

end

function love.draw()

    love.graphics.rectangle("line", game.x, game.y, 40, 40)

    local cx, cy = game.x+20, game.y+20
    local hit_x = (game.vx > 0) and love.graphics.getWidth() or 0
    local hit_y = cy + ((hit_x - cx) / game.vx) * game.vy
    love.graphics.line(cx, cy, hit_x, hit_y)

    love.graphics.print("X:"..game.x.." mov_x:"..game.vx*100)
    love.graphics.print("Y:"..game.y.." mov_y:"..game.vy*100, 0, 10)

end

Re: How can i draw a line in this

Posted: Fri Apr 21, 2023 10:47 am
by zalander
Thanks guys for the help ! :awesome: