Axure之倒计时简单实现

    xiaoxiao2021-03-25  73

    开心一笑

    【看大家都在抵制韩国,我翻遍家里也没找到有啥韩货可砸的,最后下楼把楼下姓韩的邻居打了一顿,因为他名叫韩国胜。】

    视频教程

    大家好,我录制的视频《Java之优雅编程之道》已经在学院发布了,有兴趣的同学可以购买观看,相信大家一定会收获到很多知识的。谢谢大家的支持……

    视频地址:http://edu.csdn.net/lecturer/994

    提出问题

    Axure如何实现倒计时和动画切换???

    解决问题

    此文只为一人而写……

    1.新建一个全新的项目。

    2.在元件库里,拖入两个一级标题元件,分别写上“距离高考还剩” 和 “天” 这两个文字。 具体如下:

    3.在元件库里,拖入一个动态面板,宽度:50,高度:50。

    4.双击动态面板,在弹出的窗口中依次添加5个子面板。

    5.双击state1字面板,在弹出的界面中,拖入一个一级标题,写上“5”.

    6.安装步骤5的操作,在其他4个state字面板中依次添加文本 “4”,“3”,“2”,“1”

    7.回到index页面,点击动态面板,在属性窗口中,单击“载入时”,点击上面的添加用例。

    这里的载入时 ,是指 页面刚刚加载时候,要触发的事件,详情请继续看步骤8.

    8.在弹出的窗口中,点击添加动作下的“等待”,等待时间为 1000 毫秒,也就是 1 秒

    这里的意思是,当页面在浏览器上加载出来的时候,页面等待1s

    9.继续添加动作,选择元件下的“设置面板状态”,在配置动作窗口中,勾选动态面板,选择状态:“state2”,再勾选如果隐藏则显示面板,最后点击确定

    10.我们给动态面板“载入时”,绑定了2个事件,点击预览,你就会发现页面从 “5” –变成–> “4”,坚持下去,我们已经实现一半了。

    11.我们回到 index 页面,单击动态面板,因为我们的页面已经可以从 “5” 跳转到“4”了,可是怎么从“4” 调整到“3” 呢?所有我们需要继续添加事件。“5”跳转到“4”,事实上是动态面板状态改变时的一个事件,我们只要监听这个事件就可以了。所有我们添加属性中的“状态改变时”事件,点击“添加用例”。

    12.和步骤9一模一样,只是选择状态:“state3”

    但是这样还是不够的,“5” –跳转–>>> “4”, 是从 state1 –调整–>>> state2,所有我们需要添加一个条件,

    上面操作的意思是,当面板调到state2时候,触发条件。继续等待1s,然后显示state3.

    13.安装步骤11和步骤12,我们依次添加case2和case3,并且添加上“等待”事件 和 ”设置面板状态“事件,同时“添加条件”,最终效果如下:

    这里要注意的是:case2 和 case3 的添加条件是不一样的。

    14.通过上面的一系列操作,我们预览,在浏览器查看效果。大功告成……

    读书感悟

    来自叶芝《当你老了》

    当你老了,头发花白,睡意沉沉, 倦坐在炉边,取下这本书来, 慢慢读着,追梦当年的眼神。 你那柔美的神采与深幽的晕影。 **多少人爱过你昙花一现的身影, 唯独一人曾爱你那朝圣者的心,** 爱你哀戚的脸上岁月的留痕。 在炉罩边低眉弯腰, 忧戚深思,喃喃而语, 爱情是怎样逝去,又怎样步上群山, 怎样在繁星之间藏住了脸。

    经典故事

    【魏文王问名医扁鹊说:“你们家兄弟三人,都精于医术,到底哪一位最好呢? 扁鹊答:“长兄最好,中兄次之,我最差。   文王再问:“那么为什么你最出名呢? 扁鹊答:“长兄治病,是治病于病情发作之前。由于一般人不知道他事先能铲除病因,所以他的名气无法传出去;中兄治病,是治病于病情初起时。一般人以为他只 能治轻微的小病,所以他的名气只及本乡里。而我是治病于病情严重之时。一般人都看到我在经脉上穿针管放血、在皮肤上敷药等大手术,所以以为我的医术高明, 名气因此响遍全国。   【学习啦】心得:事后控制不如事中控制,事中控制不如事前控制。】

    大神文章

    【1】Axure的简单操作(倒计时使用变量) 【2】axure RP7.0 实现60秒倒计时功能 【3】Axure教程:实现倒计时获取验证码效果 【4】图文详解-如何用Axure做一个倒计时功能按钮 【5】Axure7.0原型小楼作品日期函数实现倒计时

    其他

    如果有带给你一丝丝小快乐,就让快乐继续传递下去,欢迎点赞、顶、欢迎留下宝贵的意见、多谢支持!

    转载请注明原文地址: https://ju.6miu.com/read-38047.html

    最新回复(0)