《Axure微信支付界面制作操作实例》是一篇关于Axure的学习教程,通过简单几步就能实现教程中的效果图效果,当然只学习这一点,并不能完全掌握Axure技巧;你可以通过此加强操作实例,交互产品,界面等多维度案例或实操来进行更多的学习;此教程是由zilin在2021-06-04发布的,目前为止更获得了 0 个赞;如果你觉得这个能帮助到你,能提升你Axure技巧;请给他一个赞吧。
今天教大家怎么制作微信支付界面,微信支付axure原型设计,微信支付的时候,需要输入支付金额和支付密码,具体制作过程如下:
效果查看:
【需求分析】
1、点击数字键盘,在转账金额区域录入对应的金额;
2、点击删除键,删除对应的金额数字;
3、0不能作为第一个数字字符;
4、小数点不能作为第一个字符,并且只能出现一次;
5、小数点只能出现一次;
6、小数点后面最多出现两位数字;
7、所有输入的字符不能超过10个;
【原型设计】
1、拖入转账金额输入框,用于显示转账的金额;
2、拖入0-9,小数点,以及删除和转账等矩形框,如上图那样布局;
【交互设计】
1、对于1-9的数字键盘,判断已经输入的是否大于10,或者是否已经输入了小数点,如果不是,则把数字键盘的字符输入金额输入框;
2、对于0,除了判断步骤1的条件之外,还需要添加是否当前金额输入框是否为空,即如果当前金额输入框为空,则不能输入0(0不能作为第一个字符);
3、对于小数点,除了判断步骤1的条件之外,还需要添加判断当前金额输入框是否为空,以及是否已经输入小数点,即小数点不能为第一个字符,小数点只能输入一次;
4、对于删除键,判断转账输入框的金额是否为空,如果不为空,则删除输入框中最后一个字符;
到了这一步,微信支付小键盘就算完成了,同学们赶紧试试吧。
以上就是Axure微信支付界面制作操作实例全部内容介绍了,关于更多axure9教程信息,欢迎关注北极熊素材库,给你带来最丰富的素材图片和最有用的教程,更多最新资讯。
赠人玫瑰,手有余香
< 上一篇 axure9全局变量和局部变量的应用情况及操作实例
> 下一篇 Axure制作点击切换英文大小写工具操作实例
2022-06-29 09:46
2022-06-16 09:55
首席设计师
高级视觉设计师
高级插画设计师
输入的验证码不正确
评论区
暂无评论