Adding a background image to a menu
Posted: Tue Aug 11, 2020 1:54 pm
I'm new to lua love, so its a learning process for me, as a project for computing A Level I have decided to make a game using Love.
I've used tutorials for help, and so far i've got a menu, and i've added music in the background myself, and I want to add a background image, possibly animated, and re-sizeable when the window changes, so I can get an idea of what the menu will look like. I'm not sure how to add the image in though, so far everything i've tried hasn't changed anything.
So far this is what the code looks like, any help is appreciated
BUTTON_HEIGHT = 64
window = love.window.setMode( 1920, 1080, {resizable=true, vsync=false, minwidth=400, minheight=300})
local
function newButton(text, fn)
return{
text = text,
fn = fn,
now = false,
last = false
}
end
local buttons = {}
local font = nil
MenuM = love.audio.newSource( 'music/DieYoung.WAV', 'stream' )
MenuM:setLooping(true)
MenuM:setVolume(0.7)
MenuM:play()
function love.load()
font = love.graphics.newFont(32)
table.insert(buttons, newButton(
"Start Game",
function()
print("Starting Game")
end))
table.insert(buttons, newButton(
"Load Game",
function()
print("Loading Game")
end))
table.insert(buttons, newButton(
"Settings",
function()
print("Loading Settings")
end))
table.insert(buttons, newButton(
"Exit",
function()
love.event.quit(0)
end))
end
function love.draw()
local ww = love.graphics.getWidth()
local wh = love.graphics.getHeight()
local button_width = ww * (1/3)
local margin = 16
local total_height = (BUTTON_HEIGHT + margin) * #buttons
local cursor_y = 0
for i, button in ipairs(buttons) do
button.last = button.now
local bx = (ww * 0.5) - (button_width * 0.5)
local by = (wh * 0.5) - (total_height * 0.5) + cursor_y
local colour = {0.4, 0.4, 0.5, 1.0}
local mx, my = love.mouse.getPosition()
local hot = mx > bx and mx < bx + button_width and
my > by and my < by + BUTTON_HEIGHT
if hot then
colour = {0.8, 0.8, 0.9, 1.0}
end
button.now = love.mouse.isDown(1)
if button.now and not button.last and hot then
button.fn()
end
love.graphics.setColor(unpack(colour))
love.graphics.rectangle(
"fill",
bx,
by,
button_width,
BUTTON_HEIGHT
)
love.graphics.setColor(0, 0, 0, 1)
local textW = font:getWidth(button.text)
local textH = font:getHeight(button.text)
love.graphics.print(
button.text,
font,
(ww * 0.5) - textW * 0.5,
by + textH * 0.5
)
cursor_y = cursor_y + (BUTTON_HEIGHT + margin)
love.graphics.draw(Backgroundimage, 1920, 1080)
end
end
I've used tutorials for help, and so far i've got a menu, and i've added music in the background myself, and I want to add a background image, possibly animated, and re-sizeable when the window changes, so I can get an idea of what the menu will look like. I'm not sure how to add the image in though, so far everything i've tried hasn't changed anything.
So far this is what the code looks like, any help is appreciated
BUTTON_HEIGHT = 64
window = love.window.setMode( 1920, 1080, {resizable=true, vsync=false, minwidth=400, minheight=300})
local
function newButton(text, fn)
return{
text = text,
fn = fn,
now = false,
last = false
}
end
local buttons = {}
local font = nil
MenuM = love.audio.newSource( 'music/DieYoung.WAV', 'stream' )
MenuM:setLooping(true)
MenuM:setVolume(0.7)
MenuM:play()
function love.load()
font = love.graphics.newFont(32)
table.insert(buttons, newButton(
"Start Game",
function()
print("Starting Game")
end))
table.insert(buttons, newButton(
"Load Game",
function()
print("Loading Game")
end))
table.insert(buttons, newButton(
"Settings",
function()
print("Loading Settings")
end))
table.insert(buttons, newButton(
"Exit",
function()
love.event.quit(0)
end))
end
function love.draw()
local ww = love.graphics.getWidth()
local wh = love.graphics.getHeight()
local button_width = ww * (1/3)
local margin = 16
local total_height = (BUTTON_HEIGHT + margin) * #buttons
local cursor_y = 0
for i, button in ipairs(buttons) do
button.last = button.now
local bx = (ww * 0.5) - (button_width * 0.5)
local by = (wh * 0.5) - (total_height * 0.5) + cursor_y
local colour = {0.4, 0.4, 0.5, 1.0}
local mx, my = love.mouse.getPosition()
local hot = mx > bx and mx < bx + button_width and
my > by and my < by + BUTTON_HEIGHT
if hot then
colour = {0.8, 0.8, 0.9, 1.0}
end
button.now = love.mouse.isDown(1)
if button.now and not button.last and hot then
button.fn()
end
love.graphics.setColor(unpack(colour))
love.graphics.rectangle(
"fill",
bx,
by,
button_width,
BUTTON_HEIGHT
)
love.graphics.setColor(0, 0, 0, 1)
local textW = font:getWidth(button.text)
local textH = font:getHeight(button.text)
love.graphics.print(
button.text,
font,
(ww * 0.5) - textW * 0.5,
by + textH * 0.5
)
cursor_y = cursor_y + (BUTTON_HEIGHT + margin)
love.graphics.draw(Backgroundimage, 1920, 1080)
end
end