Skip to content

Creating Custom (LCD) Themes

Timo Kokkonen edited this page Mar 25, 2023 · 7 revisions

FanPico supports creating custom themes for the LCD screen (starting from firmware version 1.4.0).

How Themes Work

A theme for FanPico consists of background image and description of fields to be drawn on top of the background image. Fields on the screen are either static labels (fan names, sensor names, etc..) that are drawn once and active fields that update continuously (RPM values, PWM percentage, etc..).

For each field to be displayed on the screen following attributes are needed:

  • Field type (FAN, MBFAN, SENSOR, UPTIME, TIME, DATE, DATE_TIME, IP, MODEL, VERSION, ...)
  • Field data type (LABEL, RPM, PWM, TEMP, OTHER)
  • Screen coordinates (x and y) for the field
  • Foreground color (RGB565 value)
  • Background color (RGB565 value)
  • Font type (FONT_6x8, FONT_8x8, FONT_12x16, FONT_16x16, FONT_16x32)

Examples of the theme descriptions can be found in (.h files) under directory: src/themes/

Background Image

Background image is either in 320x240 or 480x320 resolution image. Image must be a 8-bit BMP (Windows Bitmap) file (ideally with RLE compression to save firmware file space).

Example Backgrounds

Here are the current default theme backgrounds (themes are different between 320x240 and 480x320 resolution at the moment):

320x240 resolution:

320x240 default theme

480x320 resolution:

480x320 default theme

Creating a Custom Theme

To create a custom theme, it may be best to start from an existing theme like the "default" theme.

Create header files for the theme

First make copies of the default theme header files:

$ cd src/themes
$ cp default-320x240.h custom-320x240.h
$ cp default-480x320.h custom-480x320.h

Next edit the .h files and replace all occurrence of _default_ with _custom_

Create background images:

Next create background images for the theme and place them in the same directory (src/themes):

custom-320x240.bmp
custom-480x320.bmp

Files should be either 4bit (16 color) or 8bit (256 color) Windows Bitmap (.bmp) files.

Compile Firmware With The Custom Theme

Next we need to set compile option FANPICO_CUSTOM_THEME=1 to include our custom theme in the firmware.

We compile firmware as normal except we add DFANPICO_CUSTOM_THEME option to parameters for cmake command:

$ mkdir build
$ cd build
$ cmake -DFANPICO_BOARD=0804D -DPICO_BOARD=pico_w -DFANPICO_CUSTOM_THEME=1 ..
$ make -j

Activating Custom Theme

After firmware with custom theme is installed on a FanPico unit, it can be enabled using SYS:DISP:THEME command.

For example:

SYS:DISP:THEME custom
CONF:SAVE
*RST

Designing Background Graphics

It may be helpful to use your favorite graphics editor to design the background image, and then export it at the desired resolution (as PNG, etc) and then convert down to BMP image (when converting PNG to BMP make sure to use custom palette to avoid dithering if possible...)

Default Theme was first designed in Inkscape, by placing placeholders for the data fields on separate layer so its easy toggle those on/off to validate layout is correct. Theme was then exported from Inkscape to .png image that was then converted to indexed 256 color image that was saved as BMP.

Inkscape (SVG) files can be found under: src/themes/

Contributing Themes to FanPico

FanPico is desperately in need of more themes (and/or updated default themes). If you create a theme, please consider submitting it to FanPico so it can be included in the default firmware release.

Please Note that themes that contain copyrighted images (or trademarked logos, etc.) probably cannot be included in the standard firmware releases (unless there is written permission from the copyright holder, etc...)