Drawing while in love.update function

[UnrealDiego]

Hi,

I'm pretty new to Löve/programming in general and I have the following problem: I want to program a visualized quick-sort. Now, I already visualized insert-sort and bubble-sort, by doing this:

Code: Select all

function love.update(dt)
	if G_StartSort then
		if Time:hasDelay(G_Speed) and not G_Stop then
			G_SortFuncs:Step() --G_SortFuncs is a function pointer to the sort function.
		end
		--print("drawing")
		G_SortFuncs:Draw() 
	end

	--Timer update
	Time:update(dt)
	--LoveFrames
	loveframes.update(dt)
end

The G_StartSort is a variable which is true when a button is pressed (I use löveframes for that). The Time:hasDelay(G_Speed) is just an optional condition, if you want to slow the animation down. G_Stop is for pause.
So every time the G_SortFuncs:Step() is called, he does the following:

Code: Select all

function InsertSort:Step()
	Time:resetDelay()
	if self.j <= #self.Array then
		if self.i > 0 and self.Array[self.i] >= self.key then
			self.Array[self.i+1] = self.Array[self.i]
			self.Array[self.i] = 0 --This is not needed, but makes the animation look better
			self.i = self.i - 1
		else
			self.Array[self.i+1] = self.key
			self.j = self.j + 1
			
			self.key = self.Array[self.j]
			self.i = self.j - 1
		end
	else
		InsertSort.isSorted = true
	end
end

It's a step from the original insert-sort. I do this so I can draw the new array after every step. Here's the normal code of insert-sort for comparison:

Code: Select all

function InsertSort(Array)
	for j = 2, #Array do
		key = Array[j]
		i = j - 1
		while i > 0 and Array[i] >= key do
			Array[i+1] = Array[i]
			i = i - 1
		end
		Array[i+1] = key
	end
end

So, after he is done doing the step, he draws the Array with this draw function:

Code: Select all

function InsertSort:Draw()
	canvas:clear()
	local tempposx = self.posx
	local tempposy = self.posy
	for i = 1, #self.Array do
		local height = self.stretch*self.Array[i]--*100/self.maxheight

		canvas:renderTo(function()
			love.graphics.rectangle("fill", tempposx, tempposy-height, self.width-1, height)
		end)

		tempposx = tempposx + self.width
	end
end

The canvas is then drawn in love.draw():

Code: Select all

function love.draw()
	love.graphics.draw(canvas)

	--LoveFrames
	loveframes.draw()
end

Now, my problem is this "step-by-step" functions are pretty hard to do for sorting algorithms like quick-sort. What I would like to do is to just use the original sorting algorithm, and tell the engine to draw every time after a certain point in the algorithm. I tried to do this, but since the sort operation is called in the love.update function, the engine won't draw anything (As it should be -> separation of concerns). So does anyone have an idea what I could do to solve this problem, without doing this "step"-solution I came up with? Any help is appreciated!

Thanks!

[Roland_Yonaba]

I'd use coroutines. It might not be the best solution, but they sound like a good candidate to the problem.

[T-Bone]

You can draw to canvases in love.update.

[Azhukar]

As it should be -> separation of concerns

Screw separation of concerns and modify your love.run function.

Code: Select all

function love.run()

    math.randomseed(os.time())
    math.random() math.random()

    if love.load then love.load(arg) end

    local dt = 0

    -- Main loop time.
    while true do
        -- Process events.
        if love.event then
            love.event.pump()
            for e,a,b,c,d in love.event.poll() do
                if e == "quit" then
                    if not love.quit or not love.quit() then
                        if love.audio then
                            love.audio.stop()
                        end
                        return
                    end
                end
                love.handlers[e](a,b,c,d)
            end
        end

        -- Update dt, as we'll be passing it to update
        if love.timer then
            love.timer.step()
            dt = love.timer.getDelta()
        end

        -- Call update and draw
        if love.update then love.update(dt) end -- will pass 0 if love.timer is disabled
        if love.graphics then
            if love.draw then love.draw() end
        end

        if love.timer then love.timer.sleep(0.001) end
        if love.graphics then
			love.graphics.present()
			love.graphics.clear()
		end
    end

end

Moved love.graphics.clear() right after love.graphics.present(), done.

[Someguynamedpie]

You need to move clear to before present.

[Azhukar]

You need to move clear to before present.

If you want to stare at a blank screen.

[slime]

You need to move clear to before present.

If you want to stare at a blank screen.

I think he probably meant "clear before love.draw and love.graphics.present (and before love.update if you want to be able to draw in love.update)". If you clear after presenting, your first frame will likely contain unexpected garbage.

[Someguynamedpie]

Yeah, clear before drawing is done

[Azhukar]

If you clear after presenting, your first frame will likely contain unexpected garbage.

Good point, I always forget about the 1st frame.