axure 图片切换图片的交互_Axure教程:三维阵列图片的自动切换展示

如何利用元件的尺寸变化、移动变化等实现三维列阵图片的自动切换展示?笔者在此给出了详细教程,与大家分享~~

a0ee18c82c01ba09fd02fbdac53275e1.png

今天分享实现五张三维阵列图片切换的方法,主要是利用元件的尺寸变化、移动变化、图层顺序和动态面板切换控制循环等技术点。动效图如下:

b13682863cb87f5ceae5a7531011472e.gif

具体实现方法

第一步:元件的实现

1. 从左侧拉入五个矩形,其中矩形为C的大小设置为200 *300。矩形B、D的大小设置为160*240。矩形A、E的大小设置为128*192。分别记录这五个矩形的X、Y轴坐标,其中矩形A(222,204)、矩形B(330,180)、矩形C(470,150)、矩形D(650,180)、矩形E(790,204)。

2. 再拉入一个动态面板,添加两个状态,命名为:控制循环。(作用是利用动态面板的循环切换,来控制三维阵列图片组的循环播放。)

3. 最后,再拉入一个文本标签,命名为:状态。(作用是记录当前中间置顶的矩形序号。)

如图所示:(其中的矩形的图层顺序依次为A、B、C、

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值