axure交互动作

开发工具与关键技术： 交互动作

1、新建一个文本框、一个矩形和两个图标样式并命名（叉对应清除）

2、根据自己需求，更改“搜索”图标尺寸和不透明度

3、还有“清除”图标的尺寸和不透明度

4、设置文本框的提示文字内容为“搜索”并隐藏边框

5、将它们与矩形一起组合成“搜索框控件（不要忘记隐藏“叉”）

6、下面就是文本框的清除文字效果进行设置，首先设置文本框的“文本改变时”，条件1：当元件文字长度不等于0时

7、显示“叉”

8、条件2：当元件长度等于0时

9、隐藏“叉”

10、文本框的所有设置如下

11、设置“叉”的交互动作，文本框的内容为空，再添加一个设置焦点在“文本框”       

12、效果如下

这是我所学到的，所以我要分享给你们，希望可以帮助到你们。

以上就是我的分享，新手上道，请多多指教。如果有更好的方法或不懂得地方欢迎在评论区教导和提问喔！

开发工具与关键技术： 交互动作

作者：陈梓森

撰写时间：2021/5/26

1、新建一个文本框、一个矩形和两个图标样式并命名（叉对应清除）

2、根据自己需求，更改“搜索”图标尺寸和不透明度

3、还有“清除”图标的尺寸和不透明度

4、设置文本框的提示文字内容为“搜索”并隐藏边框

5、将它们与矩形一起组合成“搜索框控件（不要忘记隐藏“叉”）

6、下面就是文本框的清除文字效果进行设置，首先设置文本框的“文本改变时”，条件1：当元件文字长度不等于0时

7、显示“叉”

8、条件2：当元件长度等于0时

9、隐藏“叉”

10、文本框的所有设置如下

11、设置“叉”的交互动作，文本框的内容为空，再添加一个设置焦点在“文本框”       

12、效果如下

这是我所学到的，所以我要分享给你们，希望可以帮助到你们。

以上就是我的分享，新手上道，请多多指教。如果有更好的方法或不懂得地方欢迎在评论区教导和提问喔！