Scrolling Map - Feel so close but not working... ><

Questions about the LÖVE API, installing LÖVE and other support related questions go here.
Forum rules
Before you make a thread asking for help, read this.
Post Reply
Nytician
Prole
Posts: 5
Joined: Sat Sep 19, 2020 12:10 pm

Scrolling Map - Feel so close but not working... ><

Post by Nytician »

Code: Select all

--Scrolling Tilemap Test--
local moonshine = require("moonshine")

function love.load()
	effect = moonshine(moonshine.effects.colorgradesimple)
	effect.colorgradesimple.factors = {0.075,0.075,0.6}

	width = love.graphics.getWidth()
	height = love.graphics.getHeight()
	tilesize = 64
	player = {}
	screenx = width/2
	screeny = height/2
	startx = 1
	starty = 1
	screentilex = nil
	screentiley = nil
	player.speed = 2
	player.x = startx
	player.y = starty
	tilestartx = math.floor(player.x-(screenx/tilesize))
	tilestarty = math.floor(player.y-(screeny/tilesize))
	delta = love.timer.getDelta()
	map = {
	{1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,1},
	{1,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,1,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,1},
	{1,0,0,0,0,1,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{1,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1},
	{0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1}
	}
	mapsizex = 30
	mapsizey = 30
	player.sprite = love.graphics.newImage("Assets/PNGs/Player/PlayerTemplate.png")
	tileset = love.graphics.newImage("Assets/PNGs/Map/Tiles/TileSprite0.png")
	grass = love.graphics.newQuad(0,0,tilesize,tilesize,2048,2048)
	shortgrass = love.graphics.newQuad(128,0,tilesize,tilesize,2048,2048)
end

function love.update(dt)
	updateresolution()
	checkeys()
end

function love.draw()
	drawmap()
	drawplayer()
	drawdebug()
end

function checkeys()
	if love.keyboard.isDown("w") then player.y = player.y - player.speed * delta end
	if love.keyboard.isDown("d") then player.x = player.x + player.speed * delta end
	if love.keyboard.isDown("s") then player.y = player.y + player.speed * delta end
	if love.keyboard.isDown("a") then player.x = player.x - player.speed * delta end
	if player.y < 0 then player.y = 0 end
	if player.x < 0 then player.x = 0 end
end

function drawplayer()
	love.graphics.draw(player.sprite,screenx,screeny)
end

function drawmap()
	local startdrawx = math.floor(screenx-(player.x*tilesize))
	local startdrawy = math.floor(screeny-(player.y*tilesize))
	if startdrawx < 0 then startdrawx = 0 end
	if startdrawy < 0 then startdrawy = 0 end
	local drawx = startdrawx
	local drawy = startdrawy
	local tilestartcheckx = nil

	screentilex = screenx/tilesize
	screentiley = screeny/tilesize

	if drawx < 0 then drawx = 0 end
	if drawy < 0 then drawy = 0 end

	tilestartx = math.floor(player.x-screentilex)
	tilestarty = math.floor(player.y-screentiley)

	if tilestartx < 1 then tilestartx = 1 end
	if tilestarty < 1 then tilestarty = 1 end

	local tileendx = math.floor((width-startdrawx)/tilesize)
	local tileendy = math.floor((height-startdrawy)/tilesize)

	local sprite = nil

	love.graphics.setBackgroundColor(0.2,0.2,0.2)

	for y=tilestarty,tileendy do
		for x=tilestartx,tileendx do
			if map[y][x] == 0 then
				sprite = grass
				--effect(function()
					love.graphics.draw(tileset,sprite,drawx,drawy)
				--end)
			end
			if map[y][x] == 1 then
				sprite = shortgrass
				love.graphics.draw(tileset,sprite,drawx,drawy)
			end
			if drawx < startdrawx+(tileendx*tilesize)-tilesize then drawx = drawx+tilesize else drawx = startdrawx end
			if drawy < startdrawy+(tileendy*tilesize) and drawx == startdrawx then drawy = drawy+tilesize end
		end
	end
end

function drawdebug()
	love.graphics.print("Player X: "..player.x,10,10)
	love.graphics.print("Player X FLR: "..math.floor(player.x),200,10)
	love.graphics.print("Player Y: "..player.y,10,30)
	love.graphics.print("TileStartX: "..tilestartx,10,50)
	love.graphics.print("TileStartY: "..tilestarty,10,70)
	love.graphics.print("ScreenTileX: "..screentilex,10,90)
	love.graphics.print("ScreenTileX FLR: "..math.floor(screentilex),200,90)
	love.graphics.print("ScreenTileY: "..screentiley,10,110)
end

function updateresolution()
	width = love.graphics.getWidth()
	height = love.graphics.getHeight()
	screenx = math.floor(width/2)
	screeny = math.floor(height/2)
	delta = love.timer.getDelta()
end
It basically starts breaking as I move the character to the right and the map touches the edges of the screen, this is where things start falling apart and the map looses shape and doing a weird pattern. I've tried many MANY different things but no luck... I'm sure its simple but my brain is fried hah. Any help appreciated.

Nytician.
User avatar
CogentInvalid
Prole
Posts: 27
Joined: Sat Dec 14, 2013 12:15 am

Re: Scrolling Map - Feel so close but not working... ><

Post by CogentInvalid »

For an object in a scrolling world, you should draw it at:
* the object's position within the map
* minus the position of the camera (in this case, the player's position)
* plus half the width/height of the window, to center the camera
Nytician
Prole
Posts: 5
Joined: Sat Sep 19, 2020 12:10 pm

Re: Scrolling Map - Feel so close but not working... ><

Post by Nytician »

Thanks for your response!

In the end I got it working it turns out stopping the map going beyond -64 was an artificial limitation that wasn’t needed! Set the tile map to start at 1 seemed to work and it’s all good. Technically cutting corners by drawing whole map but it’s given me such a headache I’m happy it just works for now!

;)
Post Reply

Who is online

Users browsing this forum: Ahrefs [Bot], Google [Bot] and 3 guests