养生 装修 购物 美食 感冒 便秘 营销 加盟 小吃 火锅 管理 创业 搭配 减肥 培训 旅游

Axure设计:随机生成6位字符的强密码

时间:2024-11-06 11:10:42

上周,分享再次分享了“强密码验证”(可参考以下链接),随后就联想到了随机生成密码的问题,所以再接再厉,完成了”随机生成6位字符的强密码“设计,具体效果如下:

Axure设计:随机生成6位字符的强密码

工具/原料

AxureRP8

方法/步骤

1、按图,构建“强密码”皮薹匆热控件:1.新建1文本框,命名为”Password“2.新建1文本标签,命名为”lastone“,内容随意,我这里设置为”字符高酿眚郁“3.新建4个文本标签,分别命名为”Special“、”number“、”capital“、”Lowercase“,文本内容为0;4.新建5个文本标签,分别命名为”Special_string“、”number_string“、”Lowercase_string“、”capital_string“、“string”5.新建1个文本标签,命名为”num“,文本内容为6;6.新建1矩形,命名为“key”,内容为“生成随机密码”

Axure设计:随机生成6位字符的强密码

2、7.设置”Spe罕铞泱殳cial_string“内容为”~!@#$%^&*()_+-=|}{[]\:&q锇栀劐箨uot;;'<>?,./“8.设置”number_string“内容为”1234567890“(这个文本标签,可以不用)9.设置”Lowercase_string“内容为”abcdefghijklmnopqrstuvwxyz“10.设置”capital_string“内容为”ABCDEFGHIJKLMNOPQRSTUVWXYZ“11.设置“string”内容为“ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890~!@#$%^&*()_+-=|}{[]\:";'<>?,./”

Axure设计:随机生成6位字符的强密码

3、除了“文本框:Password”和”矩形:key“外的组件,全部设置为”隐藏“

Axure设计:随机生成6位字符的强密码

4、要随机生成6位字符强密码,需要做到以下2点:1.强密码判定(前篇有介绍,可以参考以下链接)2.字符数量需要控制(循环方式,考虑再次调用事件来模拟循环)

5、所以,所有的交互动作,都在”矩形:key“的”鼠标单击时“的操作中~

Axure设计:随机生成6位字符的强密码

6、用例:Case1判定条件:”元件文字:num“的值等于6

Axure设计:随机生成6位字符的强密码

7、动作:---设置”文本框:Password“内容值为”“---(设置内容值为”空“值)

Axure设计:随机生成6位字符的强密码

8、用例:获取字符判定条件:”元件文字:num“的值大于0

Axure设计:随机生成6位字符的强密码

9、动作:---设置”矩形:lastone“内容值为”[[LVAR1.charAt(M瞢铍库祢ath.floor烫喇霰嘴(Math.random()*LVAR1.length))]]“---其中,“元件文字:string”为局部变量LVAR1;

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

10、用例:特殊字符判定条件:”元件文字:Special_string“包含”元件文字:lastone“

Axure设计:随机生成6位字符的强密码

11、动作1:---设置”文本框:Password“内容值为”[[Target.text]][[LVAR1]]“---其中,“元件文字:lastone”为局部变量LVAR1;

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

12、动作2:---设置”文本标签:Special“内容值为”1“设置”文本标签:num“内容值为”[[Target.text-1]]“---

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

13、同理,设置”数字“、”小写字母“和”大写字母“

14、用例:数字判定条件:”元件文字:number_string“包含”元件文字:lastone“

Axure设计:随机生成6位字符的强密码

15、动作1:---设置”文本框:Password“内容值为”[[Target.text觥终柯计]][[LVAR1]]“---其中,“元件文字:lastone”为局部变量LVAR1;

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

16、动作2:---设置”文本标签:number“内容值为”1“设置”文本标签:num“内容值为”[[Target.text-1]]“---

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

17、用例:小写字母判定条件:”元件文字:Lowercase_string“包含”元件文字:lastone“

Axure设计:随机生成6位字符的强密码

18、动作1:---设置”文本框:Password“内容值为”[[Target.text]][[LVAR1]]“---其中,“元件文字:lastone”为局部变量LVAR1;

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

19、动作2:---设置”文本标签:Lowercase“内容值为”1“设置”文本标签:num“内容值为”[[Target.text-1]]“---

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

20、用例:大写字母判定条件:”元件文字:capital_string“包含”元件文字:lastone“

Axure设计:随机生成6位字符的强密码

21、动作1:---设置”文本框:Password“内容值为”[[Target.text觥终柯计]][[LVAR1]]“---其中,“元件文字:lastone”为局部变量LVAR1;

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

22、动作2:---设置”文本标签:captial“内容值为”1“设置”文本标签:num“内容值为”[[Target.text-1]]“---

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

23、用例:循环判定条件:”元件文字:num“的值大于0

Axure设计:随机生成6位字符的强密码

24、动作:---触发”矩形:key“的”鼠标单击时“的事件---

Axure设计:随机生成6位字符的强密码

25、用例:重新生成判定条件:”元件文字:num“的值等于0且”值:[[LVAR1+LV钽吟篑瑜AR2+LVAR3+LVAR4]]“小于3----幻腾寂埒-其中,“元件文字:Special”为局部变量LVAR1,“元件文字:number”为局部变量LVAR2,“元件文字:capital”为局部变量LVAR3,“元件文字:lowercase”为局部变量LVAR4

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

26、动作:---设置”矩形:num“的值为6触发”矩形:key“的”鼠标单击时“的事件---

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

27、用例:显示判定条件:”元件文字:num“的值等于0且”值:[[LVAR1+LVAR闸拊福律2+LVAR3+LV帆歌达缒AR4]]“大于等于3-----其中,“元件文字:Special”为局部变量LVAR1,“元件文字:number”为局部变量LVAR2,“元件文字:capital”为局部变量LVAR3,“元件文字:lowercase”为局部变量LVAR4

Axure设计:随机生成6位字符的强密码

Axure设计:随机生成6位字符的强密码

28、动作:---设置”矩形:num“的值为6---

Axure设计:随机生成6位字符的强密码

29、看来,随机生成一个强密码也不是那么难啊,虽然用了一个很笨的法子,但逻辑相对来说简单,设置也不是很复杂~

Axure设计:随机生成6位字符的强密码

30、觉得不错,对你有帮助的话,请投个票,加个赞哦~

© 一点知识