跳到主要内容

搭配 Arduino 使用

注:例程均在Arduino UNO R3 PLUS上进行了测试,如果需要是其他型号的Arduino需要自己确定连接的管脚是否正确,是否能把工作电压与逻辑电压调至3V3 。

arduino IDE 安装教程​

arduino IDE 安装教程

运行程序​

在产品百科界面下载程序,然后解压。Arduino程序位于 ~/Arduino/…

LCD arduino cede1

请根据液晶屏型号选择对应的程序打开

1

可以查看到所有的屏幕尺寸的测试程序,按照尺寸分类

比如1.54inch LCD Module. 打开LCD_1inch54文件夹,并运行LCD_1inch54.ino文件。
打开程序,选择开发板型号Arduino UNO

LCD arduino cede3

选择对应COM口

LCD arduino cede4

然后点击编译并下载即可

LCD arduino cede5

程序说明​

文件介绍​

以Arduino UNO控制1.54寸 LCD 为例,打开Arduino\LCD_1inch54目录:

LCD arduino ide codeDescription1

其中:
LCD_1inch5.ino:使用Arduino IDE打开即可;
LCD_Driver.cpp(.h):是液晶屏的驱动程序;
DEV_Config.cpp(.h):是硬件接口定义,里面封装了读写管脚电平,SPI传输数据,以及管脚初始化;
font8.cpp、font12.cpp、font16.cpp、font20.cpp、font24.cpp、font24CN.cpp、fonts.h:为不同大小字符的字模;
image.cpp(.h):是图片数据,这个可以通过Img2Lcd(在开发资料中可下载)把任意的BMP图片转换成16位真彩色图片数组。
程序分为底层硬件接口、中间层液晶屏驱动、上层应用;

底层硬件接口​

在DEV_Config.cpp(.h)两个文件中定义了硬件接口,并封装好读写管脚电平、延时、SPI传输等函数。

写管脚电平​

void DEV_Digital_Write(int pin, int value)

第一个参数为管脚、第二个为高低电平。

读管脚电平​

int DEV_Digital_Read(int pin)

参数为管脚,返回值为读取管脚的电平。

延时​

DEV_Delay_ms(unsigned int delaytime)

毫秒级别延时。

SPI输出数据​

DEV_SPI_WRITE(unsigned char data)

参数为char型,占8位。

上层应用​

对于屏幕而言,如果需要进行画图、显示中英文字符、显示图片等怎么办,这些都是上层应用做的。这有很多小伙伴有问到一些图形的处理,我们这里提供了一些基本的功能 GUI_Paint.c(.h)
注:因为STM32和arduino内部RAM大小的原因,GUI都采用直接写入LCD的RAM中。

LCD arduino ide codeDescription GUI

GUI使用的字体均依赖于相同文件下的font*.cpp(h)文件

