Studio only beta release update!
This new version of CanvasDraw will only work on Roblox Studio with the EditableImage/Mesh beta feature enabled. Until EditableImage is fully released, this will not work on the regular roblox client!
CanvasDraw 4.0 is here early! and faster than ever before!
CanvasDraw was released on Janurary of 2022, which was two years ago.
Since then, a lot has improved. But none of these improvements are great as the update you’ve all been waiting for. CanvasDraw 4.0!
Say goodbye to lag and framerate issues, and say hello to high resolution projects and games!
My raycaster engine running 60+ FPS at 320x320
This update completely scraps the old internal UIGradient based canvas system by <@boatbomber> in favour for the new EditableImage instance!
This alone paired up with native luau code generation, has sped up the rendering process up to 10 times!
Also, the resolution limit is now basically gone! You can now make canvases as large as 1024x1024 pixels!
This is a simple paint system I made that runs basically lag free at 1024x512
Pixel transparency support and optimised drawing methods
Most of CanvasDraw’s drawing methods for shapes, textured polygons, lines, images, etc, now use pure RGBA values instead of using a Color3 object, which ofc, contains a lot of unnecessary information and computational methods that we almost never use in the engine.
And yes, that’s right. The canvas can now support transparent pixels along with new super fast per-pixel methods!
Canvas:SetRGB(X, Y, R, G, B) -- Super fast set RGB method
Canvas:SetAlpha(X, Y, 0.5) -- Half transparent (also super fast)
Extract ImageData from roblox TextureIDs!
Yep, you heard me! we can now extract an ImageData object from roblox TextureIDs. This means we can now work with pixels from images as large as 1024x1024, which is roblox’s texture size limit!
Using the advanced DrawDistortedImage() method on a 720x512 canvas at 30 FPS, which is really damn good.
Only downside to this compared to the SaveObject based method, is that this new method yeilds as we have to fetch a roblox online asset.
-- [New method: yeilds, but can go up to 1024x1024]
local ImageData = CanvasDraw.GetImageDataFromTextureId("rbxassetid://1346999791")
-- [Previois method: doesn't yeild and loads instantly, but can only go up to 256x256]
local ImageData = CanvasDraw.GetImageData(SaveObject)
New Built-in Image Editor!
A brand new built-in sprite/image editor tool has been created and added to the official CanvasDraw Tools plugin!
You can use the Image Editor to quickly import SaveObjects and PNG images, and edit them with a drawing canvas with transparency support. You can also export these images as SaveObjects for CanvasDraw!
A few methods and properties have been renamed
This core system and naming convention for the module is pretty well almost unchanged, but this version has renamed some commonly used methods to be shorter and easier to work with and understand for new users.
To migrate any existing pre-4.0 CanvasDraw projects, you may have to rename a few methods and properties.
Here’s all the renamed properties/methods:
- CanvasDraw.AutoUpdate() → CanvasDraw.AutoRender()
- CanvasDraw:Update() → CanvasDraw:Render()
- CanvasDraw:DestroyCanvas() → CanvasDraw:Destroy()
- CanvasDraw:FillCanvas() → CanvasDraw:Fill()
- CanvasDraw:ClearCanvas() → CanvasDraw:Clear()
And more!
Here’s the full changelog for this version of CanvasDraw 4.0!