Axure如何制作密码框隐藏与显示效果

我们在登录一个网站时，经常会用到密码登录。为确保密码登录不泄漏，所以密码输入后都不是明文状态，如果要查看密码需要点击一个眼睛的标识才显示。那么，在Axure中，如何制作密码框隐藏与显示效果呢？本文就由小编带大家了解一下，一起来看看吧~

工具/原料

Axure版本:企业版8.0.0.3338

PC电脑：Windows 7

方法/步骤

1.打开Axure，准备一个【文本框】命名password，一个【眼睛logo】。如图

2.复制【password】文本框，生成【password1】，位置同password文本框一样，然后将password1文本框放置在【底层】。如图

3.选择【password】文本框，设置文本框类型为【密码】类型。这样在password文本框输入密码时显示的就不是明文了。如图

4.设置眼睛logo的【鼠标移入时】事件：将文本框password1置于顶层，然后设置password1文本框的值等于password文本框的值，如图

5.设置眼睛logo的【鼠标移出时】事件：将文本框password1置于底层即可，如图

6.完成设置后，预览结果，在输入时显示隐藏文字，查点眼睛logo显示密码明文。如图

总结：

1.打开Axure，准备一个【文本框】命名password，一个【眼睛logo】；

2.复制【password】文本框，生成【password1】，调整位置；

3.选择【password】文本框，设置文本框类型为【密码】类型；

4.设置眼睛logo的【鼠标移入时】事件；

5.设置眼睛logo的【鼠标移出时】事件：

6.完成设置后，预览结果，在输入时显示隐藏文字，查点眼睛logo显示密码明文。

注意事项

Tips:为更好的展示眼睛查看效果，可以再增加睁眼与闭眼的效果。