1. 项目概述：STM32电子画板的硬核实现
去年在整理工作室时翻出一块吃灰的STM32F407开发板，看着旁边闲置的2.8寸电阻屏，突然萌生了个想法——何不自己做个电子画板？市面上现成的绘图设备要么太贵，要么功能受限，而用单片机实现不仅能完全掌控每个细节，还能深入理解图形系统的底层原理。
这个项目的核心目标很明确：打造一个能真实绘画的便携设备。它需要具备基础绘图功能（点、线、圆、矩形）、颜色选择、作品存储和触摸校准四大核心功能。与常见的课程设计不同，我特别注重三个实用指标：绘画精度要达到0.5mm以内、支持保存1000张以上图片、触摸响应延迟低于50ms。
2. 硬件架构设计解析
2.1 核心器件选型
主控选择STM32F407ZGT6是经过深思熟虑的：
- 自带LTDC接口可直接驱动RGB屏
- 192KB SRAM满足基本图形缓存需求
- 1MB Flash空间足够存放复杂逻辑
- 丰富的GPIO和定时器资源
显示模块选用2.8寸ILI9341驱动的电阻屏，成本仅35元。虽然电容屏体验更好，但电阻屏的压感特性反而更适合绘图场景，且其精度经过校准后可达0.3mm。
关键技巧：购买触摸屏时要确认控制器型号（如XPT2046），不同控制器的驱动方式差异很大
2.2 扩展电路设计
为提升性能，额外添加了两类重要外设：
- IS62WV51216 SRAM（1MB）扩展显存
- MicroSD卡槽用于作品存储
电路设计中有几个值得注意的细节：
- 触摸屏的X+/X-接在ADC1_IN0/IN1上
- Y+/Y-通过74HC4052模拟开关切换
- SD卡采用SPI模式连接（节省GPIO）
- 为LCD和SRAM分别配置独立的FMC总线
3. 图形引擎实现细节
3.1 底层绘图函数优化
所有图形操作最终都归结为像素点的绘制。最基础的DrawPixel函数需要极致优化：
c复制// 使用指针直接操作显存地址
void DrawPixel(uint16_t x, uint16_t y, uint16_t color) {
if(x >= LCD_WIDTH || y >= LCD_HEIGHT) return;
*(__IO uint16_t*)(LCD_FRAME_BUFFER + 2*(y*LCD_WIDTH + x)) = color;
}
画线算法采用Bresenham改进版，避免乘除法：
c复制void DrawLine(int x0, int y0, int x1, int y1, uint16_t c) {
int dx = abs(x1-x0), sx = x0<x1 ? 1 : -1;
int dy = -abs(y1-y0), sy = y0<y1 ? 1 : -1;
int err = dx+dy, e2;
while(1){
DrawPixel(x0,y0,c);
if(x0==x1 && y0==y1) break;
e2 = 2*err;
if(e2 >= dy) { err += dy; x0 += sx; }
if(e2 <= dx) { err += dx; y0 += sy; }
}
}
3.2 图形缩放实现
矩形和圆的缩放本质是参数计算。以矩形为例：
c复制void DrawScaledRect(int x, int y, int w, int h, float scale, uint16_t c) {
int newW = w * scale;
int newH = h * scale;
DrawRect(x - (newW-w)/2, y - (newH-h)/2, newW, newH, c);
}
实际使用中发现，直接在原坐标上计算会产生漂移，因此改为从中心点缩放的设计。
4. 颜色管理系统
4.1 RGB565颜色空间
STM32的LCD控制器通常采用RGB565格式：
- 红色：5位（32级）
- 绿色：6位（64级）
- 蓝色：5位（32级）
颜色定义示例：
c复制#define RGB565(r,g,b) (((r&0xF8)<<8)|((g&0xFC)<<3)|(b>>3))
#define RED RGB565(255,0,0)
#define GREEN RGB565(0,255,0)
#define BLUE RGB565(0,0,255)
4.2 调色板实现
调色板本质是屏幕上的一个颜色选择区域：
c复制void DrawPalette() {
for(int i=0; i<16; i++) {
DrawRect(10, 10+i*15, 30, 15, presetColors[i]);
}
}
uint16_t GetSelectedColor(uint16_t x, uint16_t y) {
if(x>=10 && x<=40) {
int index = (y-10)/15;
if(index>=0 && index<16)
return presetColors[index];
}
return currentColor; // 保持当前颜色
}
5. 图片存储方案
5.1 FATFS文件系统集成
使用FatFs R0.14b版本，配置要点：
c复制// sd_diskio.c中实现磁盘接口
DSTATUS disk_initialize(BYTE pdrv) {
if(SD_Init() != SD_OK) return RES_ERROR;
return RES_OK;
}
DRESULT disk_read(BYTE pdrv, BYTE* buff, LBA_t sector, UINT count) {
if(SD_ReadBlock(buff, sector<<9, 512) != SD_OK)
return RES_ERROR;
return RES_OK;
}
5.2 BMP图片格式生成
BMP文件头结构体设计：
c复制#pragma pack(push, 1)
typedef struct {
uint16_t bfType; // "BM"
uint32_t bfSize; // 文件总大小
uint16_t bfReserved1;
uint16_t bfReserved2;
uint32_t bfOffBits; // 数据区偏移量
uint32_t biSize; // 信息头大小
int32_t biWidth; // 图像宽度
int32_t biHeight; // 图像高度
uint16_t biPlanes; // 1
uint16_t biBitCount; // 16
//...其他字段省略
} BMPHeader;
#pragma pack(pop)
图片保存流程：
- 创建BMP文件并写入头信息
- 从显存读取像素数据（注意RGB565转BMP格式）
- 按行倒序写入（BMP要求从下到上存储）
- 关闭文件
实测发现：直接写入SD卡速度较慢，建议先缓存若干行再批量写入
6. 触摸屏校准算法
6.1 五点校准法实现
校准步骤：
- 在屏幕五个位置显示校准点
- 记录触摸ADC原始值
- 计算转换矩阵
c复制typedef struct {
float a, b, c;
float d, e, f;
} CalibrationMatrix;
void CalculateCalibration(Point display[5], Point touch[5]) {
// 构建矩阵方程 AX=B
float A[10][6], B[10];
//...填充矩阵元素
// 最小二乘法求解
gaussj(A, 6, B, 10);
// 保存校准参数
calib.a = B[0]; calib.b = B[1]; calib.c = B[2];
calib.d = B[3]; calib.e = B[4]; calib.f = B[5];
}
6.2 校准数据存储
将校准参数存入Flash的指定扇区（如Sector 11）：
c复制#define CALIB_ADDR 0x080E0000
void SaveCalibration() {
FLASH_Erase_Sector(FLASH_SECTOR_11, VOLTAGE_RANGE_3);
FLASH_Program_Float(CALIB_ADDR, &calib, sizeof(CalibData));
}
7. 性能优化技巧
7.1 双缓冲机制
建立两个显存缓冲区：
c复制uint16_t frameBuffer[2][LCD_WIDTH*LCD_HEIGHT];
volatile uint8_t activeBuffer = 0;
void SwitchBuffer() {
activeBuffer ^= 1;
LTDC_Layer1->CFBAR = (uint32_t)frameBuffer[activeBuffer];
LTDC->SRCR = LTDC_SRCR_IMR; // 立即重载配置
}
7.2 局部刷新策略
记录脏矩形区域，只刷新变化部分：
c复制typedef struct {
uint16_t x1, y1, x2, y2;
} DirtyArea;
void RefreshDirtyArea() {
if(dirty.x1 > dirty.x2) return; // 无脏区域
// 设置刷新区域
LTDC->AWCR = ((dirty.x2+1)<<16) | (dirty.x1);
LTDC->TWCR = ((dirty.y2+1)<<16) | (dirty.y1);
// 触发刷新
LTDC->SRCR = LTDC_SRCR_VBR;
// 重置脏区域
dirty.x1 = LCD_WIDTH; dirty.y1 = LCD_HEIGHT;
dirty.x2 = 0; dirty.y2 = 0;
}
8. 开发中的经验教训
-
电阻屏抖动问题：
- 原始ADC值波动较大
- 解决方案：采用加权滑动平均滤波
c复制#define FILTER_DEPTH 5 uint16_t touchFilter(uint16_t newVal) { static uint16_t buf[FILTER_DEPTH] = {0}; static uint8_t idx = 0; buf[idx++] = newVal; if(idx >= FILTER_DEPTH) idx = 0; uint32_t sum = 0; for(int i=0; i<FILTER_DEPTH; i++) sum += buf[i]; return sum / FILTER_DEPTH; } -
SD卡写入速度瓶颈：
- 直接单块写入速度仅200KB/s
- 优化方案：建立512KB环形缓冲区
- 实测速度提升至1.2MB/s
-
内存对齐陷阱：
- 发现某些图形操作会导致硬件错误
- 原因：STM32的DMA要求4字节对齐
- 修复：��有显存操作强制对齐
c复制__attribute__((aligned(4))) uint16_t frameBuffer[LCD_WIDTH*LCD_HEIGHT];
这个项目从构思到实现历时三周，最耗时的部分是触摸校准算法的调试。最终的绘画精度测试结果令人满意：在2.8寸屏幕上能达到0.4mm的定位精度，连续绘画2小时无卡顿。SD卡存储测试中，保存1000张320x240的16位色图片仅占用约150MB空间。