完整的 SquareStudio 注册登录功能实现方案:已经烧录到开发板正常使用

根据你的需求,我将提供完整的实现方案,解决按钮同时执行多个动作的问题,并确保注册登录功能正常工作。

所需文件结构

需要创建和修改的文件如下:

  1. ui_events.h - 事件处理函数声明
  2. events.c - 实际的事件处理逻辑
  3. ui.c - UI 初始化和事件绑定
  4. 确保CMakeLists.txtfilelist.txt包含新文件

详细步骤

第一步:创建 ui_events.h 文件

复制代码
#ifndef _UI_EVENTS_H
#define _UI_EVENTS_H

#ifdef __cplusplus
extern "C" {
#endif

// 注册按钮事件处理函数
void event_register_btn(lv_event_t * e);

// 登录按钮事件处理函数
void event_login_btn(lv_event_t * e);

#ifdef __cplusplus
} /*extern "C"*/
#endif

#endif

操作:在项目中创建此文件,用于声明事件处理函数。

第二步:创建 events.c 文件

复制代码
#include "ui.h"
#include "ui_helpers.h"
#include "ui_events.h"
#include <string.h>

// 模拟用户数据库
typedef struct {
    char username[50];
    char password[50];
} User;

// 简单的用户存储(实际应用中应使用持久化存储)
static User users[10];
static int user_count = 0;

// 声明回调函数(放在使用前)
static void hide_error_panel(lv_timer_t *timer);
static void hide_success_panel_and_go_welcome(lv_timer_t *timer);

// 检查用户名是否已存在
static bool is_username_exists(const char* username) {
    for(int i = 0; i < user_count; i++) {
        if(strcmp(users[i].username, username) == 0) {
            return true;
        }
    }
    return false;
}

// 验证用户凭据
static bool validate_user(const char* username, const char* password) {
    for(int i = 0; i < user_count; i++) {
        if(strcmp(users[i].username, username) == 0 && 
           strcmp(users[i].password, password) == 0) {
            return true;
        }
    }
    return false;
}

// 添加新用户
static void add_user(const char* username, const char* password) {
    if(user_count < 10) {
        strncpy(users[user_count].username, username, 49);
        users[user_count].username[49] = '\0'; // 确保字符串结束
        strncpy(users[user_count].password, password, 49);
        users[user_count].password[49] = '\0'; // 确保字符串结束
        user_count++;
    }
}

// 错误面板自动隐藏回调
static void hide_error_panel(lv_timer_t *timer) {
    lv_obj_add_flag(ui_Panel6, LV_OBJ_FLAG_HIDDEN);
    lv_timer_del(timer); // 删除定时器自身
}

// 成功面板自动隐藏并跳转页面回调
static void hide_success_panel_and_go_welcome(lv_timer_t *timer) {
    lv_obj_add_flag(ui_Panel3, LV_OBJ_FLAG_HIDDEN);
    _ui_screen_change(&ui_welcomeUI, LV_SCR_LOAD_ANIM_FADE_ON, 500, 0, ui_welcomeUI_screen_init);
    lv_timer_del(timer); // 删除定时器自身
}

// 注册按钮事件处理
void event_register_btn(lv_event_t * e) {
    // 阻止事件传播(LVGL v8.2 常用此函数)
    lv_event_stop_bubbling(e);
    
    // 获取输入框内容
    const char *username = lv_textarea_get_text(ui_uiTextAreaUsername);
    const char *password = lv_textarea_get_text(ui_uiTextAreaPassword);
    
    // 验证输入
    if(strlen(username) == 0 || strlen(password) == 0) {
        // 输入为空,显示错误面板
        lv_obj_clear_flag(ui_Panel6, LV_OBJ_FLAG_HIDDEN);
        
        // 3秒后隐藏错误面板(使用C风格回调)
        lv_timer_create(hide_error_panel, 3000, NULL);
    } 
    else if(is_username_exists(username)) {
        // 用户名已存在,显示错误面板
        lv_obj_clear_flag(ui_Panel6, LV_OBJ_FLAG_HIDDEN);
        
        // 3秒后隐藏错误面板
        lv_timer_create(hide_error_panel, 3000, NULL);
    } 
    else {
        // 注册成功,添加用户
        add_user(username, password);
        
        // 显示成功面板
        lv_obj_clear_flag(ui_Panel3, LV_OBJ_FLAG_HIDDEN);
        
        // 2秒后跳转到欢迎页面并隐藏成功面板
        lv_timer_create(hide_success_panel_and_go_welcome, 2000, NULL);
    }
    
    // 清空输入框
    lv_textarea_set_text(ui_uiTextAreaUsername, "");
    lv_textarea_set_text(ui_uiTextAreaPassword, "");
}

