Skip to content

tizilogic/kha-sdf-painter

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Custom g2 extension for Kha to draw shapes using Signed distance fields

The extension uses distance functions as can be found here: 2D distance functions to (currently) draw circles and rounded rects, with borders.

Usage:

  1. Add this as a subproject to your project like this:
await project.addProject(pathToSDFPainter);
  1. Create a render target that can be used by SDFPainter to draw on:
...
myTarget = Image.createRenderTarget(1280, 720);
sdfPainter = new SDFPainter(myTarget);
...
  1. Use like g2:
...

sdfPainter.begin();  // takes the same arguments as a normal g2 instance.
sdfPainter.color = Color.Red;
sdfPainter.sdfRect(10, 10, 400, 60, {tr: 20, br: 20, tl: 5, bl: 5}, 5, Color.White, 2.2);
// Individual corner radii can be set for each corner. Alternatively only setting corner radius
// for "tr" applies the radius to all four corners.

sdfPainter.color = Color.Cyan;
sdfPainter.sdfCircle(640, 360, 60, 7, Color.Orange, 2.2);
// The last argument for both shapes (2.2) is the amount of pixels to smooth, to avoid aliasing.
sdfPainter.color = Color.White;

sdfPainter.drawImage(myImg, 90, 150);
...
sdfPainter.end();

...

About

Draw shapes using Signed distance fields in Kha

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published