A little helper tool for generating fillp patterns.

Output is provided as hexadecimal sum (most compact), binary sum (easiest to read), and decimal addition (verbose; matches PICO-8 example). Click on output to copy to clipboard.

StatusReleased
CategoryTool
PlatformsHTML5
Rating
Rated 4.9 out of 5 stars
(23 total ratings)
AuthorSean
Made withPICO-8
TagsPICO-8
Average sessionA few seconds
LanguagesEnglish
InputsMouse
AccessibilityHigh-contrast
LinksSource code

Comments

Log in with itch.io to leave a comment.

(2 edits) (+1)

I am running Pico-8 0.2.5c and it appears the background and foreground colors are inversed. Additionally, I can't get alpha to work, or it might be that part isn't inversed?

Edited a few times as I discover more about this that might help you figure it out.

Most importantly, I have to say -  This is a very helpful tool!!!

I just tried it out on v0.2.5c and it seems to be working as expected (images below), though I think I may see the source of your confusion: If you don't change the colours in the tool and also don't set a colour in pico-8, then it will appear to be reversed, because the default colours in this tool don't match pico-8's default. I can update the default colour selection in the tool so that's less confusing in the future.

I'm not sure what you mean by the alpha bit though, could you provide more detail or some code to show what you mean?

fillp tool GUI showing a thin orange line on red bgPICO-8 showing code corresponding with fillp tool's outputPICO-8 render showing output matching fillp tool

Hi Sean, Sorry for the late response!  I will check notification settings.

By alpha I mean like a graphic alpha channel (transparency). In Pico-8 black is transparent. 

In my case, I'm making a particle explosion and using shift-e and shift-b in the function FILLP(E) or FILLP(B) (where it shows the dotted pattern in place of E and B, with the built in patterns; which use color 0 as an alpha, and my chosen color as the fill pattern.  

In your red/yellow example above, if the Red was color 0 (black), it would be transparent and you would only see yellow diagonal lines. Any circle filled with that pattern would show the yellow lines and what isn't yellow would show the game graphics under the fill where the color 0 is.  

I'm new to programming but I did a lot of graphic work, so I might not be explaining it well. I thought this would help me fade out a filled circle by changing through a series of patterns with less and less coverage.  That's what I'm doing now with the Shift-E and Shift-B, but I only get 2 steps of fade where I'd like about 5 or 7.

Again, I love this tool, I can't thank you enough for your contributions to the community!!! I appreciate it!

(2 edits) (+1)

Ah, I think I understand what you're trying to do.

"Transparent" isn't a colour to select in PICO-8 (it defaults to treating black as transparent, but you can modify that with PALT), and the FILLP function allows you to set part of the pattern to transparent (regardless of colour) using additional binary bits. Using the previous example, you could call FILLP(0x8421 + 0b.1) and it will render transparent where the yellow is. There's more detail on this feature in the PICO-8 user manual here.

I assume when you're using the special characters shift-e and shift-b, it's using a pattern that already has that bit set, but if you want to use custom patterns you can add 0b.1 to any pattern you create.

(+1)

Thank you so much for that tip!  I'll certainly dig into the manual and add this to my own quick notes.  I will put this to use!!!

(+1)

I just tried this out, and it's exactly what I needed to make a smooth fade (given the color and resolutions limitations, haha)  This is perfect!  

(+2)

excellent tool, thank you!
I'd add a 'random' button for experimenting :)

(+2)

Very nice! I was messing around with the sprite editor and map editor trying to fake this in stock PICO-8, but this is exactly what I needed for what I was doing :D

(+1)

This is great and VERY useful - thanks for creating it! :D

If you're at all looking for feature suggestions - it'd be great if this also allowed you to pick colours and set the transparency option, as this is the bit I tend to get stuck on!

Thanks again

(+3)

Thanks for the feedback! I'm not sure what the UI for the transparency would look like, but I added a colour picker.

In the meantime, you can copy the binary output and add .1 to get transparency.

(+1)

That's great Sean - this will DEFINITELY be a lifesaver going forward.
Thanks again! :D

(+2)

Fantastic tool, will definitely be making use of this a lot!

(+1)

I made a similar tool!
but never thought on using hex values. That's great :D