axure教程（一）文本框焦点效果

实现目标：

1、 文本框默认显示文字

2、 文本框获取焦点时如果是默认文字，则文本框清空，否则无动作；

3、 文本框失去焦点时如果内容为空，则显示默认文字，否则无动作。

最终效果如下图1：(如果效果不显示，可以单击图片在新页面中查看效果)

图1

实现过程：

1、控件摆放

     A、依次从控件库中拖出“文本面板"和"文本框",然后在“文本面板"中输入"名称"，在"文本框"中输入"输入名称..."，并调整大小；

     B、依次从控件库中拖出“文本面板"和"文本框",然后在“文本面板"中输入"邮箱"，在"文本框"中输入"输入邮箱..."，并调整大小；

2、”名称“文本框获取焦点时，如果输入框里的文字等于默认值，就清空。（不是默认值，就不会有动作。）

      第一步，设置文本框名称

      点中文本框，在右边"部件属性"（若没有部件属性，则如下图2，选中部件属性）的标签下的文本框中输入"名称"，如图3

图2

图3

             第二步，在部件属性页签中，鼠标双击”OnFocus(获取焦点时)“（若没有，则在部件属性中标签下的操作类别按钮栏中点交互按钮），如图4

图4

      第三步，在图4的用例描述中输入一个名称（如name get focus）

      第四步，在图4中点击”添加条件“，设置成图5

图5

第五步，在图4的”第2步：添加动作“的”部件和变量“中点击”设置变量/部件值“，设置 如图6

图6

      第六步，在图6中，点击”打开设置值编辑器“，图7

图7

获取焦点，设置完毕，依次点击”确定“返回。

2、失去焦点时，如果输入框是空的就自动填入默认值。（如果不是空的，就没有动作）

第一步，在部件属性页签中，鼠标双击”OnLostFocus(获取焦点时)“（若没有，则在部件属性中标签下的操作类别按钮栏中点交互按钮），如图8

图8

第二步，在图8的用例描述中输入一个名称（如name lost focus）

第三步，在图8点击”添加条件“，设置成图9

图9

第五步，在图8的”第2步：添加动作“的”部件和变量“中点击”设置变量/部件值“，再点击”打开设置值编辑器“ 设置 如图10

图10

失去焦点，设置完毕，依次点击”确定“返回。

发布一下，看看结果，再练习一下邮件