Embedded Software - Custom splash screen Yocto a white loading bar with black text

Yocto Raspberry Pi

Custom Splash Screen with Progress Bar

Prepare splash screen image

Splash screen is handled by a recipe called "psplash" found under "/workdir/poky-honister/meta-raspberrypi/recipes-core" directory of the source tree.

Since "psplash" expects an image to be in header file format, first you need to convert your image into a header file format by using a script called "make-image-header.sh".

Clone psplash repository

To get the script, clone the yoctoproject psplash repository - in this case to the /workdir directory

git clone https://git.yoctoproject.org/psplash

In the psplash directory you'll find the script "make-image-header.sh".

Install library

The script needs "libgdk-pixbuf2.0-dev" to be installed in the system. You can do this in a second terminal window with:

docker exec -it --user=root crops-poky bash
apt-get install libgdk-pixbuf2.0-dev
exit

Now you can use the script to convert your png file to .h-file

./make-image-header.sh <path-to-png>/psplash-ixlogo.png POKY

As result, you should get a file named "psplash-ixlogo-img.h". The header looks like:

/* GdkPixbuf RGBA C-Source image dump 1-byte-run-length-encoded */

#define POKY_IMG_ROWSTRIDE (4080)
#define POKY_IMG_WIDTH (1020)
#define POKY_IMG_HEIGHT (768)
#define POKY_IMG_BYTES_PER_PIXEL (4) /* 3:RGB, 4:RGBA */
#define POKY_IMG_RLE_PIXEL_DATA ((uint8*) \
...

If you want to change the background color of the splash screen, you can add the following line:

#define PSPLASH_BACKGROUND_COLOR 0x07,0x85,0x00

This sets the background color to a green.

Create custom meta layer

To include the created splash screen image, we need a custom meta layer.

First source to rpi-build.

source poky-honister/oe-init-build-env rpi-build

With "bitbake-layers" we create a new meta layer and add this meta layer to the conf/bblayers.conf of the current project.

bitbake-layers create-layer meta-interelectronix-rpi
bitbake-layers add-layer meta-interelectronix-rpi

After this copy the directory "psplash" from meta-raspberrypi/recipes-core to the new meta-layer:

mkdir meta-interelectronix-rpi/recipes-core
cp -r /workdir/poky-honister/meta-raspberrypi/recipes-core/psplash meta-interelectronix-rpi/recipes-core/

Copy psplash-ixlogo-img.h to meta-interelectronix-rpi/recipes-core/psplash/files/

cp <path-to-h-file>/psplash-ixlogo-img.h meta-interelectronix-rpi/recipes-core/psplash/files/

Finally edit "meta-interelectronix-rpi/recipes-core/psplash/psplash_%.bbappend" and change "psplash-raspberrypi-img.h" to "psplash-ixlogo-img.h".

Include psplash

In the last step, the psplash package must be added to the local.conf file of the project. To do this, edit the file /workdir/rpi-build/conf/local.conf

My local.conf looks like:

## systemd settings
DISTRO_FEATURES:append = " systemd"
VIRTUAL-RUNTIME:init_manager = "systemd"
VIRTUAL-RUNTIME:initscripts = ""
IMX_DEFAULT_DISTRO_FEATURES:append = " systemd"

## enable some hardware
ENABLE_I2C = "1"
ENABLE_UART = "1"
DISABLE_SPLASH = "1"
DISABLE_RPI_BOOT_LOGO = "1"

IMAGE_INSTALL:append = " psplash"
IMAGE_FEATURES += " splash "

Copyright License

Copyright © 2022 Interelectronix e.K.
This Project source code is licensed under the GPL-3.0 license.