Axure RP9教程 用中继器元件实现一个简单的列表功能

  • 一、说明
  • 二、案例演示
  • 三、操作说明

一、说明

上一篇文章中继器概述将了中继器的作用及结构,下面我通过实例来演示中继器入门基础应用列表展示

二、案例演示

案例中我们通过一个数据字典的列表展示效果,来呈现。

案例链接

三、操作说明

  1. 在画布中添加表格,只保留第一列,并设置背景色及多选框;
  2. 接下来再制作列表内容,首先在画布中添加中继器原件,这是我们发现画布中展示的是三行,并不是我们要的内容展示效果。
  3. 选中中继器鼠标双击进入内部坐标系画图绘制,我们发现里面构造与动态面板类似,为了便于我们制作的类内容与表头对其,我们将右上角 选中取消;
  4. 接下来在中继器内部中我们将原有元件删除,添加表格,这样的目的是我们更方便与表头对齐
  5. 接下来我们给表格每列来命名,为了与后面中继器容器列表一一对应,分别命名为id(选中框),type,code,name,source;
  6. 再回到中继器外部状态,,我们发现再样式中出现一个数据区域

    表头中的列与我们中继器内容中的列要命名一致,便于下一步的绑定关系。
  7. 接下来我们在填充数据内容,这个地方教大家一个小技巧,大家可以将预先设置的数据在excel中制作好,我们只需要将表格内容复制,粘贴过来即可,这样不用手工再一一录入;

数据填充完之后,我们发现列表中数据行添加了,但数据显示为空,这是因为我们缺少了一层数据绑定关系,换句话来讲,列表中并不知道数据对应的是那列,所以无法显示;

  1. 接下来我们开始绑定,切换到中继器交互中我们发现中继器自带了一个每项加载时设置文本交互动作。

    我们只需要在原有的交互基础上继续编辑即可,操作演示如下:

    我们在设置函数值时,必须时中继器中存在的列名;
  2. 剩下操作列大家可以自己完成,与勾选框类似,下一篇将为大家讲述如何实现列表多选及取消多选。

Axure RP9教程 中继器列表相关推荐

  1. Axure RP9教程 中继器说明

    Axure RP9教程 中继器概述 一."中继器"说明 二."中继器"的作用 三."中继器"结构说明 一."中继器"说明 ...

  2. Axure RP9教程 内部框架

    Axure RP9教程 内部框架 一.说明 二.效果演示 三.操作步骤 1.内部页面 2.外部页面 一.说明 内部框架是Axure的一个元件,在PC端设计时比较常见,例如CSDN个人中心后台,根据左侧 ...

  3. Axure RP9之中继器使用

    #Axure RP9中继器使用 一.中继器是什么? 中继器再实际使用中可以看作是一个灵活的表格,相比于简单的拖拽表格,中继器的优势在于后期调整,增加或减少某一列/某一行,可直接在数据中调整 二.使用步 ...

  4. Axure RP9教程 常用函数

    Axure教程 常用函数 一.说明 二.基本语法 三. 数字函数 1.toExponential(decimalPoints) 2.toFixed(decimalPoints) 3.toPrecisi ...

  5. Axure RP9 利用中继器实现表单

    1)将Default元件中的表格移到面板并更新列名 2)只保留表头,并将中继器移到和第一列对齐 3)双击中继器,在中继器编辑界面进行如下步骤 4)依次设置表格中继器名称为name,sex,age 5) ...

  6. Axure RP9教程 音量滑块

    Axure 动态面板实现音量调节 一.说明 二.效果显示 三.操作步骤 (一).设置滑块拖动效果 一.说明 音量滑块设置在PC端及移动端的应用场景相对较少,但在播放器类APP应用场景相对较广,例如调节 ...

  7. Axure 9 实战案例,中继器的应用 3,按条件筛选中继器列表

    前言 Hello!欢迎来到Axure 9 实战案例专栏(进阶篇).(课程简介) 在上一篇教程,我们在普通中继器列表的基础上,加入了交替色和悬停色的效果 (了解更多),这个算是比较简单的,一学就会的交互 ...

  8. Axure rp9入门图文教程——基操及介绍(看完就能上手,人人都是产品经理)

    Axure rp9入门图文教程-基操及介绍 免费版安装包请点击此处(避免审查,请点击这)[^这里] 一.界面介绍 1. 复制.剪切及粘贴区域 2. 选择模式 3. 插入形状 4. 控点(编辑控点) 5 ...

  9. 【原型设计】第三节:Axure RP9 母版的使用说明以及操作教程

    本篇文章为axure 原型设计制作教程 适用版本:axure rp9 母版的使用说明 母版实际上是用于制作,固定界面元素的界面层,一般如后台管理系统的后台系统菜单.小程序的菜单.app的菜单等. 总结 ...

最新文章

  1. 移动web开发---第二天
  2. 『机房工程』弱电必备技能培训PPT/值得您分享
  3. Neo4j Backup:在Mark Needham上存储副本和一致性检查
  4. Redis工作笔记-Jedis的基本使用
  5. [VJ][bfs]Catch That Cow
  6. css实现平角切角和弧形切角效果
  7. vb excel 连续多个值赋值_VB实现向数组中插入元素
  8. oracl的使用命令
  9. python下载网页内容_使用selenium下载整个html页面内容
  10. (清华)华成英模拟电子技术基础PPT(完整版)
  11. 关于惠普打印机可以打印但是无法扫描的问题
  12. 【更新中】SmartGit 注册码 算法注册机
  13. win10企业版2016长期服务激活教程
  14. 基于浏览器内核的被动式爬虫任务下发框架
  15. html中的列表、表格、表单
  16. SpringBoot发送QQ邮件图片显示不出来
  17. 苹果电脑怎么查保修期?
  18. windows下python如何安装模块或包? How to install package or module in windows OS when using PYTHON?
  19. codec和DSP的区别
  20. 股权制的激励制与股权结构

热门文章

  1. 车库,美国IT文明的摇篮
  2. html5图钉效果,图钉风格在美国现代设计发展中的作用与影响
  3. [附源码]计算机毕业设计Node.js应急物资管理系统(程序+LW)
  4. 企业档案管理实务:档案的检索方法知多少
  5. LWUIT的List应用系列(一)List基础
  6. Recycleview 虐我千百遍 我待Recycleview如初恋
  7. 【笔记】LaTeX数学公式
  8. ORB-SLAM2 ORBmatcher.cc读代码一
  9. c盘中哪些文件可以删除
  10. mp4怎么转成gif?分享几个可用的方法!