// 登录按钮事件处理
void event_login_btn(lv_event_t * e) {
    // 获取输入框内容
    const char *username = lv_textarea_get_text(ui_uiTextAreaUsername);
    const char *password = lv_textarea_get_text(ui_uiTextAreaPassword);
    
    // 验证用户
    if(validate_user(username, password)) {
        // 登录成功,显示成功面板
        lv_obj_clear_flag(ui_Panel3, LV_OBJ_FLAG_HIDDEN);
        
        // 2秒后跳转到欢迎页面并隐藏成功面板
        lv_timer_create(hide_success_panel_and_go_welcome, 2000, NULL);
    } 
    else {
        // 登录失败,显示错误面板
        lv_obj_clear_flag(ui_Panel6, LV_OBJ_FLAG_HIDDEN);
        
        // 3秒后隐藏错误面板
        lv_timer_create(hide_error_panel, 3000, NULL);
    }
    
    // 清空输入框
    lv_textarea_set_text(ui_uiTextAreaUsername, "");
    lv_textarea_set_text(ui_uiTextAreaPassword, "");
}

操作 :创建此文件,实现注册和登录的核心逻辑。代码中使用lv_event_stop_propagation(e)来阻止 SquareStudio 设置的默认动作,解决按钮同时执行多个动作的问题。

第三步:修改 ui.c 文件

找到ui_init()函数,添加以下代码:

复制代码
// 在ui_init()函数中添加以下代码

// 确保面板初始状态为隐藏
lv_obj_add_flag(ui_Panel3, LV_OBJ_FLAG_HIDDEN);
lv_obj_add_flag(ui_Panel6, LV_OBJ_FLAG_HIDDEN);

// 设置密码框模式
lv_textarea_set_password_mode(ui_uiTextAreaPassword, true);
lv_textarea_set_one_line(ui_uiTextAreaUsername, true);
lv_textarea_set_one_line(ui_uiTextAreaPassword, true);

// 移除可能存在的旧事件回调
lv_obj_remove_event_dsc(ui_uiButtonRegistration, NULL);
lv_obj_remove_event_dsc(ui_uiButtonLogin, NULL);

// 绑定新的事件处理函数
lv_obj_add_event_cb(ui_uiButtonRegistration, event_register_btn, LV_EVENT_CLICKED, NULL);
lv_obj_add_event_cb(ui_uiButtonLogin, event_login_btn, LV_EVENT_CLICKED, NULL);

操作 :在现有ui.c文件的ui_init()函数中添加上述代码,确保在 UI 初始化时正确设置组件属性并绑定事件处理函数。

第四步:更新 CMakeLists.txt

复制代码
SET(SOURCES screens/ui_loginUI.c
    screens/ui_welcomeUI.c
    screens/ui_deskUI.c
    screens/ui_waitUI.c
    screens/ui_gameUI.c
    screens/ui_game1UI.c
    screens/ui_game2UI.c
    screens/ui_Screen8.c
    screens/ui_Screen9.c
    screens/ui_pictureUI.c
    ui.c
    ui_events.h  # 添加头文件
    events.c     # 添加事件处理文件
    components/ui_comp_hook.c
    ui_helpers.c
    images/ui_img_window_png.c
    images/ui_img_car1_png.c
    images/ui_img_car2_png.c
    images/ui_img_kun_png.c
    images/ui_img_desk_png.c
    images/ui_img_cat_png.c
    images/ui_img_woman_png.c
    images/ui_img_car3_png.c
    fonts/ui_font_Font32.c
    fonts/ui_font_Font16.c)

