触摸按钮执行自定义任务组件
触摸按钮执行自定义任务组件https://www.bilibili.com/video/BV12nRzYPEH4/?share_source=copy_web&vd_source=c0cd4c87f6dcc19bcebab2f4cf3c40db
项目简介
本项目基于STC8H8K64U + RA8889/RA6809 + TFT显示屏(1024x600) + GT911触摸屏实现了一个多功能触摸按钮组件。系统具备按钮控制后执行任务的功能，可用于各类触摸屏人机交互场景。
硬件平台
[*]MCU: STC8H8K64U（51单片机）（注：51 / ARM等单片机皆可）
[*]显示控制器: 瑞佑科技 RA8889或者RA6809
[*]显示屏: TFT 1024x600分辨率
[*]触摸屏: GT911电容触摸屏
[*]MCU--显示控制器的通信方式: SPI-4
软件架构软件主要包含以下几个模块：
[*]主程序模块: 实现系统初始化、主循环和事件处理
[*]按钮控件模块: 实现按钮的创建、绘制和交互处理
[*]触摸屏模块: 实现触摸事件的扫描和处理
[*]扩展：文字滚动模块: 实现文字的滚动显示效果
主要功能系统提供四种测试按钮，分别实现不同的功能：
[*]Flat Button: 平面按钮，点击后执行绘图，显示字符串两个任务
[*]Round Button: 圆角按钮，点击后执行绘图，显示字符串两个任务
[*]Disabled Button: 禁用按钮，禁用后按钮不可使用的显示状态
[*]Standard Button: 标准按钮，3D效果，点击后执行弹跳球动画与滚动显示的字符串两个任务
功能流程图
1. 主程序流程
2. 文字滚动功能流程 (Test_Click4)
代码详解
1. 主程序初始化主程序在初始化阶段完成以下工作：
[*]配置MCU的I/O口
[*]初始化SPI通信
[*]初始化RA8889/RA6809显示控制器
[*]初始化GT911触摸屏
[*]加载背景图像
[*]创建和配置按钮控件
[*]显示提示信息
void main()
{
// 声明按钮指针
BUTTON* btn1;
BUTTON* btn2;
BUTTON* btn3;
BUTTON* btn4;
// MCU I/O口配置
P0M0 = 0xff & cClrb5; // 设置P0.5为双向口模式（SPI_MISO）
P0M1 = 0x00;
// 更多I/O配置...
// SPI初始化
SPI4_Init();
// RA8889硬件复位和初始化
RA8889_RST = 1;
delay_ms(1);
RA8889_RST = 0;
delay_ms(1);
RA8889_RST = 1;
RA8889_Initial();
// 初始化触摸屏
GT911_Init();
// 加载背景图像
SPI_NOR_initial_JPG_AVI(1,0,BUS1,CS1,1);
JPG_NOR(BINARY_INFO.start_addr, BINARY_INFO.img_size, canvas_image_width, 0,0);
// 显示PNG图片
SPI_NOR_initial_DMA (4,BUS1,CS1,1,0);
SPI_NOR_DMA_png (BINARY_INFO.start_addr,Layer1,0,BINARY_INFO.img_width,BINARY_INFO.img_height);
BTE_alpha_blending_32bit_Pixel_mode(BINARY_INFO.img_width,BINARY_INFO.img_width,BINARY_INFO.img_height,
800,530,Layer0,canvas_image_width,
800,530,Layer0,canvas_image_width,
Layer1);
// 显示标题文字
Foreground_color_16M(color16M_white);
Select_Font_Height_WxN_HxN_ChromaKey_Alignment(24,2,2,1,0);
Goto_Text_XY(280,20);
Show_String("Button Control Example");
// 初始化按钮控件
Button_Init();
// 创建并配置4个按钮
// ...创建按钮代码...
// 绘制所有按钮
Button_DrawAll();
// 显示提示信息
// ...显示提示代码...
// 主循环
while(1) {
// 检测触摸屏
if(CTP_INT == 0){
GT911_Scan();
}
// 处理按钮触摸
Button_HandleTouch();
// 延时
delay_ms(10);
}
}2. 文字滚动功能 (Test_Click4)
文字滚动功能实现了一个从左向右滚动的文本显示效果，同时展示了一个弹跳球动画：
[*]文本从右向左滚入屏幕，然后向右滚动
[*]两段文本之间有10个空格的间隔，形成循环显示
[*]弹跳球在固定区域内自由运动，碰到边界会改变方向
void Test_Click4(void)
{
// 变量声明
char str[] = " Button 4 custom function executed!";
char display_buffer;// 滚动文本缓冲区
char temp; // 临时缓冲区
int str_len; // 字符串长度
int display_width = 40; // 显示区域宽度
int start_pos = -display_width + 5;// 起始位置
int i, j;
int x, y, dir_x, dir_y; // 球的位置和方向
// 初始化文本和区域
// ...初始化代码...
// 准备滚动文本：原文本 + 10空格 + 原文本
str_len = strlen(str);
strcpy(display_buffer, str);
// 添加空格
for(i = str_len; i < str_len + 10; i++) {
display_buffer = ' ';
}
// 添加第二段文本
strcpy(&display_buffer, str);
display_buffer = '\0';
// 初始化弹跳球参数
x = 38;
y = 15;
dir_x = 1;
dir_y = 1;
i = 0;
// 动画循环
while(1){
// 清空区域
BTE_Solid_Fill(0,canvas_image_width,0,LCD_Height,color16M_white,300,150);
// 更新球位置并绘制
// ...球位置更新代码...
// 显示滚动文本
memset(temp, ' ', display_width); // 用空格填充临时缓冲区
temp = '\0'; // 确保字符串正确终止
// 处理负值的start_pos
if(start_pos < 0) {
// 先填充部分空格
for(j = 0; j < -start_pos && j < display_width; j++) {
temp = ' ';
}
// 再填充可见的字符串部分
for(; j < display_width && j + start_pos < strlen(display_buffer); j++) {
temp = display_buffer;
}
} else {
// 正常填充
for(j = 0; j < display_width && j + start_pos < strlen(display_buffer); j++) {
temp = display_buffer;
}
}
temp = '\0'; // 确保字符串终止
// ...显示文本代码...
// 更新滚动位置
start_pos++;
if(start_pos > str_len + 10) {
start_pos = -display_width + 5;
}
// 检测退出条件
if(CTP_INT == 0) break;
}
}
使用说明
程序操作流程
[*]程序启动后，会显示四个按钮和提示信息
[*]点击不同的按钮可以进入不同的功能模式：
- Flat Button: 绘图和显示一串字符
- Round Button: 绘图和显示一串字符
- Disabled Button: 绘图和显示一串字符
- Standard Button: 显示弹跳球和滚动文字效果
文字滚动模式使用说明
[*]点击"Standard Button"进入文字滚动和弹跳球模式
[*]观察文字从左向右滚动效果和弹跳球动画
[*]触摸屏幕任意位置可以退出该模式
注意事项
[*]触摸坐标可能需要根据实际屏幕分辨率进行换算
[*]文字滚动功能中，如果出现末尾显示多余字符的问题，请检查temp缓冲区的初始化和终止符设置
请至"组件与控件中心"栏目下载。
页:
[1]