Axure获取验证码倒计时交互
产品经理往往在公司中,会做一些高保真的交互,比如说:“轮播图、倒计时、吸附效果、下拉刷新等等”。今天我要分享的是在我们日常的APP中,当登录到QQ、微信页面的时候,用户如果忘记密码了,我们可以输入手机号,然后点击获取验证码,来进行忘记密码的登录。当60s倒计时结束时,可以在继续点击获取验证码,来进行倒计时。倒计时从60秒开始倒计。好了废话不多说了,开始讲验证码的交互效果。
1.设置元件:登陆页面(手机号码、验证码输入框、登录、发送验证码按钮);
2.创建循环面板;
3.验证码按钮-单击时-设置面板状态下一步,每隔1000毫秒循环一次;
4.发送验证码按钮-设置变量x;
5.循环面板:
a)设置文本-剩余x秒;
b)设置变量值x-1;
c)增加用例1(逻辑)变量值x>0时继续循环;
d)增加用例2(逻辑)变量值x=0时显示验证码;
6.发送验证码锁定状态,增加用例元件文字=发送验证码时可以进行点击操作。