实现原理

emWin的PNG显示原理是用户程序调用GUI_PNG_Draw()绘制函数来解码和显示，并且是只在调用以后才开始解码，这就导致一些高性能的MCU在显示大量小尺寸PNG时出现卡顿、掉帧等等现象。

如果开始显示之前就把整个文件全部解码完，显示的时候只显示解码后的图像，就能显著改善PNG图的显示速度，利用emWin的内存设备可以实现这个功能。

具体实现原理：

把整个PNG源文件加载到RAM中
获取PNG源文件的大小、分辨率
创建大小等于分辨率的内存设备，并把PNG绘制到对应的内存设备中，绘制完毕后删除存放在RAM中的PNG源文件
将内存设备中的内容复制写入显存
如果PNG图不再使用，则删除所有内存设备

由于解码过程在绘制到内存设备之后就已经完成了，真正显示到LCD上的时候就可以非常快。

源码

/* 图片数据结构体定义 */
typedef struct {WM_HMEM hMEM;    /* emwin动态内存句柄 */GUI_MEMDEV_Handle hMEMDEV;/* 内存设备句柄 */uint32_t size;   /* 图片文件体积 */uint32_t x_size; /* 图片宽度 */uint32_t y_size; /* 图片高度 */char *buffer;    /* 数据缓冲区 */
}ImageDataTypeDef;/*** @brief 加载PNG图片到内存中并绘制* @note 使用内存设备加速* @param sFilename：需要加载的图片名，带绝对路径* @param ImageDataTypeDef：图片数据结构体* @retval result：返回文件读写状态*/
uint8_t ShowPNG_UseMemdev(const char *sFilename, ImageDataTypeDef *image)
{UINT    f_num;FATFS   fs;                              /* FatFs文件系统对象 */FIL     file;                          /* file objects */FRESULT result; DIR     dir;GUI_MEMDEV_Handle hMempng;/* 进入临界段 */taskENTER_CRITICAL();/* 打开图片 */result = f_open(&file, sFilename, FA_READ);if (result != FR_OK){printf("打开失败！文件名：%s \r\n", sFilename);image->buffer[0]='\0';}/* 退出临界段 */taskEXIT_CRITICAL();/* 申请一块动态内存空间 */image->hMEM = GUI_ALLOC_AllocZero(file.fsize);/* 转换动态内存的句柄为指针 */image->buffer = GUI_ALLOC_h2p(image->hMEM);/* 进入临界段 */taskENTER_CRITICAL();/* 读取图片数据到动态内存中 */result = f_read(&file, image->buffer, file.fsize, &f_num);if (result != FR_OK){printf("读取失败！文件名：%s \r\n", sFilename);}f_close(&file);/* 退出临界段 */taskEXIT_CRITICAL();/* 获取文件大小 */image->size = file.fsize;/* 获取图片宽高 */image->x_size = GUI_PNG_GetXSize(image->buffer, image->size);image->y_size = GUI_PNG_GetYSize(image->buffer, image->size);if(result == FR_OK){/* 创建内存设备，并写入数据 */hMempng = GUI_MEMDEV_CreateFixed(0, 0, image->x_size,image->y_size,GUI_MEMDEV_HASTRANS, GUI_MEMDEV_APILIST_32, GUICC_M8888I);GUI_MEMDEV_Select(hMempng);GUI_PNG_Draw(image->buffer, image->size, 0, 0);GUI_MEMDEV_Select(0);image->hMEMDEV = hMempng;}else{image->buffer = 0;image->size = 0;image->hMEM = 0;image->hMEMDEV = 0;}/* 释放源文件缓存区 */GUI_ALLOC_Free(image->hMEM);/* 返回状态 */return result;/* 如果图片长时间使用，请勿释放内存设备 */
}

上面的源码是把PNG图绘制到内存设备中，需要显示的时候调用函数GUI_MEMDEV_WriteAt即可把内容复制到LCD上。

关于内存设备加速PNG图片有个非常重要的点需要注意，由于PNG图带有透明通道，请务必使用GUI_MEMDEV_CreateFixed创建内存设备，参数必须如上述代码中的那样，否则PNG图会显示错误甚至一片黑。

因为大部分情况下使用的内存设备创建函数是GUI_MEMDEV_Create，它会创建一个默认参数的内存设备，默认颜色格式是16bit RGB565并且不包含独立的透明通道，所以PNG图可能会显示出错。

测试

平台信息

测试硬件：野火 STM32H743 Pro 开发板
测试软件：野火emWin例程：PNG图片显示
软件平台：Keil5 V5.33

测试图片参数

总共21张PNG图

测试效果

每个png图之间延时30ms，要是没延时的话快到根本看不清。<(￣︶￣)>

参考资料

emWin V6.14 官方文档（UM03001_emWin）

[emWin]利用内存设备加速PNG图片显示——2021.03相关推荐

[emWin]利用内存设备加速GIF图片显示——2021.03
本文为作者原创,如需转载请在醒目位置标明原始出处,并提供可访问的超链接. 效果实现原理 emWin的GIF显示原理是用户程序调用GUI_GIF_DrawSub()绘制函数一帧一帧的解码和显示,并且每 ...
android动态图片适配,Android适配利用webview加载后图片显示过大的问题解决
前言最近在开发过程中,需要用webview控件来展示文章的详情页面,流程是通过请求后台数据,然后用控件加载,而后台返回的文章详情页面是直接网页端使用的,并没有对移动端进行适配,导致webview加载 ...
STM32——EMWIN PNG 图片显示（二十五）
EMWIN 文章目录 EMWIN 前言一.RAM 使用二.PNG 文件 API 函数三.实验演示前言 PNG 格式是一种图像格式,其目的是试图替代 GIF 和 TIFF 文件格式,同时增加一些 ...
Facebook iOS 应用是如何加速图片显示的？
本文讲的是Facebook iOS 应用是如何加速图片显示的?, 你的Facebook的动态消息中充满着一些关于你朋友.家人以及你所爱的人的照片,也许你会想要在手机上也能重温那些场景.我们一直在寻找提 ...
php 怎么支持中文图片显示,利用php怎么实现一个给图片添加中文水印的功能
利用php怎么实现一个给图片添加中文水印的功能发布时间:2021-01-21 15:13:48 来源:亿速云阅读:88 作者:Leah 这篇文章给大家介绍利用php怎么实现一个给图片添加中文水印的 ...
emwin读取sd图片_第12章emwin(ucgui)jpeg图片显示.pdf
您所在位置:网站首页 > 海量文档 &nbsp>&nbsp计算机&nbsp>&nbspwindows相关第12章emwin(ucgui)jpeg图片 ...
图片的分辨率大于设备分辨率或者小于设备的分辨率的显示问题
做程序开发,尤其是手机app开发,经常接触到图片的处理,有时服务器获取的图片大于自己本地要显示的大小(自己限制的),有时要小于,但是设备怎么显示我一直有个疑问,那就是如果图片的分辨率大于设备的分辨率而 ...
linux内存加速硬盘缓存,linux块设备加速缓存之bcache
linux块设备加速缓存之bcache 什么是bcache 转载请注明出处:http://blog.csdn.net/liumangxiong bcache是linux内核块层cache.它使用类似S ...
解决 .webp 格式图片在 ios 设备上无法正常显示的问题
解决.webp 格式图片在 ios 设备上无法正常显示的问题使用字符串的 replace() 方法,将 webp 的后缀名替换为 jpg 的后缀名 // 定义请求商品详情数据的方法 async ge ...

[emWin]利用内存设备加速PNG图片显示——2021.03