nickcoutsos / keymap-editor

A web based graphical editor of ZMK keymaps.
http://nickcoutsos.github.io/keymap-editor
MIT License
1.28k stars 323 forks source link

Feature Request: Print Layout Screen. #114

Closed tbandtg closed 1 year ago

tbandtg commented 1 year ago

Would be nice to have it generate a set of png files of the layout created.

calumy commented 1 year ago

A workaround, for now, could be to use caksoylar/keymap-drawer. It produces an SVG of the layout created e.g. https://github.com/calumy/zmk-config/blob/main/assets/lily58.svg. There is a workflow that can be used to generate the image every time you make a change:

    uses: caksoylar/keymap-drawer/.github/workflows/draw-zmk.yml@main
    with:
      output_folder: "assets"
      commit_message: "Update keymap images"

For an example of how this could be used, take a look at: https://github.com/calumy/zmk-config/blob/main/.github/workflows/main_update.yml.

nickcoutsos commented 1 year ago

Neat! I think I'd like to eventually implement a graphical export of sorts in the app but there are a lot of investigation to be done so it's really cool to see that workflow integrates so nicely.

Thanks for sharing that @calumy!

TheSast commented 1 year ago

It would be especially nice if there was an option to auto export the whole layout image (layers shown one after the other in one tall PNG) to the github repository housing the config

nickcoutsos commented 1 year ago

I think that's effectively what you'd get by using the github action for keymap-drawer. It generates a single SVG drawing each layer and adds it to a configurable path in your repo. I made an addition recently that will let it use a locally defined layout if available (for example, if its rendering config/lily58.keymap and it finds config/lily58.json it will pass that along to the drawing command).

If SVG isn't ideal you could look into utilities to convert SVG to PNG that could be run as part of the action.

nickcoutsos commented 1 year ago

I was thinking of keeping this issue open as I thought more about a version tailored to Keymap Editor (at the very least, rendering key bindings consistently with the app, but also combos and potentially other features) -- I likely wouldn't be able to start on it before finishing up my current work on the binding editor dialog so that all of the editing logic can be removed from the keybinding component.

But looking at the way people are using Keymap Drawer with customized stylesheets I think it's not worth trying to replicate that amount of functionality.

If anyone feels that there is still a case for this feel free to keep the discussion going; I still need input from people who use this app if I want to make features that people want.

nickcoutsos commented 1 year ago

I've started a discussion on this topic to get more input in one place.