1、Axure RP8 使用技巧定制搜索输入框制作搜索框/输入框的下拉列表跟随提示，分三种形式。案例一：搜索框/输入框一案例二：搜索框/输入框二案例三：搜索框/输入框三元件：文本框、中继器、水平线、文本标签、图片、动态面板。分布如下：案例 元件 文本框 中继器 水平线 文本标签 图片 动态面板案例一 案例二 案例三 原理：主要是中继器的使用、字符串函数的使用、动态面板的使用。其中案例二以案例一为基础，案例三以案例二为基础。1、通过中继器的数据管理功能，在中继器显示前添加筛选动作，然后加载筛选出的各项。注：在数据集添加数据列“SearchOption” 。2、在中继器数据集页面，添加数据列和数据。3
2、、在中继器数据集页面，在矩形框中，设置或增加显示数据列的元件（如文本标签、矩形、图片等）及名称。4、回到主页面，添加中继器的交互事件，在“每项加载时 ”事件中，针对各数据列对应的元件设置文字显示。5、在文本输入框元件为中继器“添加筛选”：选中文本输入框，选择交互事件“文本改变时” ，在添加动作中选择中继器的“添加筛选” ，然后在配置动作中选择中继器，设置动作条件。最后编辑条件，也就是中继器的筛选要求，将符合条件的数据项选出。使用字符串函数 indexOf 判断中继器的数据项是否包含文本框中的数据，如Item.SearchOption.indexOf(LVAR1)=0 其中 LVAR1 是为文本
3、输入框的文字设置的局部变量。1. 搜索框/输入框一方法与步骤：1、从元件库拖入【文本框】和【中继器】 ，将【中继器】 设置为“隐藏” 。2、选中【中继器】 ，在属性中设置名称（Name）为“RPL_SearchOption“。如下图。说明：此处【中继器】中的数据为步骤 3 中设置的数据集， 【中继器】初始状态为空。3、双击【中继器】 ，进入中继器配置页面。在“数据集” 中将第 1 列改名为“SearchOption”，并添加数据行。如下图。设置完成后，可以调整矩形框长、宽，返回原页面查看效果和调整元件位置。4、在中继器配置页面选中矩形，选择样式，去掉矩形边框的上线。如下图。注：此处在Axure
4、7.0 中是在属性中选择形状（开口向上的矩形框） 。5、在中继器配置页面拖入【水平线】 ，调整位置及长度，使其位于矩形框的上部，长度等于矩形框长度。在选中水平线的状态下，为水平线在属性名称中命名为“HL_TopBorder” ，并勾选“隐藏”属性。6、返回到原页面，调整文本框和中继器的大小和位置。7、在原页面选择中继器，在属性中添加“交互”事件。 （此中继器交互事件为系统默认自动创建，如果系统没有自动创建，则按照以下步骤进行添加）选取“每项加载时”：双击或点击“+” ，弹出：在“添加动作”中选择“设置文本” ，在配置动作中选择矩形框，然后点击“fx” ，弹出“编辑文本”窗口，点击“插入变量或函
5、数” ，在下拉列表中选取Item.SearchOption。8、继续添加【中继器】 “每项加载时”交互事件，双击或点击 “+”按钮点击“添加条件”：在“条件设立”中选择“值” 、第一个 fx 为“Item.isFirst” ，第二个 fx 中输入“true” 。确定后，回到动作配置， “添加动作”中选择“显示” ， “配置动作”中勾选水平线。在“交互”事件中，右击刚才添加的事件，切换为至此，得到中继器的交互事件如下：9、为文本框添加交互事件。添加事件的方法同上。添加事件的基本过程是：选择事件添加条件 添加动作配置动作。文本框的交互事件如下：Case1：如果文本框不为空：在文本框的“交互”事件中添加中继器的“筛选”动作；在配置动作中，为文本框添加局部变量；插入函数：如果 Item.SearchOption.indexOf(LVAR1)=0 则显示中继器Case2：如果文本框为空，则隐藏中继器。2. 搜索框/输入框二在“搜索框/输入框一”的基础上，修改中继器的数据集和矩形框中显示的内容。1、中继器数据集：增加一列“SummaryLine”：2、矩形框：在矩形框内添加 3 个元件：一个图片、两个文本标签（名称分别为：LBL_Name、LBL_SummaryLine）3、修改中继器的交互事件：让文本标签分别对应中继器数据集中的列。
