为OLED屏增加GUI支持5：图片控件

环境：

主机:WIN10

开发环境:MDK5.13

MCU:STM32F103

说明：

本文定义了图片控件。OLED屏是单色屏，所以本图片控件支持的是单色BMP图像。

将普通图像转换为单色图片可以用工具BmpCvt.exe。将转换后的BMP图像转换为hex文件,可以用Bin2C.exe。这两个工具都是emwin自带工具。

源代码：

转换后的hex文件再整理成如下的示例格式:

battery0.c

/**

*Copyright(c),2015-2025

*@filebattery0.c

*@brief电池0格图标

*@authorjdh

*@date2015/11/9

*@verbatim

*说明:

*1.图片格式为bmp

*2.图片大小为17*13

*@endverbatim

*/

/*********************************************************************

*头文件

**********************************************************************/

#include"res.h"

/*********************************************************************

*全局变量

**********************************************************************/

constunsignedcharRes_Battery0_Bmp[114UL+1]={

0x42,0x4D,0x72,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x3E,0x00,0x00,0x00,0x28,0x00,0x00,0x00,0x11,0x00,0x00,0x00,0x0D,0x00,0x00,0x00,0x01,0x00,0x01,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,

0x00,0x00,0x00,0x00,0x00,0x00,0x02,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0xFF,0xFF,0xFF,0x00,0x00,0x00,0x00,0x00,0x3F,0xFF,0x80,0xFF,0x20,0x00,0x80,0x04,0xE0,0x00,0x80,0x00,0xE0,0x00,

0x80,0x00,0xE0,0x00,0x80,0x00,0xE0,0x00,0x80,0x00,0xE0,0x00,0x80,0x00,0xE0,0x00,0x80,0x00,0x20,0x00,0x80,0x00,0x3F,0xFF,0x80,0x04,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00

};

/***************************Endoffile****************************/

gui_widget_image.h

/**

*Copyright(c),2015-2025

*@filegui_widget_image.h

*@brief图片控件头文件

*@authorjdh

*@date2015/9/8

*/

#ifndef_GUI_WIDGET_IMAGE_H_

#define_GUI_WIDGET_IMAGE_H_

/*********************************************************************

*头文件

**********************************************************************/

#include"gui_interface.h"

/*********************************************************************

*数据结构

**********************************************************************/

/**

*@brief图片控件数据结构

*/

typedefstruct_Widget_Image

{

//x轴位置

uint16_tx;

//y轴位置

uint16_ty;

//水平尺寸

uint16_txsize;

//垂直尺寸

uint16_tysize;

//图片地址

constuint8_t*addr;

}*Widget_Image_Handle;

/*********************************************************************

*函数

**********************************************************************/

/**

*@brief创建控件text

*@paramx:左上角x坐标

*@paramy:左上角y坐标

*@paramxsize:水平尺寸

*@paramysize:垂直尺寸

*/

Widget_Image_Handlegui_widget_image_create(uint16_tx,uint16_ty,uint16_txsize,uint16_tysize);

/**

*@brief设置图片

*@paramaddr:图片地址

*/

voidgui_widget_image_set_bmp(Widget_Image_Handlehandle,constuint8_t*addr);

#endif

gui_widget_image.c

/**

*Copyright(c),2015-2025

*@filegui_widget_image.c

*@brief图片控件主文件

*@authorjdh

*@date2015/9/8

*/

/*********************************************************************

*头文件

**********************************************************************/

#include"gui_widget_image.h"

#include"gui_2d_lib.h"

#include"stdlib.h"

#include"string.h"

/*********************************************************************

*静态函数

**********************************************************************/

/**

*@brief控件显示

*@paramhandle:控件句柄

*/

staticvoidshow(Widget_Image_Handlehandle);

/*********************************************************************

*函数

**********************************************************************/

/**

*@brief创建控件text

*@paramx:左上角x坐标

*@paramy:左上角y坐标

*@paramxsize:水平尺寸

*@paramysize:垂直尺寸

*/

Widget_Image_Handlegui_widget_image_create(uint16_tx,uint16_ty,uint16_txsize,uint16_tysize)

{

Widget_Image_Handlehandle;

//控件初始化

handle=malloc(sizeof(*handle));

handle->x=x;

handle->y=y;

handle->xsize=xsize;

handle->ysize=ysize;

returnhandle;

}

/**

*@brief设置图片

*@paramaddr:图片地址

*/

voidgui_widget_image_set_bmp(Widget_Image_Handlehandle,constuint8_t*addr)

{

handle->addr=addr;

//显示

show(handle);

}

/**

*@brief控件显示

*@paramhandle:控件句柄

*/

staticvoidshow(Widget_Image_Handlehandle)

{

//清除区域

gui_fill_rect(handle->x,handle->y,handle->x+handle->xsize,handle->y+handle->ysize,0);

//显示

gui_draw_bitmap(handle->x,handle->y,handle->addr);

}

测试代码:

//电池图标

staticWidget_Image_HandleWidget_Image_Battery;

Widget_Image_Battery=gui_widget_image_create(106,0,17,13);

gui_widget_image_set_bmp(Widget_Image_Battery,Res_Battery0_Bmp);