GFXP - useful lib & tool for working with patterns

Hi! I made a small library and tool for working with patterns - GFXP https://github.com/ivansergeev/gfxp
You don’t need to use the library, you can only use the visual editor http://ivansergeev.com/gfxp/

Demo:
gfxp-demo

Visual editor:

I hope it will be useful to you :slight_smile:

14 Likes

This is really great. The tool in particular is very useful. I love that I can switch between library vs table vs playdate short/full code samples too.

If you don’t mind, I’d like to suggest a couple features: invert current pattern (not just full black/white) as well as changing the scale of the preview (sometimes I want to “zoom in” to the preview).

1 Like

Great!

I have so many patterns from Classic Mac and more, will ty to submit them at some point.

2 Likes

Inverting - will do! :+1:
And what is the use of zoom? No one sees the pattern enlarged.

Mostly because patterns can be used on any given sized shape, so maybe instead of zoom, I’m more wanting to be able to see the pattern filled inside various geometry primitives. So maybe a way to preview the pattern fill inside various different shapes!

OK, I’ll try to do it.

Inverting added! :slight_smile:

1 Like

Zoooooom added!

2 Likes

According to the updated rules, I closed public access to the GFXP Lib source code on GitHub. The latest version (beta) is available here.
GFXP-Source-1.zip (5.8 KB)

Includes a new pattern animation option.

gfxpa-animate-1

The GFXP Editor is still available http://ivansergeev.com/gfxp/

5 Likes

This web editor is allot of fun to use! I got lost testing new patterns between this an the simulator for a solid 15 minutes.

1 Like

Thanks! I try to make the tool really useful. :blush:
PS the animation editor is not yet complete.

gfxpa-1

The first release is ready!

gfxpa-2

1 Like

How about an option for readable pattern definition code? More about this method here https://devforum.play.date/t/matts-prototypes/826/4?u=matt

-- binary string to number
function b(e) return tonumber(e, 2) end

pattern = {	--  diagonal lines
	b('11110000'),
	b('11100001'),
	b('11000011'),
	b('10000111'),
	b('00001111'),
	b('00011110'),
	b('00111100'),
	b('01111000'),
}
1 Like

Good idea, I’ll do it!

1 Like

This tool has already been invaluable, thank you so much for the hard work in making it so great! All the new features are just fantastic.

1 Like

Done!

2 Likes

GFXP lib update.

Added support for masks and fixed bugs.
GFXP-Source-2.zip (78.7 KB)

The left pattern with mask, no drawing mode.
gfxpa-mask-1

2 Likes

GFXP Editor update.

Added support for automatic mask in the following modes: table, pd short, pd full.
The update is available on the GFXP website or GitHub

1 Like

Love this!

Small request: use CSS image-rendering property so no anti-aliasing is applied to the previews? Apologies ahead of time if I missed this in your css already.

https://developer.mozilla.org/en-US/docs/Games/Techniques/Crisp_pixel_art_look

2 Likes

Hi! Thank you for your feedback! I will definitely fix it very soon. The new version is ready, but it is not yet available for viewing.

1 Like