介绍
LCD/OLED相信有过嵌入式开发经历的同学都有使用过,但是绝大多数人都是使用一些广为流传的驱动函数,在上面写写英文,写写汉字,画一些矩阵和圆这种简单的图案。作为一个超爱花里胡哨的选手,我当然不允许我的显示屏幕上只有这些东西,所以我总结出了一整套在LCD/OLED上绘制图案的方法,包括图片,图标和GIF。欢迎大家与我交流:2250017028@qq.com
图标绘制
使用软件:IconWorkshop + Img2Lcd
- IconWorkshop
- 首先打开软件,选择UNIX图标,再选择想要生成的图片大小(只考虑单色图,因为要在OLED显示)
- 快乐绘图,使用右边工具栏中的画笔进行创作
效果图:
- 保存图片到自定义路径
- Img2Lcd
- 使用软件打开上面保存的图片并如图修改配置参数(这个与绘制函数息息相关)
- 生成对应数组,并将其放到工程文件中(推荐使用一个头文件存储想要在显示器上打印的图片数组,或者将其存储入外部FLASH中)
- 编写图片绘制函数
/**
*@brief 在LCD指定位置绘制图片
*@param x0 y0 x1 y1 图片起止点
*@param front_color 图像颜色
*@param back_color 背景颜色
*@param p 图片存储地址
*/
void LCD_Draw_Picture(uint8_t x0, uint8_t y0, uint8_t x1, uint8_t y1, int front_color, int back_color, const unsigned char* p)
{
char temp, t;
unsigned int j=0;
unsigned char x,y;
if((y1-y0)%8!=0) y1 =(y1-y0)/8 + 1;
else y1 = y1 / 8;
for(y=0;y<y1;y++)
{
for(x=x0;x<x1;x++)
{
temp = p[j++];
for(t=0;t<8;t++)
{
if(temp&0x01)
{
POINT_COLOR = front_color;
LCD_DrawPoint(x,y*8+y0+t);
}
else
{
POINT_COLOR = back_color;
LCD_DrawPoint(x,y*8+y0+t);
}
temp>>=1;
}
}
}
}
/**
*@brief 在OLED指定位置绘制图片
*@param x0 y0 x1 y1 图片起止点
*@param mode 0 反白显示 1 正常显示
*@param p 图片存储地址
*@note x:0~128 y:0~64
*/
void OLED_Draw_Picture(uint8_t x0, uint8_t y0, uint8_t x1, uint8_t y1, uint8_t mode, unsigned const char p[])
{
char temp, t;
unsigned int j=0;
unsigned char x,y;
if((y1-y0)%8!=0) y1 =(y1-y0)/8 + 1;
else y1 = y1 / 8;
for(y=0;y<y1;y++)
{
for(x=x0;x<x1;x++)
{
temp = p[j++];
for(t=0;t<8;t++)
{
if(temp&0x01)OLED_DrawPoint(x,y*8+y0+t,mode);
else OLED_DrawPoint(x,y*8+y0+t,!mode);
temp>>=1;
}
}
}
}
呈现效果,以OLED为例
图片绘制
使用软件:画图+Img2Lcd
- 下载图片
下载的格式最好为.png或者.jpg格式。 - 图片处理
这里的处理指的是图片大小的处理,可以使用画图软件进行图片大小修改。下面以俄罗斯方块的一张图标为例。先打开该图片,在右上方有重新调整大小按键,可以根据自己的需求调整图片大小
调整后对图片进行存储,一般bmp格式就够用了。
接下来就是对图片进行取模,也是使用Img2Lcd软件,但是不同于上面图标取模的是,因为该图片是彩色的,转换为二值图需要选择合适的阈值,不然最后得到的图片会失去相当多的信息。
适当亮度+对比度
过亮+对比度过小
接下来的处理就跟上面图标处理一致了,这里不再赘述。
GIF绘制
使用软件:GifResizerChs + zhs9 + Img2Lcd
其实GIF取模跟图片取模最大的一点区别就是,GIF取模是多图片处理,而上述图片取模只针对于一张图片。
1.找到合适的GIF图
这里以我找的《上篮》为例
2.修改GIF的尺寸
这里使用GifResizerChs进行处理,目的是为了处理后的GIF图尺寸适配所使用的显示屏。
3.将GIF分割成多图
这里使用的是zhs9,最后生成的图片如果数量过多可以适当的进行删减,不会影响最后的显示效果。
4.图片二值化处理
若图片本身为彩色图,可以使用PictureReader软件对图片进行预处理为二值图片。这一步也可以忽略,因为最后取模为图像数组也会有二值化的过程。
5.图片取模
这里使用的方法有点笨,因为没有找到批量取模的软件,所以使用的还是Img2Lcd对GIF分离出来的图片进行逐一取模。这里使用上一幅和下一幅可以切换一个文件夹内的各个图片文件,然后逐一生成C文件代码进行存储
6. GIF显示
参考上面给出的显示一张图片的方法,对于多张图片的显示,就是一张一张图片进行显示,并且每张图片显示的间隔中需要加一定的延时,延时大小会影响最后的流畅度。这里给出我之前做的项目的开机动画作为参考。
如果对于在OLED/LCD上显示图片还有疑问,欢迎与我进一步交流:2250017028@qq.com