STM32F103xx OLED旋转显示图片

本文详细介绍了STM32F103xx开发板如何利用MDK-ARM编译器实现OLED屏幕上的图片旋转,包括0-270度旋转原理、取模方式、不同模式处理及两种显示方式的实现。通过实例代码演示了如何在90度和0度模式下旋转图片并进行取模测试。
摘要由CSDN通过智能技术生成


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度显示 :

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

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

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

  1. 此函数适用于PCtoLCD2002完美版 ==> 阴码 + 列行式 + 逆向(低位在前)
  2. 此函数适用于mg2Lcd.exe ==> 数据水平,字节垂直 + 单色 + 字节内像素数据反序(低位在前)
  3. 取模方式为: 先从上到下,从左到右,按列取,先取第一列前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);

在这里插入图片描述

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值