From 3d45fc89fc8a128e473758cd37fb76d3ba2d0d0b Mon Sep 17 00:00:00 2001
From: nedko <nedko@internedko.net>
Date: Mon, 15 Dec 2025 14:49:33 +0200
Subject: [PATCH] Added more info in README. Updated comments

---
 README.md            | 32 ++++++++++++++++++++++++--------
 Widgets/Widget.h     |  1 +
 Widgets/WidgetRect.h |  1 +
 Widgets/WidgetText.h |  1 +
 4 files changed, 27 insertions(+), 8 deletions(-)

diff --git a/README.md b/README.md
index c915b3d..0f1eea6 100644
--- a/README.md
+++ b/README.md
@@ -1,22 +1,38 @@
 # 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
+# How to build
+**NOTE: Tested on Ubuntu 24.04.**
 
-# ImageMagick commands
+You will need the following packages: `build-essential` `libsdl2-dev` `libsdl2-image-dev` `libsdl2-ttf-dev` `imagemagick`
+
+Just run `make` and an executable called `trmnl_sdl` should be produced.
+
+# How to use
+1. You will need to write a JSON config file.
+It can either be named `config.json` or you will need to pass it as the first command line parameter to the executable.
+An example structure of the config file can be found in `config_example.json`.
+You can find more info on the available Widgets and their parameters at the end of this file.
+2. Run the executable
+3. Convert the image to a suitable format via an ImageMagick command from below.
+
+# ImageMagick commands to prepare image for TRMNL device
 ### 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`
 
+### Resize image to fit with dithering
+`convert image.png -resize 800x480 -background white -compose Copy -gravity center -extent 800x480 -dither FloydSteinberg -remap pattern:gray50 -depth 1 -strip png:output.png`
+
+# 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. Rebuild the executable.
+
 # Notes
-json.hpp from nlohmann/json v3.11.2
+json.hpp from [nlohmann/json](https://github.com/nlohmann/json) v3.11.2
 
 # List of special types
 ### color
diff --git a/Widgets/Widget.h b/Widgets/Widget.h
index 6b7b964..36eada8 100644
--- a/Widgets/Widget.h
+++ b/Widgets/Widget.h
@@ -5,6 +5,7 @@
 #include "../json.hpp"
 #include <memory>
 
+// Base Widget class for the whole Widget system
 class Widget
 {
 protected:
diff --git a/Widgets/WidgetRect.h b/Widgets/WidgetRect.h
index b69ab97..bfd45ee 100644
--- a/Widgets/WidgetRect.h
+++ b/Widgets/WidgetRect.h
@@ -3,6 +3,7 @@
 
 #include "Widget.h"
 
+// Renders a rectangle with optional rounded corners using either fill or internal stroke
 class WidgetRect : public Widget
 {
 protected:
diff --git a/Widgets/WidgetText.h b/Widgets/WidgetText.h
index bd8394f..b7ab8b4 100644
--- a/Widgets/WidgetText.h
+++ b/Widgets/WidgetText.h
@@ -8,6 +8,7 @@
 
 #include "../sdl_helpers.h"
 
+// Renders text within a specified box
 class WidgetText : public Widget
 {
 protected: