STM32 - EMWIN PNG image display (25)

EMWI

foreword

The PNG format is an image format that aims to replace the GIF and TIFF file formats, while adding some features that the GIF file format doesn't have. When PNG is used to store grayscale images, the depth of grayscale images can be up to 16 bits, and when storing color images, the depth of color images can be up to 48 bits, and it can also store up to 16 bits of alpha channel data. emWin supports PNG decoding

1. RAM usage

PNG decompression requires approximately 21 Kb of RAM for image size independent decompression and size dependent bytes.
The RAM requirement can be calculated as follows:
Approximate RAM requirement = (X-Size + 1) * Y size * 4 + 21Kbytes.
Here we allocate 500k external SRAM memory to emWin, open GUIConf.c, the red box in the figure is the memory size allocated for emWin.

2. PNG file API function

GUI_PNG_Draw() 绘制已加载到存储器的 PNG 文件。
GUI_PNG_DrawEx() 绘制无需加载到存储器的 PNG 文件。
GUI_PNG_GetXSize() 返回加载到存储器的位图的 X 大小
GUI_PNG_GetXSizeEx() 返回无需加载到存储器的位图的 X 大小。
GUI_PNG_GetYSize() 返回加载到存储器的位图的 Y 大小。
GUI_PNG_GetYSizeEx() 返回无需加载到存储器的位图的 Y 大小。

3. Experimental demonstration

