axure学习之动态面板，天猫淘宝登录框

今天进入了一下天猫，发现登录框早已经不复从前的样纸了，原来只是两个矩形框来回切换，果然设计的进步就是打破常规，打算自己做一个练练手~~

先附上最终效果图：

看起来还不错是嘛~其实也没那么难实现，步骤比较详细，比较适合新手~

1.首先，在原件库找到动态面板，拖入到画布上，尺寸设置的和登录框大小差不多就ok。

2.拖入动态面板你会发现面板下方出现了state1，state代表状态，可以右击state1可以继续添加多个状态，状态对应需要显示的不同的页面，比如登录框目前只有扫码登录和账号密码登录也就是两个状态，所以建立两个state就行啦（此处最好给每个状态都命名一下，这样状态多的时候也不会乱了）

3.建立好状态后，双击进入每个状态里，先进入扫码登录的state里，在蓝色动态边框里把扫码登录的界面画好，如下图，然后点击右上角的图片建立事件为鼠标单击时-选择动态面板状态-账号密码登录state、选中状态-该原件 值=true

4.同理，进入账号密码state中，画好界面点击右上角的图片，建立事件为鼠标单击时-选择动态面板状态-扫码登录state、选中状态-该原件 值=true，如下图

完成，最后就可以进行预览效果啦~~~~

还有还有二维码扫描有惊喜哦！