Axure教程：高保真扫码登录

　　先来看看咱们竣工的功效预览：

　　小伙伴们能够点击这个预览链接，亲手尝尝吧。
(借使发觉了啥BUG，还请困难静静的评论告诉我。)

　　看过功效之后咱们再确认一下咱们要竣工的几脾气能

　　二维码有个失效的时辰；当二维码失效的功夫，扫码不获胜会有个毛病提示；当二维码没有失效的功夫，扫码获胜，须要转移端前进行确认登录；当扫码获胜后，转移端上确认登录后，登录获胜；当扫码获胜后，转移端上废止登录，二维码当即失效。

　　那么，咱们提炼一下几个核心

　　创立二维码失效的时辰，原型中创立为10秒，可自行调治。有个扫描中的形态，当起源扫描的功夫，创立一个短小的扫描时辰，再实行剖断目前二维码是否失效；当二维码失效了，显示毛病提示；当二维码没有失效，显示扫描获胜页面，实行确认登录操作；当操作“确认登录”，转移端回到扫一扫页面，桌面端跳转到首页；当操作“废止登录”，转移端回到扫一扫页面，桌面端的二维码当即失效。

　　奈何竣工上下转移扫描的功效

　　提前打定一个扫描的图片，确定好转移的最高点和最低点。思让它不竭的转移就要创立一个触发点，触发某个变乱就会转移。这里我常用的即是文本输入框（Text Field），由于它有一个交互叫文本转移时。当页面切换到扫描中的页面时，咱们创立一个文本的text，使它的文本实行转移，然后再创立这个文本转移时的交互如下，就能够竣工不竭的扫描形态了。

　　奈何剖断目前的二维码形态

　　当页面跳转到扫描中的形态，就创立起源扫描，我也是愚弄了文本转移时的交互。当须要扫描的功夫创立文本为“扫描中”，愚弄文本框实质的剖断，当文本框text是扫描中，去剖断二维码目前的形态。二维码确当前形态，我也是用了一个文本框来存储。这里要戒备几个点，即是良众功效正在页面切换之前要创立回到初始形态。否则流程走回来的功夫没有正在初始形态，会闪现毛病功效。

　　奈何创立二维码失效时辰

　　失效时辰，当倒计时终止时即是二维码失效之时。于是创立当倒计时的输入框为“0”的功夫，显示失效蒙层即可。

　　这此中另有一个加载中的功效

　　即是正在扫描获胜的功夫，切换到确认登录页面的功夫，会有一个加载中的功效，来看一下慢行动功效。思要竣工这个功效，最初要做如下打定，画出4个半圆由于加载中这个元素原先即是要障翳的，惟有正在须要的功夫才显示。于是就愚弄通盘元素的“显示时”的交互，最初即是半圆1回旋180度，然后半圆4回旋135度，戒备每度回旋时辰要相似。愚弄半圆2、3遮挡后面的半圆1、2，当1、4到指定处所时，再沿途回旋。戒备正在创立回旋行动的功夫，有个更众选项，即是创立回旋的中央点正在什么处所，半圆1当然是右边的中央点，半圆4是左边的中央点。