#include "pngdisplay.h"
#include "EmWinHZFont.h"
#include "GUI.h"
#include "malloc.h"
#include "ff.h"
#include "ili93xx.h"
#if SYSTEM_SUPPORT_UCOS
#include "includes.h" //ucos 使用 
#endif
static FIL PNGFile;
static int PngGetData(void * p, const U8 ** ppData, unsigned NumBytesReq, U32 Off) 
{
    
    
static int readaddress=0;
FIL * phFile;
U8 *pData;
UINT NumBytesRead;
#if SYSTEM_SUPPORT_UCOS
OS_CPU_SR cpu_sr;
#endif
pData = (U8*)*ppData;
phFile = (FIL *)p;
//移动指针到应该读取的位置
if(Off == 1) readaddress = 0;
else readaddress=Off;
#if SYSTEM_SUPPORT_UCOS
OS_ENTER_CRITICAL(); //临界区
#endif
f_lseek(phFile,readaddress); 
//读取数据到缓冲区中
f_read(phFile,pData,NumBytesReq,&NumBytesRead);
#if SYSTEM_SUPPORT_UCOS
OS_EXIT_CRITICAL(); //退出临界区
#endif
return NumBytesRead;//返回读取到的字节数
}
//在指定位置显示加载到 RAM 中的 PNG 图片(PNG 图片不能缩放！)
//PNGFileName:图片在 SD 卡或者其他存储设备中的路径(需文件系统支持！)
//mode:显示模式
// 0 在指定位置显示，有参数 x,y 确定显示位置
// 1 在 LCD 中间显示图片，当选择此模式的时候参数 x,y 无效。
//x:图片左上角在 LCD 中的 x 轴位置(当参数 mode 为 1 时，此参数无效)
//y:图片左上角在 LCD 中的 y 轴位置(当参数 mode 为 1 时，此参数无效)
//返回值:0 显示正常,其他 失败
int displaypng(char *PNGFileName,u8 mode,u32 x,u32 y)
{
    
    
GUI_HMEM PNGMem;
u16 bread;
char *pngbuffer;
char result;
int XSize,YSize;
#if SYSTEM_SUPPORT_UCOS
OS_CPU_SR cpu_sr;
#endif
result = f_open(&PNGFile,(const TCHAR*)PNGFileName,FA_READ); //打开文件
//文件打开错误或者文件大于 JPEGMEMORYSIZE
if((result != FR_OK) || (PNGFile.fsize>PNGMEMORYSIZE)) return 1;
pngbuffer=mymalloc(SRAMEX,PNGFile.fsize);
if(pngbuffer == NULL) return 2;
#if SYSTEM_SUPPORT_UCOS
OS_ENTER_CRITICAL(); //临界区
#endif
result = f_read(&PNGFile,pngbuffer,PNGFile.fsize,(UINT *)&bread); //读取数据
if(result != FR_OK) return 3;
#if SYSTEM_SUPPORT_UCOS
OS_EXIT_CRITICAL(); //退出临界区
#endif
XSize = GUI_PNG_GetXSize(pngbuffer,PNGFile.fsize); //获取 PNG 图片的 X 轴大小
YSize = GUI_PNG_GetYSize(pngbuffer,PNGFile.fsize); //获取 PNG 图片的 Y 轴大小
switch(mode)
{
    
    
case 0: //在指定位置显示图片
GUI_PNG_Draw(pngbuffer,PNGFile.fsize,x,y);//显示 PNG 图片
break;
case 1: //在 LCD 中间显示图片
GUI_PNG_Draw(pngbuffer,PNGFile.fsize,(lcddev.width-XSize)/2-1,\
(lcddev.height-YSize)/2-1);
break;
}
f_close(&PNGFile); //关闭 PNGFile 文件
myfree(SRAMEX,pngbuffer);
return 0;
}
//在指定位置显示无需加载到 RAM 中的 PNG 图片(需文件系统支持！对于小 RAM，推荐使用
此方法！PNG 图片不能缩放！)
//PNGFileName:图片在 SD 卡或者其他存储设备中的路径
//mode:显示模式
// 0 在指定位置显示，有参数 x,y 确定显示位置
// 1 在 LCD 中间显示图片，当选择此模式的时候参数 x,y 无效。
//x:图片左上角在 LCD 中的 x 轴位置(当参数 mode 为 1 时，此参数无效)
//y:图片左上角在 LCD 中的 y 轴位置(当参数 mode 为 1 时，此参数无效)
//返回值:0 显示正常,其他 失败
int displaypngex(char *PNGFileName,u8 mode,u32 x,u32 y)
{
    
    
char result;
int XSize,YSize;
result = f_open(&PNGFile,(const TCHAR*)PNGFileName,FA_READ); //打开文件
//文件打开错误
if(result != FR_OK) return 1;
XSize = GUI_PNG_GetXSizeEx(PngGetData,&PNGFile);//PNG 图片 X 大小
YSize = GUI_PNG_GetYSizeEx(PngGetData,&PNGFile);//PNG 图片 Y 大小
switch(mode)
{
    
    
case 0: //在指定位置显示图片
GUI_PNG_DrawEx(PngGetData,&PNGFile,x,y);
break;
case 1: //在 LCD 中间显示图片
GUI_PNG_DrawEx(PngGetData,&PNGFile,(lcddev.width-XSize)/2-1,\
(lcddev.height-YSize)/2-1);
break;
}f_close(&PNGFile); //关闭 PNGFile 文件
return 0;
}
//PNG 图片显示例程
void pngdisplay_demo(void)
{
    
    
GUI_SetBkColor(GUI_BLUE);
GUI_SetFont(&GUI_FontHZ16);
GUI_SetColor(GUI_RED);
GUI_Clear();
while(1)
{
    
    
GUI_DispStringHCenterAt("在指定位置显示一张加载到 RAM 中的 PNG 图片",400,0);
displaypng("0:/PICTURE/PNG/皇冠.png",0,200,100);
GUI_Delay(1000);
GUI_Clear();
displaypng("0:/PICTURE/PNG/CS.png",1,0,0);
GUI_Delay(1000);
GUI_Clear();
displaypng("0:/PICTURE/PNG/香蕉.png",1,0,0);
GUI_Delay(1000);
GUI_Clear();
GUI_DispStringHCenterAt("在指定位置显示一张无需加载的 PNG 图片",400,0);
displaypngex("0:/PICTURE/PNG/驴.png",0,200,100);
GUI_Delay(1000);
GUI_Clear();
displaypngex("0:/PICTURE/PNG/文件夹.png",1,0,0);
GUI_Delay(1000);
GUI_Clear();
displaypngex("0:/PICTURE/PNG/风扇.png",1,0,0);
GUI_Delay(1000);
GUI_Clear();
} }

PngGetData () 从外部存储器获取 PNG 文件数据
displaypng ()将 PNG 图片加载到 RAM 中，并显示到 LCD 上，显示速度快，但是需要大量的 RAM。
displaypngex () 不需要将 PNG 加载到 RAM 中，显示速度慢，但是不需要大量的 RAM。

The function PngGetData () is used to obtain PNG image data from external storage, and is passed as a parameter to the two functions GUI_PNG_DrawEx () and GUI_PNG_GetXSizeEx() when the function displaypngex () displays the PNG image. The function displaypng () is used to display the PNG image. This function first loads all the data of the PNG image into the RAM, and then calls the corresponding function in EMWIN to display the PNG image loaded into the RAM on the LCD. Loaded into RAM, so requires a lot of RAM, but the display is fast! This function can set the position of the PNG image to be displayed.
The function displaypngex () also displays PNG images. Different from the function displaypng (), displaypngex () does not need to load PNG images into RAM, and can directly read GIF images from external memory and display them. This method requires The RAM is small, but the speed is slower than displaypng (). This function can also set the position of the PNG image to be displayed.