Pixel Art Gen

[EMB]

After being asked by my friend, I've made a tool to quickly view pixel art. He wanted it in order to transfer his creations from a page ripped out of his math's book onto a computer. Whilst not my first venture into LÖVE, it is the first one that I am releasing into the wild.

It is by no means perfect, and not at all documented, but I want feedback from more than just one person. It is also not distributable via a .love file because of the way love.filesystem works, which means you have to download the file's with "good ol' copy 'n paste", running the game using a folder.

Ask questions, give corrections/optimisations and everything else you guys generally do.

Here is main.lua:

Code: Select all

local coloursTable, tileTable = {}

function love.load()
	pixelLoad()
end

function love.draw()
	drawPixels()
end

function love.keyreleased(k)
	if k == "r" then pixelLoad()
	elseif k == "s" then saveImage()
	elseif k == "escape" then love.event.push("q") end
end

function saveImage()
	love.filesystem.write("image.bmp", love.graphics.newScreenshot():encode("bmp"))
end

function pixelLoad()
	pixelSize = 25
	love.filesystem.load("pixels.txt")()
	generatePixels(pixels)
	local width = #tileTable
	local height = #tileTable[1]
	love.graphics.setMode(width*pixelSize, height*pixelSize)
	love.graphics.setCaption(title or "Pixel Art")
end

function generatePixels(tileString)
	tileTable = {}
	local rowIndex = 0
	for row in tileString:gmatch("[^\n]+") do
		rowIndex=rowIndex+1
		local columnIndex = 1
		for character in row:gmatch(".") do
			if not tileTable[columnIndex] then
				tileTable[columnIndex] = {}
			end
			tileTable[columnIndex][rowIndex] = character
			columnIndex = columnIndex + 1
		end
	end
	for _,info in ipairs(colours) do
		coloursTable[info[1]] = {info[2], info[3], info[4], info[5] or 255}
	end
end

function drawPixels()
	for columnIndex,column in ipairs(tileTable) do
		for rowIndex,char in ipairs(column) do
			local x,y = (columnIndex-1)*pixelSize, (rowIndex-1)*pixelSize
			local col = coloursTable[char]
			love.graphics.setColor(col[1], col[2], col[3], col[4])
			love.graphics.rectangle("fill", x, y, pixelSize, pixelSize)
		end
	end
end

And here is pixels.txt (The file that main.lua reads):

Code: Select all

pixels = [[
wwwwwwwww
wbbbbbbbw
wwwwbwwww
wwbbbbbww
wbwwwwwbw
wbwrwrwbw
wbwwwwwbw
wbwrrrwbw
wbwwwwwbw
wwbbbbbww
wbbwwwbbw
bwbwrwbwb
bwbwwwbwb
bwbbbbbwb
wwwbwbwww
wwwbwbwww
wwwbwbwww
wwbbwbbww
]]

colours = {
{"y", 0, 255, 255},
{"r", 255, 0, 0},
{"b", 0, 0, 255},
{"w", 255, 255, 255}
}

pixelSize = 40

title = "Pixel Art!!!"

[tentus]

Here's a .love file, for those who don't want to manually copy-paste.

A couple of comments: there was some recent discussion about image formats superior to bmp, though i can't recall the name of the thread. You may want to look it up, bmp is pretty terrible. You also may want to pull scaling out of the txt, and into a function called by hitting +/-. Just a thought.

[EMB]

The reason I didn't use a .love file is because to be able to edit the .txt, it has to be in the "folder" format.
And yeah, I know BMP is crap but the wiki only says bmp and tga are supported. I'll have a look for that thread though.

Scaling is optional, it has a default value of 25, but I might also add the +/- aswell. Using a title is also optional.

Edit: BMP and TGA are the only formats possible. I can't do anything about that.

[tentus]

I would argue that tga is still better than bmp, but I'll let it lie.

Other thoughts: you could break the "game" it into two halves, a text area and a renderer. Then you wouldn't have to force the user to zip it up themselves. Text entry would be kind of a pain (manually coding cursor position sounds like a real joy ) but it's quite doable.

Though the lack of clipboard support will be a real off-putter...

[Robin]

Text entry would be kind of a pain (manually coding cursor position sounds like a real joy ) but it's quite doable.

There are quite a few GUI toolkits floating around.

[EMB]

I could make it like that, although I may have come up with a better solution:
How about clickable squares and a "paintbrush"? Would that make it easier? Live RGB Paintbrush?
The only thing about that idea would be a save format...

[TechnoCat]

How about clickable squares and a "paintbrush"? Would that make it easier? Live RGB Paintbrush?
The only thing about that idea would be a save format...

http://love2d.org/forums/viewtopic.php?f=5&t=1193 Here is something like that I did a while back.

[EMB]

Thanks for the link, but I would like to write it almost from scratch by myself in-order to give myself a challenge.
A saving system would also be easier if I knew the system inside and out.

[TechnoCat]

Thanks for the link, but I would like to write it almost from scratch by myself in-order to give myself a challenge.
A saving system would also be easier if I knew the system inside and out.

By all means: write it from scratch. My code in lovely expressions is poorly written.

[EMB]

Hmm, do you think that it would be a great improvement to see this but with save/load features and a grid based drawing system?