1. STM32CubeMX
2. STM32RCT6核心板
3. IDE Keil（MDK-ARM）
4. 杜邦线×4
5. 0.96寸OLED屏（4针脚）

一、什么是GuiLite

GuiLite是一个开源的Gui框架，只依赖于一个头文件（GuiLite.h），不需要很复杂的文件管理，代码量平易近人，GuiLite由5K行C++代码编写，单片机上也能流畅运行 其最低的硬件运行要求：

且GuiLite有很强的跨平台性

支持的操作系统：iOS/macOS/WatchOS，Android，Linux（ARM/x86-64），Windows（包含VR），RTOS… 甚至无操作系统的单片机 支持的开发语言：C/C++, Swift, Java, Javascript, C#, Golang… 支持的第3方库：Qt, MFC, Winforms, CoCoa…

除此之外，GuiLite 提供一系列辅助开发工具

☁️完美的“云” + “物联网”解决方案：让你轻松驾驭全球IoT业务 支持多语言,采用 UTF-8 编码； 支持视频播放 资源制作工具为你定制自己的字体/图片资源 所见即所得的GUI布局工具 编译活跃度统计，及实时分析 支持3D & Web 支持Docker，一条命令启动。

二、STM32CubeMX部分

2.1 配置时钟

选择STM32F103RCTx系列芯片，配置时钟的同时会自动配置IO口引脚 将HCLK设置为最大频率72MHz

2.2 配置IIC

2.3 工程生成

将分配的堆空间增大

工程管理依旧是这几个选项，然后GENERATE CODE，STM32CubeMX部分完成

三、MDK 5 部分

打开MDK生成两个文件夹分别装oled和UIcode的文件

3.1 移植OLED文件

文末有工程链接

移植OLED的操作已在中有详细说明，这里就不重复了

3.2 移植GuiLite文件

上Gitee的，选择，将其中的 UIcode文件夹复制到 工程文件下 在 MDK 工程里面导入UICode下的UIcode.cpp文件 添加UIcode的路径

3.3 修改main.c 文件

3.3.1 添加头文件 #include "oled.h"

3.3.2 添加GuiLite接口函数

//画点函数接口
void gfx_draw_pixel(int x, int y, unsigned int rgb)
{
          
   
    OLED_DrawPoint(x,y,rgb);
}
//画面函数(未使用)
void gfx_draw_fill(int x, int y,int w, int q, unsigned int rgb)
{
          
    
}
//创建一个函数指针结构体
struct EXTERNAL_GFX_OP
{
          
   
 void (*draw_pixel)(int x, int y, unsigned int rgb);
 void (*fill_rect)(int x0, int y0, int x1, int y1, unsigned int rgb);
} my_gfx_op;
extern void startHelloCircle(void* phy_fb, int width, int height, int color_bytes, struct EXTERNAL_GFX_OP* gfx_op);

//设定延时函数接口
void delay_ms(int milli_seconds)
{
          
   
 HAL_Delay(milli_seconds);
}

3.3.3 添加代码

//传递函数指针
my_gfx_op.draw_pixel = gfx_draw_pixel;
my_gfx_op.fill_rect = NULL;//gfx_fill_rect;
//启动画圆
startHelloCircle(NULL, 128, 64, 1, &my_gfx_op);

3.4 修改UIcode.cpp 文件

3.4.1 添加oled.h文件

因为这里是C++与C语言混用，所以此处的声明会稍有不同，网上关于单片机移植GuiLite都没有提到这个问题，避坑！为什么会这样？下一条解答

3.4.2 添加OLED刷新函数

接上一条，如果声明按照C语言格式#include "oled.h" 来写的话，那么这个地方会一直报错，调用失败

3.5 配置完成后，关闭Use MicroLIB选项，编译代码

编译下载时需要选择相对应的下载器，勾选以下

效果如图