About Monkey 2 › Forums › Monkey 2 Projects › ted21 controls
This topic contains 8 replies, has 3 voices, and was last updated by
AdamStrange
2 years, 4 months ago.
-
AuthorPosts
-
November 30, 2016 at 9:01 am #5505
Thought I’de post a shot of ted21 editor with all 3 color palettes open
the main one is the palette editor, it allows you to set the amount of colors in a palette 1 to 255 arranged in a grid
the controls on the left are copy/paste/copy/swap/mono/ramp or fade
The other tow are (on the right) the pop up color palette which directly links into canvas, so canvas.Color = PicoBlack would give you the PicoBlack color. Pressing ‘use color will change the color of the main palette color (if you are viewing a palette) or actually add the correct code if viewing a monkey2 document.
You can see that colors are arranged in color gradients, so virtually all colors are available. If you use a different color (which uses numbers and not a name) then you will get canvas.Color = new Color(rr,gg,bb) with the correct floats added
Lastly on the bottom is the pain palette. here you can make new palettes, load saved palettes (the same as the main window) and use paint controls to mix colors to your hearts content. You can also use ‘pick’ to select colors from the paint area or even from images that you are viewing. Pressing use has the same effect as the color palette. it will add the current color to the palette or add the correct text if you are in a monkey document
If anyone is interested in why having more than one color picker? The answer is they all do slightly different things, and all reinforce each other. Color palettes are also used in different views (voxel, sprite editor) so it makes sense to unify everything. So you have the actual colors, you have the text and you have the color values.
Colors palettes all use the same format so are interchangeable. You can create a palette in one way and the load it into another view, editor, and use it there. or load it into your app, whatever.
Attachments:
November 30, 2016 at 9:03 am #5507what is ted21? have you forked ted ?
November 30, 2016 at 11:13 am #5508yep. it was forked from the V1.02 Monkey2 version. The one before Mark changed all the mojox stuff into a module.
I can only compile it under 1.02, but is a complete ted2 replacement in ALL other versions. But… To fully operate you will need to have a number of changes made to the mojo module and std module to support all the new functions.
December 1, 2016 at 7:07 am #5521Also added .vox support and new vox image slice support. image slices are created from voxels and saved as tiny png files.
The images show voxel editing (and palette – see above) with the default .vox palette.
.vox are created by the magic voxel editor. But you can create voxels with this editor too
Image slices can be seen if you look really closely. I’ve also been optimising the backend so everything is pre-calculated giving a speed boost
December 1, 2016 at 7:32 am #5525Cool stuff, Adam!
December 1, 2016 at 10:39 am #5530next up is font/sprite editor
December 2, 2016 at 7:47 am #5540Work in progress. first some background.
a (mini bitmap) font is a 16×16 grid which gives 256 characters. usually the pixel size is 256×256, but it can be different if needed or wanted. but most screen fonts are 8×8 or 16×16.
So we need a 16×16 grid basis – check.
Screen fonts are usually png or gif files with transparent and white for the font pixels as this is the most flexible. but as they are going to be png then we can use lots of colors. and use the characters as sprites if wanted. this is how the old 8bit and 16 bit systems handled things
but looking at pico8, there is also the option of using multiple characters for ‘bigger’ ones. so we need to have that sort of function too.
the first pic shows the character image at the top with the color palette below and the current selected character
the second pic is the same but with multiple characters selected
color 0 is blank/transparent. when the actual color is clicked then you get a quick color editor (as shown in the third pic). its a basic rgb with saturation and light and allows for quick editing. There is the ability to load and save different palettes. Once merged into ted21 you will also have the 2 color palettes to pick colors from.
It’s a very simple concept, but can be used as a direct sprite editor for small sprites or even bigger ones as well as fonts.
And if you’re wondering about file sizes. a complete screen font of 256 characters with rgb color is 2k!
next up is magnification and actual editing controls plus display. all pretty simple stuff
Attachments:
December 2, 2016 at 2:53 pm #5544fill, paint, brush, dropper, clear all sorted
Here’s the stand-alone version showing a single fontsprite being edited
Attachments:
December 3, 2016 at 12:25 pm #5566ok, flood working correctly.
added view and view as tile
added tools: move, mirror and onion – where (once clicked) the current selection becomes a faded onion skin, allowing you to work on other sprites at the same time.
The tiling and views is great as they are all live, so changing/editing anything is immediately shown. perfect for seamless tiles.
One thing I found interesting is the multiple palettes. Used as separate apps, they work great. but when using as an integrated platform, I’ve found there needs to be a simple button to exchange visible palettes. so you can transfer one palette to another.
Next up will be the selection, different brushes, stamps, etc
Attachments:
-
AuthorPosts
You must be logged in to reply to this topic.







