- KDPScreenshot.png (5.14 KiB) Viewed 15679 times
What did you do that for?
For writing code, In the past year or so i've been using vscode with a vim emulator extension. This means my coding workflow is almost entirely keyboard driven, And i was curious if such a workflow might work for pixel art. So i threw together a little prototype, And that prototype has grown into something usable, At least in my opinion.
How does it work?
You have a cursor, Which you can move with the arrow keys.
Wait. I thought you said this was vim inspired, Why the arrow keys and not "hjkl"?
For whatever reason, The arrow keys felt more natural for this to me. All keybindings can be changed if you'd prefer using "hjkl".
You use 'd' to draw, 'f' to fill, 'x' to erase, 't' to pick the color under the cursor, 'u' to undo, 'y' to redo, 's' to enter select mode, 'g' / 'lshift g' to enter copy / cut mode, 'd' while in copy / cut mode to paste. Those are the basics. Beyond that there's a few helpful keystrokes you can deploy to speed up navigating around your image
'ww' followed by an arrow key, To warp the cursor to the corresponding edge.
'wc' followed by an arrow key, To warp to the corresponding edge of the current color, So like 'ww', But it stops when the color changes
'wd' followed by an arrow key, To warp to the corresponding edge, But filling in the pixels on the way.
'wc' followed by an arrow key, To warp to the corresponding edge of the current color, But filling in the pixels on the way.
There's also vertical & horizontal mirroring available, Accessible via 'mv' & `mh`. And `mm` to disable all mirroring.
There is a color palette system built in, To navigate the color palette, You use the arrow keys while holding down 'lctrl'. It can load color palettes from .png's, As long as they're in a 1x scale. It can technically load palettes in other scales, There will just be duplicates.
Well how does it handle saving and loading files if it's all keyboard driven?
It has a vscode inspired "command palette". It's way more basic, And actually kinda works completely different so its difficult to claim it's inspired by it. When you press "tab" a little textbox will float in from the top, And you can input various commands into it.
To create a new image you use 'new [width] [height]'. For example 'new 32 16' will create an image with the width of 32 & height of 16. If only one argument is provided, It will be used for both the width & height. If no argument is provided, It defaults to 16x16.
To save an image, You use 'save [filename]'. The filename can have spaces, And should not contain a file extension. All images are saved as .png. Example: 'save my awesome image' will save your awesome image as "my awesome image.png". Considering i've made this in löve, You can probably guess that the image is saved to KDP's save directory. In a sub folder called "save".
To easily access KDP's save directory, There's the "os" command. It takes no arguments, And just opens the save directory in your OS.
Well what if i want to share my awesome pixel art on twitter or something? Can KDP save it with a scaling factor?
Of course. For that there's the "export" command. It works exactly like the "save" command, With one key difference. If the last argument is a number, That number will be used as the scaling factor. Example: 'export my awesome image 32' will export your image with the scaling factor of 32. So if your image is 16x16, The exported image will be 512x512.
There's a few other less useful commands, "invert" will invert the color of your image, "grayscale" will turn your image into grayscale, "noise" will introduce a small amount of noise to your image, "shade" will slightly darken the currently selected color, "light" will slightly lighten the currently selected color and "q" will quit.
You mentioned before that keybindings can be changed, How does one do that?
You can change a lot more than the keybindings. Internally, There is a "config" table, Which controls all the keybindings, Colors, Fonts and a bunch of other stuff. That table is converted to a .ini file, Which you can change to your hearts content. Here's what it currently looks like
Code: Select all
[keys]
cursor_warp_color_left="wcleft"
cursor_line_right="wdright"
cursor_warp_left="wwleft"
redo="y"
cursor_warp_color_right="wcright"
undo="u"
cursor_warp_color_down="wcdown"
cursor_fill="f"
cursor_line_color_down="dcdown"
cursor_warp_right="wwright"
cursor_warp_up="wwup"
cursor_warp_down="wwdown"
cursor_line_color_left="dcleft"
toggle_fullscreen="f2"
select_mode="s"
cursor_erase="x"
cursor_right="right"
move_palette_cursor="lctrl"
cursor_line_left="wdleft"
vertical_mirror="mv"
cursor_left="left"
cursor_draw="d"
cursor_down="down"
select_palette_color="cc"
clear_mirror="mm"
cursor_line_up="wdup"
cursor_warp_color_up="wcup"
cursor_line_color_up="dcup"
toggle_grid="f1"
cursor_pick="t"
copy_mode="g"
cursor_up="up"
cursor_line_down="wddown"
horizontal_mirror="mh"
toggle_command_box="tab"
cursor_line_color_right="dcright"
cut_mode="lshiftg"
[color]
editor_cursor_color={20, 126, 255}
background_global={32, 32, 32}
debug_background={0, 0, 0, 100}
text_default={255, 255, 255}
background_alt={20, 20, 20}
debug_text={255, 0, 255}
text_alt={200, 200, 200}
selection={255, 0, 255}
mirror={91, 156, 222}
[palette]
default="src/palette/duel-1x.png"
[font]
file="src/font/monogram.ttf"
[settings]
command_timeout=0.3
max_palette_columns=8
show_grid=false
window_width=800
max_palette_rows=32
editor_border_width=4
window_resizable=true
window_height=600
max_undo_steps=100
debug=false
use_history=true
default_mode="drawMode"
window_fullscreen=false
empty_pixel={0, 0, 0, 0}
You mentioned that KDP is capable of loading color palettes from .png's. How do i load a palette into it?
It can only load color palettes from one directory, The "palettes" folder in it's save directory. So place your palette there. Then you can either go into the config.ini file, And replace the "default" value under the [palette] category to "palettes/your awesome palette.png", Or run the command "loadPalette your awesome palette".
Okay i think i've spent enough time talking to myself, You can get it on github, Where you'll also find a bit more proper documentation. I've also attached a .love below. If you find any bugs, Or have some feature ideas, Or you think this is the dumbest thing anyone has made, Or this has changed your life for the better, or anything, Let me know.
KDP.love- (24.14 KiB) Downloaded 503 times
