axure 元件库(动态面板、中继器)基本使用!!!

axure总览

axure是一个专业的快速原型设计工具。
所谓原型,即形式或模型;那原型在axure当中指的就是软件模型(产品或数据系统的一个基本的实用模型)。
软件原型包含但不限于:功能、交互、IU。

在前端领域来说 ,axure是设计软件模型的一个基本的实用工具。
以下对在最近的axure学习中遇到的问题做一个总结吧。axure界面

元件库

元件库当中,动态面板和中继器使用频率较高,需要熟悉掌握。

动态面板

包含多个状态,通过一些事件对动态面板的状态进行切换,但在任何时候有一个状态可见,或者整个动态面板都是被隐藏的。
那么什么时候我们需要用到动态面板呢?就用经典的轮播图来说吧。
轮播图就是一个指定的区域切换状态,呈现更丰富的内容。
方法如下:

  1. 拖动动态面板到编辑区域
  2. 给动态面板添加4个状态在这里插入图片描述
  3. 双击状态1进入状态1编辑区域,添加图像,状态234同理在这里插入图片描述
  4. 单击动态面板在属性的交互事件中找到载入时;双击进入设置,找到设置面板状态,如图片操作; 在这里插入图片描述点击确定,发送预览,就可以看到四张图片自动轮播了。

这个学会我们进阶到以下操作:在这里插入图片描述只有在刚刚轮播的基础上添加三步就可以实现按钮对应变色功能了。

  1. 添加4个椭圆并设置当选中时想要变换的颜色

在这里插入图片描述
2. 椭圆与动态面板建立连接,连接点在哪?那就是每个状态改变的时候椭圆也要变色,事件就是当面板状态发生改变时,那么怎么能实现椭圆变色与图片一一对应呢?九需要设置条件,比如面板状态切换到状态1的时候,设置选中椭圆1的值为真,其他三个椭圆的值为假。在这里插入图片描述

  1. 有几个状态就需要设置几次,这样你便可以得到一个简单有营养的轮播图啦。哈哈哈哈哈~

中继器

中继器相当于一个模板,构造一个表格,往表格当中有序的添加东西,提供增删改查等功能。那么中继器应用于哪里呢?以下图片给大家一个参考。在这里插入图片描述使用中继器能够快速完成这种结构的搭建,只需要3步走

  1. 拖拽一个中继器,双击点进。开始设置表格样式

  2. 填写中继器属性中的数据库表格在这里插入图片描述

  3. 表格内容与中继器样式建立连接
    在这里插入图片描述
    这里还有两个网址:
    iconfont: https://www.iconfont.cn/.
    fontawesome : https://fontawesome.com/.

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Axure是一款功能强大的原型设计工具,可以用来设计和创建交互式原型。而京东动态面板Axure的一个插件,它可以帮助设计师快速创建交互式动画效果。 中继器是指在实现动态面板过程中,对于一些需要在各个页面或者动态组件之间传递数据的情况,可以使用中继器来实现数据的传递和共享。中继器可以看作是一个存储数据的地方,不同页面或者组件可以通过中继器进行数据的读取和写入。 在Axure使用京东动态面板中继器的过程如下: 1. 首先,安装并启用京东动态面板插件。 2. 在Axure的页面中,选中需要添加动态效果的组件或者页面元素。 3. 在京东动态面板插件的工具栏中,选择相应的动画效果,如滑动、淡入淡出等。 4. 在动态面板的设置中,可以设置动画的起始位置、结束位置、持续时间等参数。 5. 如果需要在不同的页面或者组件之间传递数据,可以使用中继器。 6. 在中继器面板中,添加需要传递的数据,并设定对应的名称。 7. 在源页面或者组件中,使用动态面板的触发事件,将需要传递的数据写入中继器。 8. 在目标页面或者组件中,使用动态面板的触发事件,从中继器中读取需要的数据。 通过使用Axure的京东动态面板插件加上中继器,设计师可以快速创建具有交互动画效果的原型,并实现跨页面或组件之间的数据传递。这样可以大大提高原型设计的效率和交互性,帮助设计师更好地展示和验证设计思路。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值