CanvasDraw - A powerful pixel-based graphics library (Draw pixels, lines, triangles, read/modify image data, and much more!)

YES!
If it’s not much to ask, do you have the example script for ur sprite sheet example?

This was my test script

--!native

local Gui = script.Parent
local Frame = Gui:WaitForChild("CanvasFrame")

local CanvasDraw = require(Gui:WaitForChild("CanvasDraw"))

local Image = CanvasDraw.GetImageData(script.Tileset)

local ResX, ResY = 64, 64

local Canvas = CanvasDraw.new(Frame, Vector2.new(ResX, ResY))

local Columns, Rows = 13, 11
local SpriteWidth, SpriteHeight = 16, 16
local FPS = 5


while true do
	for Y = 1, Columns do
		for X = 1, Rows do
			local RectX = (X - 1) * SpriteWidth + 1
			local RectY = (Y - 1) * SpriteHeight + 1

			Canvas:Clear()
			Canvas:DrawImageRectXY(Image, 1, 1, RectX, RectY, SpriteWidth, SpriteHeight, 1 / Columns, 1 / Rows)

			task.wait(1 / FPS)
		end
	end

end

I also edited your image so there’s no awkward 1 pixel padding
image-1.png (20)

1 Like

I know what I’m spending my week on :smiling_imp::smiling_imp::smiling_imp:

2 Likes

Patch - v4.7.2


This release just fixes a rendering issue with the triangle and some image data issues due to the new buffers that I have added.


  • Fixed CanvasDraw.CompressImageData() and CanvasDraw.DecompressImageData()

  • Fixed Canvas:DrawImageXY() ImageData error


CanvasDraw4.7.2.b.rbxm (64.1 KB)

I figured out something funny
Turns out, depending on the spritesheet’s size, it draws out a different size and (sometimes) result
(Over here I just expanded the canvas size, not the spritesheet persay, everythings still 16x16)



Been trying to figure out y certain spritesheets cause artifacts or have strange behaviors and I figured out it was due to the different sizes of spritesheets. How does one resolve this?

wait bruh i forgot that scaleX scaleY existed



they shouldve never let me be a programmer :broken_heart:

2 Likes

Life is beautiful, pretty even
Roblox development, now became fun again

1 Like

I was today years old when I realized that drawing a rectangle with floats and not integers causes some very interesting color artifacts. not sure if other shapes have this problem so idk lol

Regardless, the STI/Love2D port has been a success! I will now rewrite it to do things my way :smiley:

if i’m feeling happy, might even open source it!

1 Like

Micro Patch - v4.7.3


This change fixes a single pixel overdraw issue with the following triangle-based methods:

  • Canvas:DrawTriangle()

  • Canvas:DrawTexturedTriangle()

  • Canvas:DrawDistortedTriangle()

  • Canvas:DrawRotatedImage()

  • Canvas:DrawImageRect()


CanvasDraw4.7.3.b.rbxm (64.1 KB)

1 Like

I don’t know If this was asked before, but how would one support you for the work here? Like a little donation thing!

Well, currently I don’t have pay pal or a Patreon account, which I might change soon, but for now if you want to support development on this project, you can buy one of my donation T-shirts I have on my group!

2 Likes

You def deserve a dime for this fantastic work of art, you earn it!

1 Like

Forgot to reply, but thank you heaps for that! Means a lot! Have a nice day :)

1 Like

Your work is FAR far more worth than just 30,000 Robux. I hope you get farther in life, you’re a one of a kind.

1 Like

Hi! DrawRectangleXY still has that issue. I still need to round the position variables to not cause the issue.

Yeah, it is expected that you round or floor the coordinates for DrawRectangleXY, however I’ll add rounding anyway just to avoid hassle, and I dont think it would hurt performance at all. I’ll do the same to some other shape methods

1 Like

Oh! and CanvasDraw v4.7.3 has this weird line issue going on here


this didn’t occur in v4.7.2

Testing different maps:
It did exist in CanvasDraw 4.7.2 to an extent, but the newer version has it occuring even more:
4.7.2
RobloxStudioBeta_oCnYshk2DN
4.7.3

Okay that’s odd… I’ll do some testing and see If I can find the issue. It could just be an issue with your spritesheet, or your math, or somehow another render issue, eitherway, i’ll do some tests real quick

1 Like

I haven’t changed anything other than upgrading to the newer CanvasDraw here, downgrading it removes the issue (or in this case, occur far less likely)

1 Like