前面在介绍单选框和复选框应用的时候演示的红绿灯效果里面有用到倒计时的效果，即在红灯和绿灯时候有倒计时提示红灯和绿灯的持续时间，当时没有详细介绍如何实现，这里就补充介绍一下倒计时效果的设计实现过程。

倒计时效果需要用动态面板来实现，基本上有需要移动、需要小页面切换显示，需要先隐藏后显示等效果的时候，都需要使用动态面板组件，因此动态面板是AxureRP里的一个很强大的组件，从AxureRP支持的交互事件里大部分都与动态面板相关就可以看出来。掌握动态面板的应用也就显得很重要，这部分掌握了，就算是AxureRP的高手阶段了。

这个例子是简单模仿电影的开场效果，当然倒计时效果的应用一般不是这个，在网页设计的时候，一般都用于加载或关闭时的时间提示，或页面退出页面跳转的时间提示，实现原理是一样的。这里就以5秒得电影开场倒计时效果来做演示，界面设计比较简单。

其实倒计时效果只是把每个动态面板的状态页设计成数字显示了，一个页面放一个数字，实现原理还是利用动态面板的状态切换事件来切换状态达到倒数的效果，一个控制功能来制动倒数的开始，这里使用OnPageLoad事件来使页面加载之后直接开始倒数。一般倒计时都是以秒为单位的，所以控制好等待时间为1000毫秒就可以了。

交互事件选择切换动态面板状态和等待事件，设置每过1000毫秒切换至下一个状态，在交互事件属性里的高级编辑器里可以设置交互事件的排序，这里注意显示状态的顺序就好了，使之达到倒数的效果。

高级编辑器和基本编辑器默认是可以切换的，但当高级编辑器内添加了两个相同的动作之后就无法再切换会基本编辑器了，也就是说在基本编辑器里面，每个动作只能使用一次，要多次使用的时候就必须在高级编辑器里才能实现。高级编辑器下需要在某个动作后插入新动作的话，需要先选中这个动作，然后再添加动作，否则默认动作会添加在所有事件的最下面，可以使用上下箭头来排序。

动态面板的状态切换能演示出很效果，主要看每个小状态页面里面设计的是什么内容，后面还会介绍到。

示例在AxureRP5.5版本下调试通过

axure 倒计时_AxureRP教程—模拟倒计时相关推荐

  1. axure 倒计时_Axure教程：短信验证码实现倒计时

    编辑导读:本文跟大家分享,如何用Axure实现短信验证码倒计时效果,作者从预览图,到所需基本原件,再到操作步骤都一一展开了分析,并对过程中需要注意的问题进行了介绍,希望对你有所启发. 这个是新用户注册 ...

  2. 获取当前时间以及模拟倒计时（Java）

    获取当前时间以及模拟倒计时(Java) package src.State;import java.text.SimpleDateFormat; import java.util.Date;//模拟倒 ...

  3. 怎么在php网站大图加倒计时,WordPress站点添加活动倒计时功能教程

    限时的活动或是报名中,作为促进消费和转化用户是非常好用的一个营销功能,可以让访客抓紧时间想要获取内容或是福利,添加活动就需要活动倒计时功能,今天为大家分享一下WordPress站点添加活动倒计时功能教 ...

  4. 使用线程模拟倒计时和打印当前系统时间

    1.模拟倒计时: //模拟倒计时 public class TestSleep2 {public static void main(String[] args) {try {tenDown();} c ...

  5. android 考试倒计时,考试倒计时软件下载-考试倒计时v1.0 最新版-腾牛安卓网

    考试倒计时是一款帮助你快速记录时间的工具.一键在线设置倒计时,可以轻松为你带来倒计时体验.不会错过重要日子,非常的实用.感兴趣的朋友不要错过了,快来下载体验吧. 应用介绍: 一款考试倒计时帮助您管理纪 ...

  6. Axure+RP+pro教程

    在实习期间的第一个要熟悉的软件-Axure                 简介: Axure RP是美国Axure Software Solution公司旗舰产品,是一个专业的快速原型设计工具,让负 ...

  7. android 万能倒计时，时分秒倒计时

    1.工具类 /*** 作者:created by meixi* 邮箱:15913707499@163.com* 日期:2018/12/28 15*/public class TimerUtil {pr ...

  8. Axure快速原型教程02--创建页面和设置界面

    目录 Axure快速原型教程02--创建页面和设置界面 Axure快速原型教程01--原型说明下载和安装 首先,在左侧的面板中,我们发现有一个叫sitemap的面板,这个面板就是我们的一个个的页面了, ...

  9. java解析axure原型rp文件,Axure RP 8 教程 – 查看原型

    Axure小白的福利又来了,本教程主要讲述查看原型的一系列基础操作以及相关设置. 希望大家边学边操作,学习效果更佳哦. Axure RP 8 教程 – 查看原型 1.快速预览查看原型 快速原型的快捷键 ...

最新文章

  1. codeforces425C
  2. android中的定时任务一般有两种机制,android 定时任务
  3. oracle sys改密码,Oracle修改SYS密码
  4. pyspark pipline
  5. Python二分查找算法
  6. 利用union判断系统的大小端
  7. 在 k8s 中部署 Prometheus 和 Grafana
  8. 今天，你精通Spring Cloud了吗？
  9. uva225 回溯剪枝
  10. linux配置部署nginx
  11. LInux系统木马植入排查分析 及 应用漏洞修复配置(隐藏bannner版本等)
  12. 新手怎样利用博客推广
  13. Windbg分析蓝屏Dump文件
  14. ImageAssitant插件 — 一件提取网页图片
  15. php 屏蔽鼠标右键 复制,FLEX屏蔽鼠标右键
  16. 利用github进行账号授权登录
  17. 0基础如何入门人工智能？
  18. 【16.10更新】神器再现！百度云网盘批量高速下载 Chrome插件+IDM
  19. 银联的bankall_Visa禁止银行利用中国银联(China UnionPay Co.)境外交易
  20. 湖北省人社厅参观「仲裁智慧树」在成都高新区和贵阳的成功案例

热门文章

  1. TypeScript 的 type predicates
  2. Angular routerLink指令的href属性生成逻辑
  3. 支持CDS view的SAP ALV IDA - 使用前提
  4. Access context of data source and work center view do not match
  5. EventBus in SAP UI5 and Kyma
  6. 如何修改新浪微博对其他应用的授权
  7. Cloud for Customer的工作中心(work center)加载器
  8. CRM WebClient UI里word文档调用web service的问题
  9. SAP WebIDE编辑器的主题设置
  10. include element into ABAP word document