Page 1 of 1

Image bug

Posted: Thu Sep 21, 2017 3:44 pm
by nikneym
Hey guys. I got a problem about drawing images. At the first picture, there is no bug in our character. but after you move it a little, with (x=x+100*dt) there is a slightly white border which appears. also it loses all smoothness it has. how can i solve it? all my pictures are png formatted.

Image

Re: Image bug

Posted: Thu Sep 21, 2017 4:14 pm
by grump
Linear filtering happens because you're moving the image to sub-pixel positions. Use

Code: Select all

x = math.floor(x + 100 * dt)

Re: Image bug

Posted: Thu Sep 21, 2017 4:59 pm
by zorg
With the above code, if the speed would be lower, the character may not move at all;
What you want instead, is to move it without flooring, but floor the coordinates when drawing.

Re: Image bug

Posted: Thu Sep 21, 2017 5:10 pm
by nikneym
thanks for help but i think this only works at left and top directions. at the other directions it can't move.

Re: Image bug

Posted: Thu Sep 21, 2017 5:11 pm
by nikneym
zorg wrote: Thu Sep 21, 2017 4:59 pm With the above code, if the speed would be lower, the character may not move at all;
What you want instead, is to move it without flooring, but floor the coordinates when drawing.
also i tried it at draw event but same bug happened. :/

Re: Image bug

Posted: Thu Sep 21, 2017 5:34 pm
by grump
zorg is right, it wouldn't work at lower speeds or very high frame rates. My bad.

Please show some code. Only the relevant code please: the part where you're moving your sprite and the part where you're drawing it.

Re: Image bug

Posted: Thu Sep 21, 2017 7:13 pm
by nikneym
-walking part

Code: Select all

	if love.keyboard.isDown("d") then
			woo.x=woo.x+200*dt;
			woo.lastKey="right";
			woo.active="right";
		elseif love.keyboard.isDown("a") then
			woo.x=woo.x-200*dt;
			woo.lastKey="left";
			woo.active="left";
		elseif love.keyboard.isDown("w") then
			woo.y=woo.y-200*dt;
			woo.lastKey="top";
			woo.active="top";
		elseif love.keyboard.isDown("s") then
			woo.y=woo.y+200*dt;
			woo.lastKey="bot";
			woo.active="bot";
		else
			woo.active="idle";
	end

Drawing part (while it walks or stops frames change)

Code: Select all

	if woo.active=="idle" then
		lp.draw(img.woo.idle[woo.kare], woo.x, woo.y);
	elseif woo.active=="right" then
		lp.draw(img.woo.sag[woo.kare], woo.x, woo.y);
	elseif woo.active=="left" then
		lp.draw(img.woo.sol[woo.kare], woo.x, woo.y);
	elseif woo.active=="top" then
		lp.draw(img.woo.top[woo.kare], woo.x, woo.y);
	elseif woo.active=="bot" then
		lp.draw(img.woo.bot[woo.kare], woo.x, woo.y);
	end
lp means love.graphics.

Re: Image bug

Posted: Thu Sep 21, 2017 7:39 pm
by grump
Change all occurrences of woo.x and woo.y in the drawing part to math.floor(woo.x) and math.floor(woo.y).

Simplify your draw function

Code: Select all

-- untested example code, may contain errors
local anim = {
    idle = img.woo.idle,
    right = img.woo.sag,
    left = img.woo.sol,
    top = img.woo.top,
    bot = img.woo,bot,
}

lp.draw(anim[woo.active][woo.kare], math.floor(woo.x), math.floor(woo.y))
Simply it further by using the same identifiers for right and left in all places

Re: Image bug

Posted: Thu Sep 21, 2017 7:55 pm
by nikneym
grump wrote: Thu Sep 21, 2017 7:39 pm Change all occurrences of woo.x and woo.y in the drawing part to math.floor(woo.x) and math.floor(woo.y).

Simplify your draw function

Code: Select all

-- untested example code, may contain errors
local anim = {
    idle = img.woo.idle,
    right = img.woo.sag,
    left = img.woo.sol,
    top = img.woo.top,
    bot = img.woo,bot,
}

lp.draw(anim[woo.active][woo.kare], math.floor(woo.x), math.floor(woo.y))
Simply it further by using the same identifiers for right and left in all places
It works very nicely, thanks!