axure实现搜索功能_Axure案例：电商网站下拉搜索框的制作

Axure案例应用

电商网站的搜索框，对商品、店铺和卖家进行搜索。切换下拉框中的内容时，切换到不同的搜索输入框，样式也相应改变，下面通过设置下拉列表框“选中项于”逻辑条件，实现上述交互效果。

Axure选中项值用例条件

设置选中项值的基本逻辑表达式为：如果“选中项值”等于“值”，那么执行动作

选中项值对应部件：下拉列表框

逻辑条件设置灵活，分别可以设为：

-值1：选中项值：可以设置部件

-运算符号：可以设置为：等于、不等于、小于、大于、小于或等于、大于或等于、包含、不包含、是、不是

-值2：可以设置为值、变量值、部件值、变量及部件值长度、动态面板状态

Axure制作原型：步骤1拖入一个下拉列表框，双击“下拉列表框”，打开编辑选项窗口，点击“+”号，添加3个列表值：商品、店铺、卖家，在部件交互和注释命名名称为：搜索条件

步骤2拖入2个矩形到编辑页面，设置矩形大小：h:35，一个放到最下面，做为搜索框的背景，另一个做为搜索按钮，编辑矩形文本为：搜索。设置2个矩形边框颜色：红色；搜索按钮填充颜色：红色

步骤3拖一个文本框(单行)到编辑页面，设置位置与大小ÿ