Axure RP 9 教程—开着小车回家

Axure教程
19年8月22日
编辑

王得宇AIPM

效果图

使用工具

Axure RP 9

实现逻辑

Axure交互的小逻辑：

相同目标，不同动作：同时进行相同目标，相同动作：分先后不同目标，不同动作：同时进行不同目标，相同动作：同时进行（没看懂不要紧，在接下来的操作中我再解释这四句话的意思）

流程：

页面载入时→树木缩小，小车左右移动，树木隐藏→树木隐藏时→树木归位，树木显示→树木显示时→树木缩小，小车左右移动，树木隐藏→开始无限循环。

操作步骤

添加素材

一辆小车，两棵树木，我们希望树木缩小来形成小车的相对运动；让小车左右移动丰富小车运动轨迹。

页面载入时

树木1 1000ms内缩小到高为1，宽为1；

树木2 1000ms内缩小到高为1，宽为1；

小车用500ms 向左移动 20个单位；

小车用500ms 向右移动 20个单位；

等待 1000ms

隐藏树木1；

隐藏树木2。

（注意：上边的等待1000ms，如果不设置等待1000ms，会导致页面加载时，树木还没有缩小便全部隐藏，但是小车的移动虽然向两个方向移动，但是却又先后顺序，就是因为稳重一开始讲的那四句奇怪的话，同一目标小车，相同动作移动，会有先后顺序）

选中树木1 设置交互：

隐藏时：

树木1 瞬间回复到原始大小；

等待 50ms；

隐藏树木1。

显示时：

树木1 1000ms内缩小到高为1，宽为1；

小车用500ms 向左移动 20个单位；

小车用500ms 向右移动 20个单位；

等待 1000ms；

隐藏树木1。

（此时，已经实现小车和树木1无限循环移动，接下来只要设置树木2的无限循环移动即可）

选中树木2 设置交互：

隐藏时：

树木2 瞬间回复到原始大小；

等待 50ms；

隐藏树木2。

显示时：

树木2 1000ms内缩小到高为1，宽为1；

等待 1000ms；

隐藏树木2。

ok~完成

原型交互图

Axure RP 9 教程—开着小车回家

总结

共勉~

公众号：他们已经在路上了

原型文件下载链接：

https://pan.baidu.com/s/1hxw03x9B7KLk0EnETJtKkw

提取码：

puxn

{{userData.name}}已认证

Axure RP 9 教程—开着小车回家

使用工具

实现逻辑

Axure交互的小逻辑：

流程：

操作步骤

添加素材

页面载入时

选中树木1 设置交互：

隐藏时：

显示时：

选中树木2 设置交互：

隐藏时：

显示时：

原型交互图

总结

打造高品质Axure组件库就是这么简单

【元件库教程】如何充分利用元件库快速搭建Web后台（Tczy出品）

Axure 拼图游戏教程（进阶版）

Axure实例教程：拼图游戏教程（入门版）

Axure RP 11共享激活码分享一次说清

继续使用Axure Cloud的临时办法

紧急：Axure RP无法免费使用Axure Cloud了

Axure RP 11简体中文汉化语言包

Axure RP 11 正式版下载地址

Axure RP 11 共享激活码使用教程 Axure RP 11授权码秘钥

紧急：Axure RP无法免费使用Axure Cloud了

Axure 11 新特性快速入门

{{userData.name}}已认证

使用工具

实现逻辑

Axure交互的小逻辑：

流程：

操作步骤

添加素材

页面载入时

选中 树木1 设置交互：

隐藏时：

显示时：

选中 树木2 设置交互：

隐藏时：

显示时：

原型交互图

总结

打造高品质Axure组件库就是这么简单

【元件库教程】如何充分利用元件库快速搭建Web后台（Tczy出品）

Axure 拼图游戏教程（进阶版）

Axure实例教程：拼图游戏教程（入门版）

Axure RP 11共享激活码分享 一次说清

继续使用Axure Cloud的临时办法

紧急：Axure RP无法免费使用Axure Cloud了

选中树木1 设置交互：

选中树木2 设置交互：

Axure RP 11共享激活码分享一次说清