add_library(ui ${SOURCES})

操作 :修改项目的CMakeLists.txt,添加新创建的ui_events.hevents.c文件。

第五步:更新 filelist.txt

复制代码
screens/ui_loginUI.c
screens/ui_welcomeUI.c
screens/ui_deskUI.c
screens/ui_waitUI.c
screens/ui_gameUI.c
screens/ui_game1UI.c
screens/ui_game2UI.c
screens/ui_Screen8.c
screens/ui_Screen9.c
screens/ui_pictureUI.c
ui.c
ui_events.h  # 添加头文件
events.c     # 添加事件处理文件
components/ui_comp_hook.c
ui_helpers.c
images/ui_img_window_png.c
images/ui_img_car1_png.c
images/ui_img_car2_png.c
images/ui_img_kun_png.c
images/ui_img_desk_png.c
images/ui_img_cat_png.c
images/ui_img_woman_png.c
images/ui_img_car3_png.c
fonts/ui_font_Font32.c
fonts/ui_font_Font16.c

操作 :修改filelist.txt,添加新创建的文件。

第六步:在 SquareStudio 中移除默认事件

  1. 打开 SquareStudio,加载你的项目
  2. 找到注册按钮uiButtonRegistration
  3. 检查并移除在 SquareStudio 中为该按钮设置的所有事件(特别是点击事件)
  4. 对登录按钮uiButtonLogin执行相同操作
  5. 确保Panel3Panel6的初始状态设置为隐藏

功能说明

实现后的功能如下:

  1. 注册流程

    • 用户输入用户名和密码
    • 点击注册按钮
    • 系统验证输入:
      • 若输入为空,显示Panel6(错误提示)3 秒
      • 若用户名已存在,显示Panel6(错误提示)3 秒
      • 若注册成功,显示Panel3(成功提示)2 秒,然后跳转到welcomeUI页面
  2. 登录流程

    • 用户输入用户名和密码
    • 点击登录按钮
    • 系统验证凭据:
      • 若验证成功,显示Panel3(成功提示)2 秒,然后跳转到welcomeUI页面
      • 若验证失败,显示Panel6(错误提示)3 秒
  3. 所有流程结束后都会清空输入框

测试步骤

  1. 编译并运行项目
  2. 测试注册功能:
    • 不输入任何内容点击注册 → 应显示错误面板
    • 输入已存在的用户名 → 应显示错误面板
    • 输入新用户名和密码 → 应显示成功面板,然后跳转
  3. 测试登录功能:
    • 使用刚注册的账号登录 → 应成功跳转
    • 使用错误的账号或密码 → 应显示错误面板

这个方案应该能解决你遇到的按钮同时执行多个动作的问题,并提供完整的注册登录功能。如果还有任何问题,请告诉我具体的错误现象或行为。

相关推荐
情深不寿31725 分钟前
进程通信----匿名管道
linux·服务器·开发语言·c++
国科安芯1 小时前
无人机电池通讯接口应用:CANFD工业级芯片的选型与技术要点
网络·单片机·嵌入式硬件·安全·硬件架构·无人机
tan77º2 小时前
【Linux网络编程】传输层协议 - UDP
linux·服务器·网络·udp
chenment2 小时前
踩坑 WSL2 安装 MySQL 失败
linux·mysql·ubuntu
Logcater2 小时前
Linux和Windows基于V4L2和TCP的QT监控
linux·c++·qt·嵌入式·camera·v4l2
添乱2 小时前
「Linux命令基础」用户和用户组实训
linux
dessler2 小时前
RabbitMQ-绑定 (Bindings)
linux·运维·rabbitmq
饶宇航2 小时前
网络编程——聊天程序实现
服务器·单片机·嵌入式硬件
添乱2 小时前
「Linux命令基础」查看用户和用户组状态
linux
无意识积累中2 小时前
LightRAG命令
linux·运维·服务器