Tutorial on Creating and Configuring the psplash Boot Animation for the OK3588-C Embedded Linux System
In the embedded Linux system of the RK3588 platform, the boot screen can not only enhance the user experience but also display brand logos or system status information. psplash is a lightweight boot screen program that can display static pictures or simple animations during system startup, providing intuitive feedback to users. This article will take the RK3588 as an example to introduce in detail how to create a boot animation from videos or pictures and configure psplash on the embedded device to achieve the display of a customized boot screen.
This method uses the psplash tool, which is a lightweight startup screen program commonly used in embedded Linux systems. Its main function is to display a graphical boot screen during system startup to provide user feedback, usually in the form of a brand logo or a progress bar.
Features:
- Lightweight: psplash is designed to be as small as possible to fit resource - constrained embedded devices.
- Graphical interface: It can display static images or simple animations, offering users a better visual experience during startup.
- Progress bar support: It can display a progress bar during the startup process to indicate the system loading status.
- Flexible configuration: Users can customize the boot image, progress bar color, display time, etc. through the configuration file.
The following is the operation method:
Picture Creation
Place the adapted files in the folder into the virtual machine for conversion.
Create a folder to save the project:
forlinx@ubuntu20:~$ mkdir -p psplash_logo/mp4_logo/
Then, put the video into the mp4_logo folder.
Download ffmpeg, which will be used later when processing the MP4 video:
forlinx@ubuntu20:~/psplash_logo/mp4_logo$ sudo apt-get update forlinx@ubuntu20:~/psplash_logo/mp4_logo$ sudo apt-get install ffmpeg
Create a new part0 folder to store the pictures that will be generated later:
forlinx@ubuntu20:~/psplash_logo/mp4_logo$ mkdir part0
Enter the following command for conversion:
forlinx@ubuntu20:~/psplash_logo/mp4_logo$ ffmpeg -i logo.mp4 -f image2 -r 7 part0/%04d.png
Now, take a look at the pictures in the part0 folder.
forlinx@ubuntu20:~/psplash_logo/mp4_logo$ ls part0/ 0001.png 0004.png 0007.png 0010.png 0013.png 0016.png 0019.png 0022.png 0025.png 0028.png 0031.png 0034.png 0037.png 0040.png 0043.png 0046.png 0049.png 0052.png 0002.png 0005.png 0008.png 0011.png 0014.png 0017.png 0020.png 0023.png 0026.png 0029.png 0032.png 0035.png 0038.png 0041.png 0044.png 0047.png 0050.png 0053.png 0003.png 0006.png 0009.png 0012.png 0015.png 0018.png 0021.png 0024.png 0027.png 0030.png 0033.png 0036.png 0039.png 0042.png 0045.png 0048.png 0051.png 0054.png
Convert Images to .h Files
Before converting to .h files, please check if the images match the screen resolution. When using psplash, the image resolution must be consistent with the screen resolution.
Use the following command:
forlinx@ubuntu20:~/psplash_logo/mp4_logo/part0$ file 0001.png 0001.png: PNG image data, 640 x 360, 8-bit/color RGB, non-interlaced
The current resolution is 640x360. Next, the conversion will be carried out.
Create a logo_h folder and inside it, create h, logo_1024x800, and master folders respectively:
forlinx@ubuntu20:~/psplash_logo$ mkdir logo_h forlinx@ubuntu20:~/psplash_logo/logo_h$ mkdir h logo_1280x800 master
Then, copy the previously generated PNG files into the master folder. The copying process is not demonstrated here.
Start resolution conversion after copy is complete:
Create the fix _ 1280x800.sh script in the master folder:
forlinx@ubuntu20:~/psplash_logo/logo_h/master$ vi fix_1280x800.sh
/*File content*/
#!/bin/bash
for img in *.png; do
convert "$img" -resize 1280x800! "../logo_1280x800/$img"
Done
Give executable permissions:
forlinx@ubuntu20:~/psplash_logo/logo_h/master$ chmod +x fix_1280x800.sh
After execution, the modified file is created at logo _ 1280x800.
forlinx@ubuntu20:~/psplash_logo/logo_h/logo_1280x800$ file 0001.png 0001.png: PNG image data, 1280 x 800, 8-bit/color RGB, non-interlaced
Create a make-image- header. sh in the h folder and give it executable permission:
forlinx@ubuntu20:~/psplash_logo/psplash/logo_test/fix_1024_800$ vi make-image-header.sh
/*File content*/
#!/bin/sh
# Specify the picture directory and name prefix
img_dir="$1"
name_prefix="$2"
# Check if the directory exists
if [ ! -d "$img_dir" ]; then
echo "Directory $img_dir does not exist"
exit 1
fi
i=0
# Traverse all PNG files in the directory
for img in "$img_dir"/*.png; do
# Check if the PNG file is found
if [ ! -e "$img" ]; then
echo "PNG file not found"
break
fi
imageh=`basename "$img" .png`-img.h
# name="${name_prefix}_${imageh}"
name="${name_prefix}_$(printf "%01d" "$i")_IMG"
# Generate C header file
gdk-pixbuf-csource --macros "$img" > "$imageh.tmp"
sed -e "s/MY_PIXBUF/${name}/g" -e "s/guint8/uint8/g" "$imageh.tmp" > "$imageh" && rm "$imageh.tmp"
i=$(expr $i + 1)
echo "generated as $imageh"
done
#./make-image-header.sh resized_images POKY Reference command
Execute script:
forlinx@ubuntu20:~/psplash_logo/psplash/logo_test/fix_1024_800$ ./make-image-header.sh resized_images POKY Generated as 0001-img.h Generated as 0002-img.h Generated as 0003-img.h Generated as 0004-img.h Generated as 0005-img.h Generated as 0006-img.h Generated as 0007-img.h Generated as 0008-img.h Generated as 0009-img.h Generated as 0010-img.h Generated as 0011-img.h Generated as 0012-img.h ... ... ...
Source code modification
Before modification, you need to copy the psplash source code to the psplash _ logo/folder. Please copy it by yourself.
The cross-compiler section of the Makefile is then modified first.
AUTOMAKE = ${SHELL} /home/wonhere/zhangqi/OMAP3530/psplash/missing --run automake-1.11
AWK = gawk
#CC = arm-none-linux-gnueabi-gcc
CC = /home/forlinx/aarch64-buildroot-linux-gnu_sdk-buildroot/bin/aarch64-linux-gcc
CCDEPMODE = depmode=gcc3
CFLAGS = -g -O2
CPP = arm-none-linux-gnueabi-gcc -E
Change the CC variable here to the cross-compiler used by your platform.
Create a logo folder, copy the *-img. h files just generated, and add references to the psplash. c file.
#include "logo/0001-img.h" #include "logo/0002-img.h" #include "logo/0003-img.h" 。。。 。。。 。。。 #include "logo/0047-img.h" #include "logo/0048-img.h" #include "logo/0049-img.h" #include "logo/0050-img.h" #include "logo/0051-img.h" #include "logo/0052-img.h" #include "logo/0053-img.h" #include "logo/0054-img.h"
Add a macro definition below to make it easier to write parameters later:
#define IMG_WIDTH(x) POKY_##x##_IMG_WIDTH #define IMG_HEIGHT(x) POKY_##x##_IMG_HEIGHT #define IMG_BYTES_PER_PIXEL(x) POKY_##x##_IMG_BYTES_PER_PIXEL #define IMG_RLE_PIXEL_DATA(x) POKY_##x##_IMG_RLE_PIXEL_DATA
Add the following to the main function:
/* Draw the Myir logo */
/* psplash_fb_draw_image (fb,
(fb->width - POKY_IMG_WIDTH)/2,
((fb->height * 5) / 6 - POKY_IMG_HEIGHT)/2,
POKY_IMG_WIDTH,
POKY_IMG_HEIGHT,
POKY_IMG_BYTES_PER_PIXEL,
POKY_IMG_RLE_PIXEL_DATA);
*/
psplash_fb_draw_image (fb, (fb->width - IMG_WIDTH(0))/2, (fb->height - IMG_HEIGHT(0))/2,IMG_WIDTH(0),IMG_HEIGHT(0),IMG_BYTES_PER_PIXEL(0),IMG_RLE_PIXEL_DATA(0));
usleep(50000);
。。。
。。。
。。。
psplash_fb_draw_image (fb, (fb->width - IMG_WIDTH(0))/2, (fb->height - IMG_HEIGHT(0))/2,IMG_WIDTH(0),IMG_HEIGHT(0),IMG_BYTES_PER_PIXEL(0),IMG_RLE_PIXEL_DATA(50));
usleep(50000);
psplash_fb_draw_image (fb, (fb->width - IMG_WIDTH(0))/2, (fb->height - IMG_HEIGHT(0))/2,IMG_WIDTH(0),IMG_HEIGHT(0),IMG_BYTES_PER_PIXEL(0),IMG_RLE_PIXEL_DATA(51));
usleep(50000);
psplash_fb_draw_image (fb, (fb->width - IMG_WIDTH(0))/2, (fb->height - IMG_HEIGHT(0))/2,IMG_WIDTH(0),IMG_HEIGHT(0),IMG_BYTES_PER_PIXEL(0),IMG_RLE_PIXEL_DATA(52));
usleep(50000);
psplash_fb_draw_image (fb, (fb->width - IMG_WIDTH(0))/2, (fb->height - IMG_HEIGHT(0))/2,IMG_WIDTH(0),IMG_HEIGHT(0),IMG_BYTES_PER_PIXEL(0),IMG_RLE_PIXEL_DATA(53));
usleep(50000);
Here are IMG_WIDTH for width, IMG_HEIGHT for height, IMG_BYTES_PER_PIXEL for pixel format, and IMG_RLE_PIXEL_DATA for image data.
Since the width, height, and pixel format are the same, the same parameters are used. Only the parameter of IMG_RLE_PIXEL_DATA (image data) is modified.
Finally, directly execute make. After execution, the psplash and psplash - write files will be generated and need to be copied to the /usr/bin/ directory of the board.
Linux System Configuration
Linux System Configuration
root@ok3588:/etc/init.d# cat S50weston_paplash
/*Script content*/
#!/bin/sh
### BEGIN INIT INFO
# Provides: psplash
# Required-Start:
# Required-Stop:
# Default-Start: S
# Default-Stop:
### END INIT INFO
/etc/init.d/S49weston stop
case "$1" in
start)
echo "Starting psplash..."
export TMPDIR=/mnt/.psplash
mkdir -p $TMPDIR
mount tmpfs -t tmpfs $TMPDIR -o,size=2M
rotation=0
if [ -e /etc/rotation ]; then
read rotation < /etc/rotation fi /usr/bin/psplash --angle $rotation & ;; stop) echo "Stopping psplash..." killall psplash umount $TMPDIR rmdir $TMPDIR ;; *) echo "Usage: \$0 {start|stop}" exit 1 ;; esac sleep 5 pkill psplash /etc/init.d/S49weston start /etc/init.d/S51matrix-browser start exit 0
Configure executable permissions. It should also be noted that the sleep 5 here needs to be configured according to the actual playback time. It is recommended to display a black-background image at the end of the playback to prevent seeing the underlying dynamic logo image when shutting down.
Verification of the Effect
After the configuration is completed, simply restart the system.
With the method introduced in this article, a startup animation can be easily created and displayed on the RK3588 embedded Linux system. The entire process includes decomposing a video into images, adjusting the resolution, generating a C header file, modifying the source code, compiling, and configuring the system startup script. Mastering this process not only enhances the visual effect during system startup but also facilitates brand presentation and user experience optimization. After completing the configuration, restart the RK3588 device to verify the effect and ensure that the custom animation is displayed smoothly.
