[嵌入式] STM32F103xx OLED旋转显示图片

开发: C++知识库 Java知识库 JavaScript Python PHP知识库人工智能区块链大数据移动开发嵌入式开发工具数据结构与算法开发测试游戏开发网络协议系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑笔记本显卡显示器固态硬盘硬盘耳机手机 iphone vivo oppo 小米华为单反装机图拉丁

-> 嵌入式 -> STM32F103xx OLED旋转显示图片 -> 正文阅读

[嵌入式]STM32F103xx OLED旋转显示图片

STM32F103xx OLED旋转显示图片源码下载

编译器平台及例程说明

编译器说明


1. Toolchain : MDK-ARM Community Version: 5.36.0.0(Kile V5)
2. Encoding  : Encode in UTF-8 without signature
3. Device Specific Packs : Keil.STM32F1xx_DFP.2.3.0.pack
4. C/C++ Preprocessor Symbols : STM32F10X_HD,USE_STDPERIPH_DRIVER
   USE_STDPERIPH_DRIVER :允许使用标准外设驱动
   STM32F10X_HD         :STM32F10x大容量产品
5. Chip Type :ARM Cortex-M3 STM32F103RET6, 72MHZ, Flash:512KByte, ROM:64KByte, LQFP144
6. 在stm32hf10x.h文件中HSE_VALUE为外部高速振荡器，默认8MHZ。此值必须与硬件保持一致。

例程说明


1. STM32F103xx OLED旋转显示图片。
2. 显示图片可实现0度旋转、90度旋转、180度旋转、270度旋转。
3. 提供两种图片取模方式的显示。

一、图片旋转显示样式

在这里插入图片描述

二、图片旋转显示原理简述

原图(0度)显示 :
1. 横轴为图片实际宽度，纵轴为图片显示宽度，图片显示宽度大于等于图片实际宽度。
2. 按列显示，先显示第一列，在显示第二列，以此类推，每显示列中的一个像素纵轴加一，横轴不变，直到纵轴加的数量等于图片显示宽度为止，然后横轴加一，纵轴重设为初始值，开始显示第二列，依次类推，直到显示完最后一列。

90度显示 :

纵轴为图片实际高度，横轴为图片显示宽度，图片显示宽度大于等于图片实际宽度。
按行显示，先显示第一行，在显示第二行，以此类推，每显示行中的一个像素横轴加一，纵轴不变，直到横轴加的数量等于图片显示宽度为止，然后纵轴加一，横轴重设为初始值，开始显示第二行，依次类推，直到显示完最后一行。

180度显示 :
270度显示 :
180和270旋转显示原理月0度和90度相似。

注意：图片的显示方式与其取模方式有关。

在这里插入图片描述

三、两种不同的取模方式

第一种取模方式


1. 先从上到下，从左到右，按列取，先取第一列前8个像素，再取第二列前8个像素，直到最后一列前8个像素；然后再取先取第一列后8个像素，再取第二列后8个像素，直到最后一列后8个像素，以此类推。
2. PCtoLCD2002完美版 ==> 阴码 + 列行式 + 逆向(低位在前)
3. mg2Lcd.exe ==>  数据水平，字节垂直 + 单色 + 字节内像素数据反序(低位在前)

在这里插入图片描述

第二种取模方式


1. 先从上到下，从左到右，按列取，先取完第一列，再取完第二列，直到取完最后一列
2. PCtoLCD2002完美版 ==> 阴码 + 逐列式 + 逆向(低位在前)取模方式
3. Img2Lcd.exe ==> 垂直扫描 + 单色 + 字节内像素数据反序(低位在前)取模方式

在这里插入图片描述

四、不同的旋转模式


/* 旋转模式 */
typedef enum
{
    ROTAT_MODE_DEG_0   = 0, /* 旋转0度 */
    ROTAT_MODE_DEG_90  = 1, /* 旋转90度 */
    ROTAT_MODE_DEG_180 = 2, /* 旋转180度 */
    ROTAT_MODE_DEG_270 = 3, /* 旋转270度 */
    ROTAT_MODE_MAX
}eRotateMode;

