找回密码
 立即注册
查看: 101|回复: 0

AI单片机与淘晶驰串口屏通讯例程之04【密码登录与修改】

[复制链接]
  • 打卡等级:偶尔看看I
  • 打卡总天数:17
  • 最近打卡:2025-05-06 10:09:39

29

主题

10

回帖

275

积分

中级会员

积分
275
发表于 7 天前 | 显示全部楼层 |阅读模式
大家好,我是『芯知识学堂』的SingleYork,


今天笔者要跟大家分享的淘晶驰串口屏的密码登录与密码修改功能的实现。

很多项目中,为了保护某些参数不被随意修改,往往需要增加密码来保护,

这也是触摸屏常用的一个功能,那么淘晶驰的串口屏,要如何实现密码登录功能呢?

首先,我们在之前建好的HDMI工程中添加2个页面,

一个是登录页面login_page,另外一个是密码修改页面password_page,

同时将其背景图片换成对应的图片:

01.png
(1)login_page页面

02.png
(2)password_page页面

接下来在原本添加的t14文本的“按键弹起”事件中,我们添加如下代码:

03.png

这行代码的功能就是当该文本框被按下时,跳转到login_page页面,

同时这里也做了“是否已经登录成功”的判断:

1、若已登录成功,则点击该文本框时退出登录,同时隐藏“密码修改”控件;
2、未登录成功,跳转到login_page页面进行登录操作。

这里用到了2个新的指令“page”和“vis”,这两个指令的用法如下:

04.png

04-2.png

另外,还有一个login_success变量用于判断是否成功登录,该变量的定义是在Program.s文件中:

05.png

同时,在main_page页面的“前初始化”事件中,我们针对“密码修改”控件做了一些处理,即:

1、若已登录成功,则显示“密码修改”控件;
2、若未登录成功,则隐藏“密码修改”控件;

06.png

同时,我们也让“密码登录”控件t14的文本显示做出一些改变,

这样的话,就可以比较清楚的知道当前到底是“已登录”状态还是“未登录”状态了:

07.png

在login_page页面中,我们先添加一个返回按钮控件,用于返回到main_page页面:

08.png

再添加一个文本控件,命名为password,用于临时存储密码,密码最大长度为10个字符:

09.png

继续添加一个数字变量,用于暂存从用户存储区读出的数据,

后续会用到这个变量来判断串口屏在下载完工程后,是否是第一次上电,然后配置一些默认的参数:

10.png

刚才添加的这两个控件只是用于临时存储数据,调试用,

因此,正常运行的时候我们是不希望他们显示出来,所以在页面初始化的时候,需要将这两个控件隐藏:

11.png

接下来我们再添加一个文本控件,在用户输入密码错误的时候提示用户:

12.png

继续添加一个文本控件,作为密码的输入框,通常在输入密码时我们是不太希望被别人看到,

所以需要将其pw属性设置为“是”,这样的话,在输入密码的时候就不会显示真是的密码文本,会以“*”来显示:

13.png

继续添加数字键盘上的控件,笔者使用的是按钮控件,

添加好控件并在该控件的弹起事件中添加如下代码,其他属性参考下图即可:

14.png

其他的几个数字也是用同样的方式,

只有“回删”和“确定”两个按键的按键弹起事件中的代码有所区别,

其中“回删”的代码如下:

15.png

“确定”按键的功能就稍微多一些,需要对输入的密码进行判断:

1、当输入的密码为我们设定的“普通密码”或不可修改的“超级密码”时,

则登录成功并跳转到main_page页面;

2、当输入的密码不是我们设定的“普通密码”或不可修改的“超级密码”时,

则在t0文本控件中显示“密码错误,请重新输入密码”提醒用户。

16.png

另外,在login_page页面初始化的时候,我们还需要做如下处理:

1、从用户存储区0的位置读取4个字节的数据到init_num控件中,

用于判断串口屏是否是第一次上电;

2、如果串口屏是第一次上电,那么使用默认密码并将默认密码存储到用户存储区20的位置,

同时也将“是否是第一次上电”的标志存储到用户存储区0的位置;

3、从用户存储区20的位置读取数据到password文本控件中,

用于后续密码的判断,读取的数据量为password控件最大设置(txt_maxl)值+1;

17.png

这里又用到了2个新的指令“repo”和“wepo”,关于这两个指令的详细用法如下:

17-1.png

继续添加一个“触摸捕捉”控件,用于触摸串口屏时让蜂鸣器发出提示音:

18.png

接下来,我们切换到password_page页面,这个页面大部分控件的内容跟login_page页面一样,

笔者这里只介绍不一样的地方,想通的地方就不再赘述。

首先是添加一个“变量”控件,命名为pd_select,用于区分密码输入框选中的是哪一个,该变量的初始值设置为0:

19.png

接下来在password_page页面前初始化事件中添加如下代码,

这断代码的作用也是用于区分当前选中的是第1次密码输入框还是第2次密码输入框:

20.png

在用户点击第1次密码输入框时,响应如下代码:

21.png

在用户点击第2次密码输入框时,响应如下代码:

22.png

通过改变变量pd_select的值以及两个文本输入框背景色,

就可以让用户很方便的知道当前选中的是哪一个密码输入框了。

1、当用户选择的是第1次密码的输入框时,数字按键按下时就在第1次密码输入框中显示;
2、当用户选择的是第2次密码的输入框时,数字按键按下时就在第2次密码输入框中显示;

23.png

两次密码都输入完成后,我们就可以点击“确认”,来对比两次输入的密码是否一致,

如果一致,则密码修改成功;

如果两次密码不一致,则提示用户“两次密码不一致”,让用户重新输入新的密码:

24.png

当然咯,这里没有考虑两次密码都没有输入的情况,

感兴趣的小伙伴们可以自行添加判断逻辑试一下。

最后,再添加一个“触摸捕捉”控件来实现触控提示音的效果:

25.png

至此,单片机与淘晶驰串口屏的通讯例程就讲完了,在生成生产文件后,

我们将HDMI工程文件下载到串口屏中,并将单片机板跟屏连接起来,就可以看到如下的效果了:



最后附上整个项目的源码,需要的小伙伴们可以自行下载:

单片机与淘晶驰串口屏通讯例程项目源码.zip (3.53 MB, 下载次数: 2)



1-0.png

本帖被以下淘专辑推荐:

回复

使用道具 举报 送花

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|手机版|小黑屋|深圳国芯人工智能有限公司 ( 粤ICP备2022108929号-2 )

GMT+8, 2025-5-12 14:03 , Processed in 0.121595 second(s), 48 queries .

Powered by Discuz! X3.5

© 2001-2025 Discuz! Team.

快速回复 返回顶部 返回列表