Image to C-array on USB-Drive

EmbeddedImages

Working with LCD's, TFT's, e-Ink or USB-C HDMI outputs on Arduino, drags you into the world of C-array creation to prepare your image code in a proper way.Conversion tools online are a great help, for Images and Font, these are one of the best I found so far :

File to CArray from notisracLvgl Font converter - old version

So for standard opaque pictures this works fine, once you move to transparent images, using features like the STM32 ChromArt and the DMA2D features, you prefer to move to smaller code with Alpha-support like 16-bit ARGB1555, ARGB444 in stead, making "moving Sprites" possible... yes, the Commodore 64 times reviving :)

Other options for reduced size Fonts is to use A4 (4-bit Alpha) fonts, where the color is filled in by the DMA2D functions. This saves you lots of Code-space, and still have fonts with anti-alias features.

Image color formats.

Digging into the world of color formats, you need a bit more image conversion than you can find online, so I wrote this tool on an Arduino board with USB-drive support: drag your images to the USB-drive, run the code, and get the converted C-array code.If you are a bit handy, you can create your own loop() functions for your personal requirements, The code support BMP and PNG (Alpha) images, and supports the following color types as input:

// from "stm32h7xx_hal_dma2d.h" // for Video definitions _ addeed RB swapped inputs
#define COLORMODE_ARGB8888        0x00000000U  /*!< ARGB8888 color mode */
#define COLORMODE_RGB888          0x00000001U  /*!< RGB888 color mode   */
#define COLORMODE_RGB565          0x00000002U  /*!< RGB565 color mode   */
#define COLORMODE_ARGB1555        0x00000003U  /*!< ARGB1555 color mode */
#define COLORMODE_ARGB4444        0x00000004U  /*!< ARGB4444 color mode */ 
#define COLORMODE_ABGR8888        0x00000010U  /*!< ARGB8888 color mode RB swapped */
#define COLORMODE_BGR888          0x00000011U  /*!< RGB888 color mode  RB swapped  */
#define COLORMODE_BGR565          0x00000012U  /*!< RGB565 color mode  RB swapped  */
#define COLORMODE_ABGR1555        0x00000013U  /*!< ARGB1555 color mode  RB swapped*/
#define COLORMODE_ABGR4444        0x00000014U  /*!< ARGB4444 color mode RB swapped */
#define COLORMODE_XRGB8888        0x00000020U  /*!< ARGB8888 color mode alpha ignore*/
#define COLORMODE_XRGB1555        0x00000023U  /*!< ARGB1555 color mode alpha ignore*/
#define COLORMODE_XRGB4444        0x00000024U  /*!< ARGB4444 color mode alpha ignore*/
#define COLORMODE_XBGR8888        0x00000030U  /*!< ARGB8888 alpha ign RB swapped*/
#define COLORMODE_XBGR1555        0x00000033U  /*!< ABGR1555 alpha ign RB swapped*/
#define COLORMODE_XBGR4444        0x00000034U  /*!< ABGR4444 alpha ign RB swapped*/

Files are converted to the following outputs:

#define COLORMODE_ARGB8888        0x00000000U  /*!< ARGB8888 color mode */
#define COLORMODE_ARGB8888        0x00000000U  /*!< ARGB8888 color mode */
#define COLORMODE_ARGB1555        0x00000003U  /*!< ARGB1555 color mode */
#define COLORMODE_ARGB4444        0x00000004U  /*!< ARGB4444 color mode */
#define COLORMODE_RGB565          0x00000002U  /*!< RGB565 color mode   */

In General, for Opaque images (no Alpha) you use BMP (32 or 16 bits) as input, for Alpha-based images, you your PNG (32 bits true color) as input.

Coding

PNG and BMP's files are decoded int one large image array in 32-bit format. (uint32_t *IMAGERAW). This requires or a lot a RAM, or SDRAM.Example code uses SDRAM of the PortentaH7 board, and the Max dimensions are set to 480x320. Adapt for your proper usage.Once read into the Image buffer, a image structure h7image is prepared with all the required properties. this structure is used to call the conversion functions.

USB Writing

Writing to the USB drive is slow, small files < 64x64 takes less than a few seconds, but full images can take up to MINUTES (!) to be written.

C-Array's

Additional the tool supports to do C-array to C-array conversions, so you can add your c-array to one of the include files (screen.h / screen.cpp) and call the functions to do a conversion.Images are setup by a structure h7image, that combines all image features for the conversion:

typedef struct {
void *imagearray;             /// pointer to array
uint16_t width;               /// width
uint16_t height;              /// height
uint32_t colormode;           /// Alpha modes : COLORMODE_ARGB1555 , COLORMODE_ARGB4444 ,COLORMODE_ARGB8888 // Fixed color modes :  COLORMODE_RGB565
uint8_t bpp;                  /// bits per pixel => /8 bytes per pixel
uint16_t xpos;
uint16_t ypos;
char name[24];
char namea[24];             // array name in text -
char namesx[16];
char namesy[16];
} h7image;

Its not that complicated to adapt your image.

Extra: FontA4 Nibble switch

Using the DMS2D function for STM32, I figured out that the A4 color mode is swopping the upper and lower nibble of the code generated by LVGL.The FontA4 conversion feature works in the same type of Array-array conversion, and you can convert the A4 based fonts to a usable version.