五、不同旋转模式前后部分的处理方式

/* 获取横纵轴的操作 */
static void vGet_xyHandler_Rotat(eRotateMode mode, void (** prevHand)(u16 * prev, u8 n), void (** backHand)(u16 * back, u8 n))
{
    switch(mode)
    {
        case ROTAT_MODE_DEG_0:
        {
            *prevHand = &vHandler_Inc;
            *backHand = &vHandler_Inc;
        }
        break;

        case ROTAT_MODE_DEG_90:
        {
            *prevHand = &vHandler_Sub;
            *backHand = &vHandler_Inc;
        }
        break;

        case ROTAT_MODE_DEG_180:
        {
            *prevHand = &vHandler_Sub;
            *backHand = &vHandler_Sub;
        }
        break;

        case ROTAT_MODE_DEG_270:
        {
            *prevHand = &vHandler_Inc;
            *backHand = &vHandler_Sub;
        }
        break;

        default : break;
    }
}

六、带旋转显示图片方式1

此函数适用于PCtoLCD2002完美版 ==> 阴码 + 逐列式 + 逆向(低位在前)取模方式
此函数适用于Img2Lcd.exe ==> 垂直扫描 + 单色 + 字节内像素数据反序(低位在前)取模方式
取模方式为: 先从上到下，从左到右，按列取，先取完第一列，再取完第二列，直到取完最后一列

/**********************************************************************************************************************************************
 * 函数名 : vOLED_ShowPicture_Rotate
 * 描  述 : OLED显示图片带旋转
 * 输  入 : x       : 横轴坐标
 *          y       : 纵轴坐标
 *          xWidth  ：图片宽度
 *          yHeight : 图片高度
 *          pImage  : 图片指针
 *          mode    : 旋转模式
 * 说  明 : 1. 此函数适用于PCtoLCD2002完美版 ==> 阴码 + 逐列式 + 逆向(低位在前)取模方式
 *          2. 此函数适用于Img2Lcd.exe ==> 垂直扫描 + 单色 + 字节内像素数据反序(低位在前)取模方式
 *          3. 取模方式为: 先从上到下，从左到右，按列取，先取完第一列，再取完第二列，直到取完最后一列
***********************************************************************************************************************************************/
void vOLED_ShowPicture_Rotate(u16 x, u16 y, u16 xWidth, u16 yHeight, const u8 * pImage, eRotateMode mode)
{
    // 1. 此函数适用于PCtoLCD2002完美版 ==> 阴码 + 逐列式 + 逆向(低位在前)取模方式
    // 2. 此函数适用于Img2Lcd.exe ==> 垂直扫描 + 单色 + 字节内像素数据反序(低位在前)取模方式
    // 3. 取模方式为: 先从上到下，从左到右，按列取，先取完第一列，再取完第二列，直到取完最后一列

    void (* prevHandler)(u16 * prev, u8 n) = NULL;
    void (* backHandler)(u16 * back, u8 n) = NULL;

    u16 k = 0, j = 0, i = 0, n = 0;
    u16 yMax  = 0;
    u16 y0    = 0;
    u16 x0    = 0;
    u8  dat   = 0;
    u16 * xyPrev = NULL;
    u16 * xyBack = NULL;
    u16 * xyInitVal = NULL;
    u8 preCount = 0;


    /* 旋转模式越界 */
    if (mode >= ROTAT_MODE_MAX)
    {
        return;
    }


    /* 前后部分处理，x y坐标变化 */
    vGet_xyHandler_Rotat(mode, &prevHandler, &backHandler);
    if ((prevHandler == NULL) || (backHandler == NULL))
    {
        return;
    }


    /* 前后部分值处理 xy初始值 */
    if((ROTAT_MODE_DEG_0 == mode) || (ROTAT_MODE_DEG_180 == mode))
    {
        xyPrev = &y;
        xyBack = &x;
        xyInitVal = &y0;
    }
    else if((ROTAT_MODE_DEG_90 == mode) || (ROTAT_MODE_DEG_270 == mode))
    {
        xyPrev = &x;
        xyBack = &y;
        xyInitVal = &x0;
    }


    //图片高度
    yMax = (yHeight >> 3) + ((yHeight & 0x07) ? 1 : 0);


    //初始位置
    y0 = y;
    x0 = x;

    //图片宽度
    for(k = 0; k < xWidth; k++)
    {
        for(j = 0; j < yMax; j++)
        {
            dat = pImage[n++];
            for(i = 0; i < BYTE_BIT; i++)
            {
                if ((y < AppDevOLED.HeightMax) && (x < AppDevOLED.WidthMax))
                {
                    //先显示低位 低位在前
                    if((dat >> i) & 0x01)
                    {
                        vOLED_DrawPoint(x, y, 1);
                    }
                }

                /* 前部分处理，x y坐标变化 */
                prevHandler(xyPrev, 1);
            }


            /* 前部分累加直到图片高度 */
            preCount++;
            if (preCount == yMax)
            {
                preCount = 0;

                /* 后部分处理，x y坐标变化 */
                backHandler(xyBack, 1);

                /* 更新初始坐标， x y初始坐标*/
                *xyPrev = *xyInitVal;
            }
        }
    }
}

