[SOLVED] Graphics order: a flashing square and a blue UI

[nice]

Hello boys and girls!
I'm currently working on a small side project to understand how canvas and saving works in Löve because I got some help on another project where I had some help on making a saving function so now I want to learn it myself.

A fellow Löve user said that I'll need to use the canvas function for my project because in the long run it will be problematic.

So to learn how the canvas function and saving function works I have made a square that switches colors (math.random(0, 255)) and I have also added a light blue "user interface" that will be at the bottom (UI = 800x120, X = 0, Y = 480) but here's the problem:
I know from the previous project that I'll need to set the color white so that I'll keep the UI light blue but I still have a problem that makes everything flash in different colors (both the square and the UI), so my guess is that it has something to do with the order it's in but I can't see what is wrong with it and I have tried different orders but to no avail.

I would appreciate if you could help me out with this small problem..

Code: Select all

function love.load()
	
end

function love.update()
end

function love.draw()
-- Square With Random Color
love.graphics.setColor( math.random(0, 255), math.random(0, 255), math.random(0, 255) )
love.graphics.rectangle("fill", 350, 250, 120, 120)

-- User Interface
love.graphics.draw(ui, 0, 480)
love.graphics.setColor(255, 255, 255)
end

[DaedalusYoung]

Code: Select all

function love.load()
	
end

function love.update()
end

function love.draw()
-- Square With Random Color
love.graphics.setColor( math.random(0, 255), math.random(0, 255), math.random(0, 255) )
love.graphics.rectangle("fill", 350, 250, 120, 120)

-- User Interface
love.graphics.setColor(255, 255, 255)
love.graphics.draw(ui, 0, 480)
end

Set the colour first, then do the draw call.

[nice]

Set the colour first, then do the draw call.

Thanks for the Help! It's been a while since I handled colours like this.