1. 主页 > 设计资讯 > 热门新闻

Axure教程:条件查询

条件查询是一个常用的函数。今天小猿给大家展示一下如何实现条件查询。通过这个练习,你可以掌握局部变量和中继器。

效果如下:

Axure教程:条件查询(图1)

需求分析

1.默认显示所有用户列表,共7条记录;

2.输入年龄范围(最大和最小),点击〖查询〗按钮,显示年龄在输入条件之间的用户;

3.如果只输入年龄上限,点击〖查询〗后,会显示年龄低于年龄上限的用户;

4.如果只输入年龄下限,点击〖查询〗按钮,显示年龄在年龄下限以上的用户;

5.如果既没有输入上限也没有输入下限,点击查询后显示所有用户;

原型

1.将两个输入框作为上下年龄输入框从画布拖到画布上;

2.在查询按钮中拖动;

3.在中继器中拖动并显示用户列表;

Axure教程:条件查询(图2)

4.设置中继器中的列和数据;

Axure教程:条件查询(图3)

交互式设计

1.中继器初始化:设置中继器的各个加载功能,并在中继器中分别设置相应的列值;

Axure教程:条件查询(图4)

2.设置查询按钮的点击事件:

Axure教程:条件查询(图5)

Axure教程:条件查询(图6)

此时,条件查询完成。同学们,快来试试。

本文由设计学习网整理发布,不代表设计学习网立场,转载联系作者并注明出处:https://ffjianzhan.cn/xingyezixun/sjwz/503.html

联系我们

在线咨询:点击这里给我发消息

微信号:

工作日:9:30-18:30,节假日休息