七、带旋转显示图片方式2

此函数适用于PCtoLCD2002完美版 ==> 阴码 + 列行式 + 逆向(低位在前)
此函数适用于mg2Lcd.exe ==> 数据水平，字节垂直 + 单色 + 字节内像素数据反序(低位在前)
取模方式为: 先从上到下，从左到右，按列取，先取第一列前8个像素，再取第二列前8个像素，直到最后一列前8个像素；然后再取先取第一列后8个像素，再取第二列后8个像素，直到最后一列后8个像素，以此类推。

/**********************************************************************************************************************************************
 * 函数名 : vOLED_ShowPicture_Rotate
 * 描  述 : OLED显示图片带旋转
 * 输  入 : x       : 横轴坐标
 *          y       : 纵轴坐标
 *          xWidth  ：图片宽度
 *          yHeight : 图片高度
 *          pImage  : 图片指针
 *          mode    : 旋转模式
 * 说  明 :  1. 此函数适用于PCtoLCD2002完美版 ==> 阴码 + 列行式 + 逆向(低位在前)
 *          2. 此函数适用于mg2Lcd.exe ==>  数据水平，字节垂直 + 单色 + 字节内像素数据反序(低位在前)
 *          3. 取模方式为: 先从上到下，从左到右，按列取，先取第一列前8个像素，再取第二列前8个像素，直到最后一列前8个像素；
 *             然后再取先取第一列后8个像素，再取第二列后8个像素，直到最后一列后8个像素，以此类推
***********************************************************************************************************************************************/
void vOLED_ShowImage_Rotate(u16 x, u16 y, u16 xWidth, u16 yHeight, const u8 * pImage, eRotateMode mode)
{
    // 1. 此函数适用于PCtoLCD2002完美版 ==> 阴码 + 列行式 + 逆向(低位在前)
    // 2. 此函数适用于mg2Lcd.exe ==>  数据水平，字节垂直 + 单色 + 字节内像素数据反序(低位在前)
    // 3. 取模方式为: 先从上到下，从左到右，按列取，先取第一列前8个像素，再取第二列前8个像素，直到最后一列前8个像素；
    // 然后再取先取第一列后8个像素，再取第二列后8个像素，直到最后一列后8个像素，以此类推

    void (* prevHandler)(u16 * prev, u8 n) = NULL;
    void (* backHandler)(u16 * back, u8 n) = NULL;

    u16 k = 0, j = 0, i = 0, n = 0;
    u16 yMax  = 0;
    u16 y0    = 0;
    u16 x0    = 0;
    u8  dat   = 0;
    u16 * xyPrev    = NULL; //前半部分
    u16 * xyBack    = NULL; //后半部分
    u16 * xyInitVal = NULL; //初始值
    u16 * xyGapVal  = NULL; //间隔值


    /* 旋转模式越界 */
    if (mode >= ROTAT_MODE_MAX)
    {
        return;
    }


    /* 前后部分处理，x y坐标变化 */
    vGet_xyHandler_Rotat(mode, &prevHandler, &backHandler);
    if ((prevHandler == NULL) || (backHandler == NULL))
    {
        return;
    }


    /* 前后部分值处理 xy初始值 间隔值处理 */
    if((ROTAT_MODE_DEG_0 == mode) || (ROTAT_MODE_DEG_180 == mode))
    {
        xyPrev = &y;
        xyBack = &x;
        xyInitVal = &x0;
        xyGapVal  = &y0;
    }
    else if((ROTAT_MODE_DEG_90 == mode) || (ROTAT_MODE_DEG_270 == mode))
    {
        xyPrev = &x;
        xyBack = &y;
        xyInitVal = &y0;
        xyGapVal  = &x0;
    }


    //图片高度
    yMax = (yHeight >> 3) + ((yHeight & 0x07) ? 1 : 0);


    //初始位置
    y0 = y;
    x0 = x;

    //图片宽度
    for(k = 0; k < xWidth; k++)
    {
        for(j = 0; j < yMax; j++)
        {
            dat = pImage[n++];
            for(i = 0; i < BYTE_BIT; i++)
            {
                if ((y < AppDevOLED.HeightMax) && (x < AppDevOLED.WidthMax))
                {
                    //先显示低位 低位在前
                    if((dat >> i) & 0x01)
                    {
                        vOLED_DrawPoint(x, y, 1);
                    }
                }

                /* 前部分处理，x y坐标变化 */
                prevHandler(xyPrev, 1);
            }

            backHandler(xyBack, 1);
            if (XABS2(*xyBack, *xyInitVal) == xWidth)
            {
                *xyBack = *xyInitVal;
                prevHandler(xyGapVal, 8);
            }
            *xyPrev = *xyGapVal;
        }
    }
}

