青铜修炼手册:Axure按钮的启用和禁用设计

我今天学习了按钮的启用和禁用,所以想拿出来与大家分享一下。我们经常会在一些登录页面看见这种情况:当输入框没有内容时,登录按钮呈灰色状态,而只要你往输入框书写内容,登录按钮就会变成选中状态,如下图所示:

  

要实现以上效果,需要以下步骤:

(1)先在Axure中先按照下图把基本框架给画出来,详细怎么画的我就不说了。基本就一个文本框,一个按钮

(2)点击按钮,然后右方“检视”窗口选择“属性”->交互样式设置->选中->选择填充颜色为蓝色

 (3)同样在“交互样式设置”中选择“禁用”->选择填充颜色为灰色

(4)勾选引用页中的禁用、选中

          (5)选中输入框,然后为其命一个名,在双击交互设置的“文本改变时”

           (6)编辑用例条件,:当输入框中的元件文字为空时

           (7)当输入框里的文字为空时,按钮禁用:

             (8) 在双击“文本改变时”,编辑用例条件,:当输入框中的元件文字不为空时

              (9) 当输入框里的文字不为空时,按钮启用:

              (10)完成,点击预览一下

    原型查看效果地址:https://94245j.axshare.com

    原型RP文件下载地址:https://download.csdn.net/download/qq_27884377/10608945

猜你喜欢

转载自blog.csdn.net/qq_27884377/article/details/81747139
今日推荐