LCD arduino ide codeDescription font

  • 新建图像属性:新建一个图像属性,这个属性包括图像缓存的名称、宽度、高度、翻转角度、颜色

    void Paint_NewImage(UWORD Width, UWORD Height, UWORD Rotate, UWORD Color);
    参数:
    Width : 图像缓存的宽度;
    Height: 图像缓存的高度;
    Rotate:图像的翻转的角度
    Color :图像的初始颜色;
  • 设置清屏函数,通常直接调用LCD的clear函数;

    void Paint_SetClearFuntion(void (*Clear)(UWORD));
    参数:
    Clear : 指向清屏函数的指针,用于快速将屏幕清空变成某颜色;
  • 设置画像素点函数,通常直接调用LCD的DrawPaint函数;

    void Paint_SetDisplayFuntion(void (*Display)(UWORD,UWORD,UWORD));
    参数:
    Display: 指向画像素点函数的指针,用于向LCD内部RAM指定位置写入数据;
  • 选择图像缓存:选择图像缓存,选择的目的是你可以创建多个图像属性,图像缓存可以存在多个,你可以选择你所创建的每一张图像

    void Paint_SelectImage(UBYTE *image)
    参数:
    image: 图像缓存的名称,实际上是一个指向图像缓存首地址的指针;
  • 图像旋转:设置选择好的图像的旋转角度,最好使用在Paint_SelectImage()后,可以选择旋转0、90、180、270

    void Paint_SetRotate(UWORD Rotate)
    参数:
    Rotate: 图像选择角度,可以选择ROTATE_0、ROTATE_90、ROTATE_180、ROTATE_270分别对应0、90、180、270度

    【说明】不同选择角度下,坐标对应起始像素点不同,这里以1.14为例,四张图,按顺序为0°, 90°, 180°, 270°。仅做为参考

    LCD Rotate

  • 图像镜像翻转:设置选择好的图像的镜像翻转,可以选择不镜像、关于水平镜像、关于垂直镜像、关于图像中心镜像。

    void Paint_SetMirroring(UBYTE mirror)
    参数:
    mirror: 图像的镜像方式,可以选择MIRROR_NONE、MIRROR_HORIZONTAL、MIRROR_VERTICAL、MIRROR_ORIGIN分别对应不镜像、关于水平镜像、关于垂直镜像、关于图像中心镜像
  • 设置点在缓存中显示位置和颜色:这里是GUI最核心的一个函数、处理点在缓存中显示位置和颜色;

    void Paint_SetPixel(UWORD Xpoint, UWORD Ypoint, UWORD Color)
    参数:
    Xpoint: 点在图像缓存中X位置
    Ypoint: 点在图像缓存中Y位置
    Color : 点显示的颜色
  • 图像缓存填充颜色:把图像缓存填充为某颜色,一般作为屏幕刷白的作用

    void Paint_Clear(UWORD Color)
    参数:
    Color: 填充的颜色
  • 图像缓存部分窗口填充颜色:把图像缓存的某部分窗口填充为某颜色,一般作为窗口刷白的作用,常用于时间的显示,刷白上一秒

    void Paint_ClearWindows(UWORD Xstart, UWORD Ystart, UWORD Xend, UWORD Yend, UWORD Color)
    参数:
    Xstart: 窗口的X起点坐标
    Ystart: 窗口的Y起点坐标
    Xend: 窗口的X终点坐标
    Yend: 窗口的Y终点坐标
    Color: 填充的颜色
  • 画点:在(Xpoint, Ypoint)上画点,可以选择颜色,点的大小,点的风格

    void Paint_DrawPoint(UWORD Xpoint, UWORD Ypoint, UWORD Color, DOT_PIXEL Dot_Pixel, DOT_STYLE Dot_Style)
    参数:
    Xpoint: 点的X坐标
    Ypoint: 点的Y坐标
    Color: 填充的颜色
    Dot_Pixel: 点的大小,提供默认的8种大小点
    typedef enum {
    DOT_PIXEL_1X1 = 1, // 1 x 1
    DOT_PIXEL_2X2 , // 2 X 2
    DOT_PIXEL_3X3 , // 3 X 3
    DOT_PIXEL_4X4 , // 4 X 4
    DOT_PIXEL_5X5 , // 5 X 5
    DOT_PIXEL_6X6 , // 6 X 6
    DOT_PIXEL_7X7 , // 7 X 7
    DOT_PIXEL_8X8 , // 8 X 8
    } DOT_PIXEL;
    Dot_Style: 点的风格,大小扩充方式是以点为中心扩大还是以点为左下角往右上扩大
    typedef enum {
    DOT_FILL_AROUND = 1,
    DOT_FILL_RIGHTUP,
    } DOT_STYLE;
  • 画线:从 (Xstart, Ystart) 到 (Xend, Yend) 画线,可以选择颜色,线的宽度,线的风格

    void Paint_DrawLine(UWORD Xstart, UWORD Ystart, UWORD Xend, UWORD Yend, UWORD Color, LINE_STYLE Line_Style , LINE_STYLE Line_Style)
    参数:
    Xstart: 线的X起点坐标
    Ystart: 线的Y起点坐标
    Xend: 线的X终点坐标
    Yend: 线的Y终点坐标
    Color: 填充的颜色
    Line_width: 线的宽度,提供默认的8种宽度
    typedef enum {
    DOT_PIXEL_1X1 = 1, // 1 x 1
    DOT_PIXEL_2X2 , // 2 X 2
    DOT_PIXEL_3X3 , // 3 X 3
    DOT_PIXEL_4X4 , // 4 X 4
    DOT_PIXEL_5X5 , // 5 X 5
    DOT_PIXEL_6X6 , // 6 X 6
    DOT_PIXEL_7X7 , // 7 X 7
    DOT_PIXEL_8X8 , // 8 X 8
    } DOT_PIXEL;
    Line_Style: 线的风格,选择线是以直线连接还是以虚线的方式连接
    typedef enum {
    LINE_STYLE_SOLID = 0,
    LINE_STYLE_DOTTED,
    } LINE_STYLE;
  • 画矩形:从 (Xstart, Ystart) 到 (Xend, Yend) 画一个矩形,可以选择颜色,线的宽度,是否填充矩形内部

    void Paint_DrawRectangle(UWORD Xstart, UWORD Ystart, UWORD Xend, UWORD Yend, UWORD Color, DOT_PIXEL Line_width, DRAW_FILL Draw_Fill)
    参数:
    Xstart: 矩形的X起点坐标
    Ystart: 矩形的Y起点坐标
    Xend: 矩形的X终点坐标
    Yend: 矩形的Y终点坐标
    Color: 填充的颜色
    Line_width: 矩形四边的宽度,提供默认的8种宽度
    typedef enum {
    DOT_PIXEL_1X1 = 1, // 1 x 1
    DOT_PIXEL_2X2 , // 2 X 2
    DOT_PIXEL_3X3 , // 3 X 3
    DOT_PIXEL_4X4 , // 4 X 4
    DOT_PIXEL_5X5 , // 5 X 5
    DOT_PIXEL_6X6 , // 6 X 6
    DOT_PIXEL_7X7 , // 7 X 7
    DOT_PIXEL_8X8 , // 8 X 8
    } DOT_PIXEL;
    Draw_Fill: 填充,是否填充矩形的内部
    typedef enum {
    DRAW_FILL_EMPTY = 0,
    DRAW_FILL_FULL,
    } DRAW_FILL;
  • 画圆:以 (X_Center Y_Center) 为圆心,画一个半径为Radius的圆,可以选择颜色,线的宽度,是否填充圆内部

    void Paint_DrawCircle(UWORD X_Center, UWORD Y_Center, UWORD Radius, UWORD Color, DOT_PIXEL Line_width, DRAW_FILL Draw_Fill)
    参数:
    X_Center: 圆心的X坐标
    Y_Center: 圆心的Y坐标
    Radius:圆的半径
    Color: 填充的颜色
    Line_width: 圆弧的宽度,提供默认的8种宽度
    typedef enum {
    DOT_PIXEL_1X1 = 1, // 1 x 1
    DOT_PIXEL_2X2 , // 2 X 2
    DOT_PIXEL_3X3 , // 3 X 3
    DOT_PIXEL_4X4 , // 4 X 4
    DOT_PIXEL_5X5 , // 5 X 5
    DOT_PIXEL_6X6 , // 6 X 6
    DOT_PIXEL_7X7 , // 7 X 7
    DOT_PIXEL_8X8 , // 8 X 8
    } DOT_PIXEL;
    Draw_Fill: 填充,是否填充圆的内部
    typedef enum {
    DRAW_FILL_EMPTY = 0,
    DRAW_FILL_FULL,
    } DRAW_FILL;
  • 写Ascii字符:在 (Xstart Ystart) 为左顶点,写一个Ascii字符,可以选择Ascii码可视字符字库、字体前景色、字体背景色

    void Paint_DrawChar(UWORD Xstart, UWORD Ystart, const char Ascii_Char, sFONT* Font, UWORD Color_Foreground, UWORD Color_Background)
    参数:
    Xstart: 字符的左顶点X坐标
    Ystart: 字体的左顶点Y坐标
    Ascii_Char:Ascii字符
    Font: Ascii码可视字符字库,在Fonts文件夹中提供了以下字体:
    font8:5*8的字体
    font12:7*12的字体
    font16:11*16的字体
    font20:14*20的字体
    font24:17*24的字体
    Color_Foreground: 字体颜色
    Color_Background: 背景颜色
  • 写英文字符串:在 (Xstart Ystart) 为左顶点,写一串英文字符,可以选择Ascii码可视字符字库、字体前景色、字体背景色

    void Paint_DrawString_EN(UWORD Xstart, UWORD Ystart, const char * pString, sFONT* Font, UWORD Color_Foreground, UWORD Color_Background)
    参数:
    Xstart: 字符的左顶点X坐标
    Ystart: 字体的左顶点Y坐标
    pString:字符串,字符串是一个指针
    Font: Ascii码可视字符字库,在Fonts文件夹中提供了以下字体:
    font8:5*8的字体
    font12:7*12的字体
    font16:11*16的字体
    font20:14*20的字体
    font24:17*24的字体
    Color_Foreground: 字体颜色
    Color_Background: 背景颜色
  • 写中文字符串:在 (Xstart Ystart) 为左顶点,写一串中文字符,可以选择GB2312编码字符字库、字体前景色、字体背景色;

    void Paint_DrawString_CN(UWORD Xstart, UWORD Ystart, const char * pString, cFONT* font, UWORD Color_Foreground, UWORD Color_Background)
    参数:
    Xstart: 字符的左顶点X坐标
    Ystart: 字体的左顶点Y坐标
    pString:字符串,字符串是一个指针
    Font: GB2312编码字符字库,在Fonts文件夹中提供了以下字体:
    font12CN:ascii字符字体11*21,中文字体16*21
    font24CN:ascii字符字体24*41,中文字体32*41
    Color_Foreground: 字体颜色
    Color_Background: 背景颜色
  • 写数字:在 (Xstart Ystart) 为左顶点,写一串数字,可以选择Ascii码可视字符字库、字体前景色、字体背景色

    void Paint_DrawNum(UWORD Xpoint, UWORD Ypoint, int32_t Nummber, sFONT* Font, UWORD Color_Foreground, UWORD Color_Background)
    参数:
    Xstart: 字符的左顶点X坐标
    Ystart: 字体的左顶点Y坐标
    Nummber:显示的数字,这里使用的是32位长的int型保存,可以最大显示到2147483647
    Font: Ascii码可视字符字库,在Fonts文件夹中提供了以下字体:
    font8:5*8的字体
    font12:7*12的字体
    font16:11*16的字体
    font20:14*20的字体
    font24:17*24的字体
    Color_Foreground: 字体颜色
    Color_Background: 背景颜色
  • 写带小数的数字:在 (Xstart Ystart) 为左顶点,写一串数字可以带小数的数字,可以选择Ascii码可视字符字库、字体前景色、字体背景色

    void Paint_DrawFloatNum(UWORD Xpoint, UWORD Ypoint, double Nummber, UBYTE Decimal_Point, sFONT* Font, UWORD Color_Foreground, UWORD Color_Background);
    参数:
    Xstart: 字符的左顶点X坐标
    Ystart: 字体的左顶点Y坐标
    Nummber:显示的数字,这里使用的是double型保存
    Decimal_Point:显示小数点后几位数字
    Font: Ascii码可视字符字库,在Fonts文件夹中提供了以下字体:
    font8:5*8的字体
    font12:7*12的字体
    font16:11*16的字体
    font20:14*20的字体
    font24:17*24的字体
    Color_Foreground: 字体颜色
    Color_Background: 背景颜色
  • 显示时间:在 (Xstart Ystart) 为左顶点,显示一段时间,可以选择Ascii码可视字符字库、字体前景色、字体背景色;

    void Paint_DrawTime(UWORD Xstart, UWORD Ystart, PAINT_TIME *pTime, sFONT* Font, UWORD Color_Background, UWORD Color_Foreground)
    参数:
    Xstart: 字符的左顶点X坐标
    Ystart: 字体的左顶点Y坐标
    pTime:显示的时间,这里定义好了一个时间的结构体,只要把时分秒各位数传给参数;
    Font: Ascii码可视字符字库,在Fonts文件夹中提供了以下字体:
    font8:5*8的字体
    font12:7*12的字体
    font16:11*16的字体
    font20:14*20的字体
    font24:17*24的字体
    Color_Foreground: 字体颜色
    Color_Background: 背景颜色
  • 显示图像:在 (Xstart Ystart) 为左顶点,显示一个宽为W_Image,高为H_Image的图像;

    void Paint_DrawImage(const unsigned char *image, UWORD xStart, UWORD yStart, UWORD W_Image, UWORD H_Image)
    参数:
    image:图像地址,指向想要显示的图像信息
    Xstart: 字符的左顶点X坐标
    Ystart: 字体的左顶点Y坐标
    W_Image:图像宽度
    H_Image:图像高度