八、图片取模测试


//Img2Lcd.exe ==> 垂直扫描 + 单色 + 字节内像素数据反序(低位在前)
const unsigned char Image_Tree_43x47[258] =
{
    0X00,0X00,0X00,0X80,0X00,0X00,0X00,0X00,0X00,0XC0,0X00,0X00,0X00,0X00,0X00,0XE0,
    0X00,0X00,0X00,0X00,0X20,0XF0,0X00,0X00,0X00,0X00,0X30,0XF8,0X00,0X00,0X00,0X00,
    0X38,0XFC,0X00,0X00,0X00,0X08,0X3C,0XFE,0X00,0X00,0X00,0X0C,0X3E,0XFF,0X00,0X00,
    0X00,0X0E,0XBF,0XFF,0X00,0X00,0X00,0X8F,0XFF,0XFF,0X00,0X00,0X80,0XCF,0XFF,0XFF,
    0X00,0X00,0XC0,0XEF,0XFF,0XFF,0X00,0X00,0XE0,0XFF,0XFF,0XFF,0X00,0X00,0XF0,0XFF,
    0XFF,0XFF,0XFF,0X1F,0XF8,0XFF,0XFF,0XFF,0XFF,0X1F,0XFC,0XFF,0XFF,0XFF,0XFF,0X1F,
    0XFC,0XFF,0XFF,0XFF,0XFF,0X1F,0XF8,0XFF,0XFF,0XFF,0XFF,0X1F,0XF0,0XFF,0XFF,0XFF,
    0XFF,0X1F,0XE0,0XFF,0XFF,0XFF,0X00,0X00,0XC0,0XEF,0XFF,0XFF,0X00,0X00,0X80,0XCF,
    0XFF,0XFF,0X00,0X00,0X00,0X8F,0XFF,0XFF,0X00,0X00,0X00,0X0E,0XBF,0XFF,0X00,0X00,
    0X00,0X0C,0X3E,0XFF,0X00,0X00,0X00,0X08,0X3C,0XFE,0X00,0X00,0X00,0X00,0X38,0XFC,
    0X00,0X00,0X00,0X00,0X30,0XF8,0X00,0X00,0X00,0X00,0X20,0XF0,0X00,0X00,0X00,0X00,
    0X00,0XE0,0X00,0X00,0X00,0X00,0X00,0XC0,0X00,0X00,0X00,0X00,0X00,0X80,0X00,0X00,
    0X0C,0X00,0X00,0X00,0X00,0X18,0X0C,0X00,0X00,0X00,0X00,0X18,0X0C,0X00,0X00,0X00,
    0X00,0X18,0X0C,0X00,0X00,0X00,0X00,0X18,0X0C,0X00,0X00,0X00,0X00,0X18,0X0C,0X00,
    0X00,0X00,0X00,0X18,0X1E,0X00,0X00,0X00,0X00,0X3C,0XFF,0XFF,0XFF,0XFF,0XFF,0X7F,
    0XFF,0XFF,0XFF,0XFF,0XFF,0X7F,0X1E,0X00,0X00,0X00,0X00,0X3C,0X0C,0X00,0X00,0X00,
    0X00,0X18,
};



