trmnl_sdl/README.md

3.9 KiB

What is this

A utility which can be used to create custom images for TRMNL devices via code

How to write new visual stuff

  1. Inherit from Widget and then do your magic inside your own class.
  2. Add your widget builder in main.cpp inside init_builders.
  3. Write your config file. Either named config.json or added as the first command line parameter.
  4. ???
  5. Profit

ImageMagick commands

Convert image without dithering

convert trmnl.png -monochrome -colors 2 -depth 1 -strip png:output.png

Convert image with dithering

convert trmnl.png -dither FloydSteinberg -remap pattern:gray50 -depth 1 -strip png:output.png

Notes

json.hpp from nlohmann/json v3.11.2

List of special types

TextFit

Controls automatic change the text size depending on contents. String type. Has several options:

  • none - Text is not changed in any way
  • shrink - Renders text with desired size and shrinks it to fit if contents are too large
  • auto - Renders text with desired size and enlarges/shrinks it to fit if contents are too small/large

HAlign

Controls horizontal alignment of elements. String type. Has several options:

  • left - Align objects to the left
  • center - Align objects to be centered
  • right - Align objects to the right

HAlign

Controls vertical alignment of elements. String type. Has several options:

  • top - Align objects to the top
  • center - Align objects to be centered
  • bottom - Align objects to the bottom

color

  • Object type
  • Components - Red, Green, Blue, Alpha
  • Each component ranges 0-255
  • When Alpha is 255 - the color is fully opaque. When it is 0 - fully transparent.
  • Has the structure shown below:
"color": {
	"r": 0,
	"g": 0,
	"b": 0,
	"a": 255
}

NOTE: If only some components are present in the config then only the present ones are overwritten from the default.

List of Widgets and their parameters

text

Renders text within a specified box

Name Type Required Default Description
x int 0 Horizontal position in pixels (from left to right)
y int 0 Vertical position in pixels (from top to bottom)
width int REQ Max width in pixels
height int REQ Max height in pixels
text string The text to be shown
fit TextFit none Controls automatic change the text size depending on contents
should_wrap boolean false Whether the text should automatically wrap
halign HAlign center Horizontal alignment of text
valign VAlign center Vertical alignment of text
halign_via_visible boolean true Whether to use visible pixels of the text for horizontal alignment. If false - uses text renderer hints
valign_via_visible boolean true Whether to use visible pixels of the text for vertical alignment. If false - uses text renderer hints
color color 0, 0, 0, 255 (BLACK) Color to use for text rendering
size int REQ Desired size of the text to use
font string Global font key Font file to use when rendering the text

rect

Renders a rectangle with optional rounded corners using either fill or internal stroke.

Name Type Required Default Description
x int 0 Horizontal position in pixels (from left to right)
y int 0 Vertical position in pixels (from top to bottom)
width int REQ Width in pixels
height int REQ Height in pixels
radius int 0 Corner rounding radius in pixels
stroke int -1 Internal stroke size in pixels. If <= 0 then the rectangle will be filled with the desired color
color color 0, 0, 0, 255 (BLACK) Color to use for rectangle