Textured Circle: A Quad issue

[Solumin]

Hi again, lövers! I'm having a problem with using quads to create tiled textures. In the game, each platform is textured using a quad. This works well for rectangles since, well, it's a quad. However, circular platforms (and by extension, any other non-rectangle platforms) can't be colored by a quad. Does anyone have any ideas about how to fit a quad to a non-rectangle?

I tried it with Frame buffers, but it didn't work well. I drew each actual shape (circle, polygons, etc.) on one frame buffer and all of the quads on the other frame buffer. I then grabbed the image data for each frame buffer, used a mapPixel to make any pixels in the quad fb that didn't match their counterparts in the shape fb transparent, while any other pixels were left alone. This didn't work -- so i went a step farther and did the opposite to the shape fb, except the other pixels were set to white. Then I pasted the shape fb image data into the quad fb image data, created a new image using the new quad fb image data, and drew that image. It worked. However, there is no way this could work in a side-scrolling game and still have a playable game.

[leiradel]

I'm not sure I fully understand the problem, but isn't it a transparency issue? Does your original image for a "circular" tile have transparent pixels?

Maybe you could post a screenshot showing the problem you're facing?

Cheers,

Andre

[Solumin]

Hmm, I guess I didn't explain my self well. I'm trying to draw the platforms for the game. Since each platform is a hardoncollider shape, I just used each one's :draw() method. However, I now need to draw each platform using tiles. The obvious solution is to use a quad, since that will handle the tiling by itself. The problem with using a quad is that it can only be rectangular. I have circular platforms and there is a very good possibility that I will have non-rectangular polygons for platforms. (hardoncollider is flexible like that) Because quads can only be rectangular, I was wondering if anyone knew of a way to get a tiling effect for any given shape.

[Solumin]

So I found a solution.

Code: Select all

function getOddImage(coords, img)
	local palette = love.graphics.newFramebuffer()
	local cx,cy,cr = unpack(coords)
	cx, cy = cr, cr
	local diam = cr*2
	local image = love.graphics.newImage(img) --it's assumed that img is a proper path.
	local quad = love.graphics.newQuad(0,0, diam,diam, image:getWidth(),image:getHeight())

	love.graphics.setRenderTarget(palette)
	love.graphics.setColor(255,255,255)
	love.graphics.circle('fill',cx, cy, cr,32)
	love.graphics.drawq(woodImg, quad, 0,diam)

	local data = palette:getImageData()
	local circleData = love.image.newImageData(diam, diam)
	local r1,g1,b1,a1
	local r2,g2,b2,a2
	for x=0,diam-1 do
		for y=0, diam-1 do
			r1,g1,b1,a1 = data:getPixel(x,y) --a pixel from the target circle
			r2,g2,b2,a2 = data:getPixel(x, y+diam) --a pixel from the quad/wood
			if a1 == a2 then
				circleData:setPixel(x,y, r2,g2,b2,a2)
			end
		end
	end
	love.graphics.setRenderTarget()
	return love.graphics.newImage(circleData)
end

(It should be noted that the Framebuffer, palette, is created outside of the function. It's included here for completeness. Creating a framebuffer every time this is called would be a major waste!)

Basically, I create my own image of a circle with the wood grain texture on it. When the circular platform that called this function is drawn, the image created here is used. This is much simpler than what I had been trying to do before (it only uses one Framebuffer instead of, say, 3 or so) and I don't think it'll be super laggy. Of course, large circle will present a problem, and eventually this should probably be written in C to speed things up. But hey, it works.

[leiradel]

It's still not clear to me what the problem is/was...

You can make a circular shape in, say, Gimp, make corners transparent (so that only the circular wood texture is opaque), save as a PNG and have it rendered in LÖVE without having a black/blue/whatever square "behind" it.