//mg2Lcd.exe ==>  数据水平，字节垂直 + 单色 + 字节内像素数据反序(低位在前)
const unsigned char Image_Speed_50x39[250] = 
{
    0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X10,0X38,0X78,0X7C,0X3C,0X3E,
    0X1E,0X1E,0X0F,0X0F,0X0F,0X0F,0X00,0X00,0X00,0X00,0X00,0X00,0X0F,0X0F,0X0F,0X0F,
    0X1E,0X1E,0X3E,0X3C,0X7C,0X78,0X38,0X10,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,
    0X00,0X00,0X00,0X80,0XE0,0XF8,0XFC,0XFE,0X7C,0X30,0X00,0X00,0X00,0X00,0X00,0X00,
    0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0XF0,0XFC,0XF0,0X00,0X00,0X00,0X00,
    0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X30,0X7C,0XFE,0XFC,
    0XF8,0XE0,0X80,0X00,0X3C,0X3F,0X3F,0X3F,0X0F,0X03,0X00,0X00,0X00,0X00,0X00,0X00,
    0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X80,0XF8,0XFF,0XFF,0XFF,0XFF,0XFF,0XF8,
    0X80,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,
    0X03,0X1F,0X3F,0X3F,0X3F,0X3C,0X38,0XF8,0XF8,0XF8,0XE0,0X80,0X00,0X00,0X00,0X00,
    0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X07,0X0F,0X1F,0X1F,0X1F,0X1F,
    0X1F,0X0F,0X07,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,
    0X00,0X00,0X80,0XE0,0XF8,0XF8,0XF8,0X38,0X00,0X01,0X07,0X1F,0X3F,0X7F,0X3E,0X18,
    0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,
    0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,0X00,
    0X00,0X00,0X18,0X3E,0X7F,0X3F,0X1F,0X07,0X01,0X00,
};

九、测试核心代码1

	vOLED_ShowPicture_Rotate(10, 10, 43, 47, Image_Tree_43x47, ROTAT_MODE_DEG_0);
	vOLED_ShowPicture_Rotate(70, 0, 43, 47, Image_Tree_43x47, ROTAT_MODE_DEG_90);
	vOLED_ShowPicture_Rotate(60, 60, 43, 47, Image_Tree_43x47, ROTAT_MODE_DEG_180);
	vOLED_ShowPicture_Rotate(20, 60, 43, 47, Image_Tree_43x47, ROTAT_MODE_DEG_270);

在这里插入图片描述

十、测试核心代码2

	vOLED_ShowImage_Rotate(5, 5, 50, 39, Image_Speed_50x39, ROTAT_MODE_DEG_0);
	vOLED_ShowImage_Rotate(70, 5, 50, 39, Image_Speed_50x39, ROTAT_MODE_DEG_90);
	vOLED_ShowImage_Rotate(70, 50, 50, 39, Image_Speed_50x39, ROTAT_MODE_DEG_180);
	vOLED_ShowImage_Rotate(80, 50, 50, 39, Image_Speed_50x39, ROTAT_MODE_DEG_270);