0
点赞
收藏
分享

微信扫一扫

Axure百度模糊查询功能


本文实现的效果是类似于百度等众多网站的模糊查询功能,如图所示

Axure百度模糊查询功能_axure


1.建立Axure,本文以百度为例,便于了解。


2.插入一个单行文本框,长度根据自己的需求设定,文本框后面插入按钮。

Axure百度模糊查询功能_动态面板_02


 3.在文本框下面建立一个动态面板,命名为“搜索列表”,点击动态面板的state1,编辑state1,拖动矩形到state1里面,并在矩形中添加内容,然后设置矩形的边框为none。本文以“天”字为例。

Axure百度模糊查询功能_axure_03

 

4.开始设置动作交互,单击文本框,当在文本框输入“天”时显示动态面板。当在文本框中输入非“天”时隐藏动态面板。

Axure百度模糊查询功能_百度_04



Axure百度模糊查询功能_axure_05


5.编辑动态面板的state1状态,选中“天气预报”对其添加单击事件,例如单击“天气预报”时搜索列表自动隐藏,且文本框显示“天气预报”。

Axure百度模糊查询功能_动态面板_06


7.编辑动态面板的state1状态,分别编辑其他选项

 

8.回到【百度】页面,按F5预览原型

 

举报

相关推荐

0 条评论