Axure产品原型设计—短信验证码
版本：Axure RP 9
功能描述：点击 “发送验证码按钮”，显示”5s后重新发送”，当减到0s时，显示重新获取按钮
一、效果演示图
二、具体步骤
1. 画验证码输入框
2. 画”发送验证码”按钮
3. 画 “某s后重新发送”
设置隐藏后，将”5s后重新发送”与”发送验证码按钮”重叠
4. 设置交互
4.1 增加”验证码动态面板”
4.2 添加”发送验证码按钮”交互动作
4.3 添加”验证码动态面板”交互动作
最终效果图：
4.4 隐藏”验证码动态面板”
5. 测试
6. 增加”重新获取按钮”
6.1 设置”验证码动态面板”交互样式
6.2 设置”重新获取按钮”交互样式
隐藏重新获取按钮
最终效果如下图
7. 最终测试
8. 调整秒数
为了测试方变，我将秒数设置为5s，大家可根据需要调整
主要调整位置
作者：Luna
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！