STM32显示图片_Image2Lcd步骤图解

本示例STM32代码下载:
https://download.csdn.net/download/qq_49053936/88433952


最终效果:

STM32显示图片_Image2Lcd步骤图解_第1张图片


一、图片调整像素大小

为什么要调整图片的大小?

单片机资源很有限,另外为了显示时操作更简单,不用再二次缩放,

因此,需要先将图片处理,把其大小调整成<=显示屏像素。

1-1、电脑上,选中要显示的图片,右击>编辑>画图。

如果弹出的菜单中,没有”画图”一项,自行百度安装画图软件,或者使用phostshop等软件。

STM32显示图片_Image2Lcd步骤图解_第2张图片

1-2、在画图软件中,选择重新调整大小

STM32显示图片_Image2Lcd步骤图解_第3张图片

1-3、调置成需要显示的像素大小,设置条件,像素必须等于或小于目标显示屏像素

STM32显示图片_Image2Lcd步骤图解_第4张图片

1-4、文件>另存为>JPEG图片,  位置、文件名,随意。

STM32显示图片_Image2Lcd步骤图解_第5张图片


二、使用Image2Lcd 转换

上面那个”画图”软件是系统自带的,但这个Image2Lcd不是,得另行安装、注册。

不要问Image2Lcd在哪里下载、能不能发一份、怎么破解!!

你若问了,只能回一句:请支持正版软件。

2-1  打开Image2Lcd

STM32显示图片_Image2Lcd步骤图解_第6张图片

2-2  打开刚才的调整好像素的图片,设置下面的参数

STM32显示图片_Image2Lcd步骤图解_第7张图片

2-3  点击软件左上角的“保存”工具,设置文件名,点击“保存”按钮,将生成一个数组文件。

注意1:这个名称将会是数组名称的尾辍。保存后也可以自行修改的。

STM32显示图片_Image2Lcd步骤图解_第8张图片

2-4  打开数组文件,全选、复制。

STM32显示图片_Image2Lcd步骤图解_第9张图片


三、STM32代码

打开STM32的工程。

注意,这个工程,是已调试好显示功能的工程。

这里只展示图片显示方面的参考操作图解,其它部分,自行解决。

3-1  打开要存放图片数组的文件.

在示例中,我们以font.h为例 。

打开bsp_LCD_ILI9341.c, 到来文件顶部,右击font.h > Open document

STM32显示图片_Image2Lcd步骤图解_第10张图片

3-2  在文件中, 粘贴步骤2-4复制的数据。

注意:为了方便日后查看,建议增加注释,不然,过了几天,鬼知道这堆数组是啥。

注意:为了调试方便,增加一行#if预编译,当不使用时可以设置为0,减少代码体积。

如下图,在上述操作后,在增加的#if 和#endif 两行中粘贴数组。

STM32显示图片_Image2Lcd步骤图解_第11张图片

3-3  粘贴后,就是下面的样子,复制下面这一行。

STM32显示图片_Image2Lcd步骤图解_第12张图片

3-4  在要调用显示图片函数的文件中,添加下面如45行的声明:

注意:不要声明在函数内!原因:局部变量、自行百度堆、栈的分别和设置。

注意:下图的45行声明,是上图中那一行增加了extern作修饰,表示数组在其它文件定义。

STM32显示图片_Image2Lcd步骤图解_第13张图片

3-5  调用显示函数

注意:需要先调用初始化函数,如第72行

注意:LCD_Image( )函数的参数是:屏坐标X、屏坐标Y、图宽像素、图高像素、数据地址

注意:图片显示,不要大于、超出显示屏的有效范围

STM32显示图片_Image2Lcd步骤图解_第14张图片

3-6  图片显示函数 原型

注意:本函数,其实就是两部分,以0x2C那行为界,上面是设置坐标、下面是发送16位颜色值。

/******************************************************************
 * 函数名: LCD_Image
 * 功  能: 在指定区域内填充指定图片数据
 *          图片数据在font.h文件中.只适合少量图片保存
 *          Image2Lcd转换:水平扫描,16位真彩色
 * 参  数: uint16_t x,y     左上角起始坐标
 *          uint16_t width   图片宽度
 *          uint16_t height  图片高度
 *          u8* image        数据缓存地址
 *****************************************************************/
void LCD_Image(uint16_t x, uint16_t y, uint16_t width, uint16_t height, const uint8_t *image)
{
    uint32_t cnt = 0;

    for (uint16_t i=0; i>8 );
        writeData( x & 0XFF );
        
        writeCmd(  0X2B );              // 设置y坐标
        writeData( (y+i) >> 8 );
        writeData( (y+i) & 0XFF );
        
        writeCmd(0X2C);                 // 开始写GRAM
        
        for (uint16_t j = 0; j < width; j++)                        // 一行中,从左到事,逐个像素处理
        {
            writeData((image[cnt * 2 + 1] << 8) | image[cnt * 2]);  // 写入16位颜色数据
            cnt++;
        }
    }
}

3-7  本示例显示效果

STM32显示图片_Image2Lcd步骤图解_第15张图片

3-8  其它图片配合文字输出的效果

STM32显示图片_Image2Lcd步骤图解_第16张图片

你可能感兴趣的:(stm32,嵌入式硬件,单片机)