关注移动产品设计 By Cola
Axure教程|使用Axure模拟阿里软件平台登录和跳转(五)
七. 登录效果实现。
1. 增加安全登录选项
使用Dynamic Panel实现两种模式切换效果:
增加安全登录层,含“普通登录”和“安全登录”
制作“普通登录”效果:
2. 判断逻辑准备
当用户点击“普通登录”时,需要判断当前用户输入的用户名,密码是否正确(对验证码的校验效果相同),所以需要对登录按钮增加Interactions:
判断:当按下登录按钮时,判断Text控件的文本内容是否满足“ID=Cola”,“PW=Cola”?
如果用户名/密码正确,跳转到“登录成功页面”;
如果用户名/密码不正确,出现文案:“用户名名密码错”
注:此处用户名和密码可自定义,达到演示效果即可。
另外,在“会员名”输入框后放置“用户名密码错提示”文案提示,待调用,如图:
3. 逻辑实现
选择“普通登录”按钮,点击“Add Case”,养成良好的习惯,建议编辑每个Case名称,再点击“Add Condition”,如图:
当变量“ID”和“PW”同时满足条件时,如图:
当前页面打开“登录成功页面”
********************************************************************************
* 更多详细内容参见源文件:Axure案例使用Axure模拟阿里软件平台登录.rp *
* 也可打开已经输出的页面: “Axure案例使用Axure模拟阿里软件平台登录”演示页面 *
********************************************************************************
注:由于本期教程制作时间跨度过大,加上我记性不太好,导致教程内容和输出文件有不符之处,请大家谅解。最终内容以源文件及输入页面为准。
在后期的教程中,我会缩短教程篇幅,避免此类问题发生的同时使教程更具可读性。
另外在察看输出页面的时候如有疑问或拍砖讨论,请点击右上方的“e网打进”对话框,一般我都会在线
相关文章:
2009年6月8日 Axure教程|使用Axure模拟阿里软件平台登录和跳转(一)
2009年6月9日 Axure教程|使用Axure模拟阿里软件平台登录和跳转(二)
2009年6月12日 Axure教程|使用Axure模拟阿里软件平台登录和跳转(三)
2009年6月12日 Axure教程|使用Axure模拟阿里软件平台登录和跳转(四)
Posted from Hangzhou, Zhejiang, China.
| 打印文章 | 这篇文章由Cola于2009年08月11日 16:24发表在Axure实例, Axure教程。你可以订阅RSS 2.0 也可以发表评论或引用到你的网站。 |





大约5月前
我很郁闷,你中间该详细说的地方不详细,不用那么详细的地方说得那么详细,再加上我的是中文版的,搞了半天很多地方没明白,还不如我自己去乱折腾。。。。
大约5月前
Re 谢三少:非常抱歉
不过自己实践还是硬道理,我当初也是这么来的 :)
大约4月前
谢谢,但教程很多部分语意不详,下载了文件才弄懂个差不多~
ps.怎么把拉出来的动态层和模块结合起来?就是文件中点击Dynamic Panel Manager里的“选择账号面板”后面的隐藏按钮,动态层和层下面的模块一起隐藏了?
大约4月前
Re Tsitan:收到,文字表述方面还有待加强。关于一起隐藏的问题,应该是该模块就在这个层里。
大约3月前
请问有已经完成的作品吗 ?
大约3月前
@, 那篇文章里应该有源文件下载 :)