这篇文章是对后台原型的增删改查选显6个功能讲解的最后一篇文章了，其他三篇可以查看《axure8.0快速入门新手教程：全选反选》、《axure8.0快速入门新手教程：添加删除》和《axure8.0快速入门新手教程：修改查询》。这里的排序和分页主要是属于显示这一功能上的，当数据量特别多的时候，排序和分页甚至是不可或缺的，这里就讲讲如何制作排序和分页的原型。
第一步：拖拉摆放好相关控件
1、数据表格（表头）：1行4列，灰底黑框的表格作为表头，从左到右每个格子的文字分别为：姓名、性别、年龄、电话，字体全部加粗，并且在年龄旁边放一个白色的倒三角形，命名为“三角形”；
2、数据表格（表身）：一个中继器，中继器里面是一个1行4列，白底黑框的表格，从左到右4个格子分别命名为“姓名”、“性别”、“年龄”、“电话”。
3、分页：5个黑框白底的矩形，文字分别为：首页、1、2、3、末页。
第二步：为中继器设置数据库和交互用例
中继器中的数据库设置如下：
为中继器添加每项加载时用例
用例中设置“姓名”的文本对应中继器数据库的“name”列；
用例中设置“性别”的文本对应中继器数据库的“sex”列；
用例中设置“年龄”的文本对应中继器数据库的“age”列；
用例中设置“电话”的文本对应中继器数据库的“tel”列。
第三步：为年龄按钮设置鼠标单击时交互用例
1、为中继器添加排序，属性为age，排序类型为Number，顺序为切换，默认为升序。
2、相对旋转“三角形”180度，方向为顺时针，锚点为中心。
第四步：为5个分页按钮设置鼠标单击时用例
例如首页按钮，鼠标单击时设置中继器当前页面value值为1，而1页、2页、3页和末页四个按钮分别设置中继器当前页面value值为1、value值为2、value值为3和Last。
点击预览，然后“年龄按钮”或者“点击分页按钮”，就可以看到排序分页的效果了。同时也可以随时关注我的个人博客：http://niubipm.cn，因为工作过程中有很多这些axure原型设计小技巧的例子，所以我会坚持分享下去，希望对大家有帮助，你们对我的关注就是我的动力。
效果图：axure原型设计之排序分页
更多原型案例：http://niubipm.cn
作者：牛B产品经理
转载请注明出处：http://niubipm.cn/a/chanpinsheji/Axure/2018/0505/181.html
