qt 自带源码样例:在样例中输入clock,找到名叫Qt Quick Demo Clocks。

这个样例写的不错,还是带时差的。不过我们其实不需要这么复杂的功能。

timer启动这个就不用说了:

Timer {

        interval: 100; running: true; repeat: true;
        onTriggered: clock.timeChanged()
    }
下面这三个才是最最重要的,时针,分针,秒针的转动。其中的x,y,origin.x,origin.y都是要重新调整坐标的。
x,y的设定要把timer停止。把时针,分针,秒针调整到重合即可。
然后把timer启动,origin.x一定要是引用的图片的资源的宽度的一半。origin.y我还没有找到规律,每次调试都是用眼睛看,汗~~~~
一定要注意时针,分针,秒针的偏转角。
       Image {
            x: 92.5; y: 27
            source: "hour.png"
            transform: Rotation {
                id: hourRotation
                origin.x: 7.5; origin.y: 73;
                angle: (clock.hours * 30) + (clock.minutes * 0.5)
                Behavior on angle {
                    SpringAnimation { spring: 2; damping: 0.2; modulus: 360 }
                }
            }
        }

        Image {
            x: 93.5; y: 17
            source: "minute.png"
            transform: Rotation {
                id: minuteRotation
                origin.x: 6.5; origin.y: 83;
                angle: clock.minutes * 6
                Behavior on angle {
                    SpringAnimation { spring: 2; damping: 0.2; modulus: 360 }
                }
            }
        }

        Image {
            x: 97.5; y: 20
            source: "second.png"
            transform: Rotation {
                id: secondRotation
                origin.x: 2.5; origin.y: 80;
                angle: clock.seconds * 6
                Behavior on angle {
                    SpringAnimation { spring: 2; damping: 0.2; modulus: 360 }
                }
            }
        }
												

qml 带时钟效果的更多相关文章

  1. js简单 图片版时钟,带翻转效果

    js简单 图片版时钟,带翻转效果 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...

  2. android标题栏上面弹出提示框(二) PopupWindow实现,带动画效果

    需求:上次用TextView写了一个从标题栏下面弹出的提示框.android标题栏下面弹出提示框(一) TextView实现,带动画效果,  总在找事情做的产品经理又提出了奇葩的需求.之前在通知栏显示 ...

  3. android标题栏下面弹出提示框(一) TextView实现,带动画效果

    产品经理用的是ios手机,于是android就走上了模仿的道路.做这个东西也走了一些弯路,写一篇博客放在这里,以后自己也可用参考,也方便别人学习. 弯路: 1.刚开始本来用PopupWindow去实现 ...

  4. jquery制作弹出层带遮罩效果,点击阴影部分层消失

    jquery制作弹出层带遮罩效果,点击阴影部分层消失. 整体还是比较简单的. HTML代码很简单 <a href="#" class="big-link" ...

  5. Flash AS实现时钟效果(全脚本实现)

    最近工作中用到个Flash效果,好久没有写FlashAS脚本了,就想从以前写的代码中找一些实例.竟然看到硬盘中还留有若干年前的代码. 这个时钟效果是全部采用脚本实现,图形也是用脚本绘制的.写于2005 ...

  6. transform实现的时钟效果

    又来一个时钟效果了,这个的实现不需要canvas,都是div.ul.li画出的,好玩有真实. 哈哈~ 需要的js才能实现到走动这个效果,但js的内容不多,也不难. 主要是一个css里transform ...

  7. js+css实现带缓冲效果右键弹出菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 纯CSS3带动画效果导航菜单

    随着互联网的发展,网页能表现的东西越来越多.由最开始单纯的文字和链接构成的网页,到后来的表格布局,再到div+css模式,现在发展到了html+css3.网页能表达的东西越来越多,css3兴起已经很多 ...

  9. 原生javascript实现网页显示日期时钟效果

    刚接触javascript中Date内置对象时,以为这些方法都太简单了,结果要自己实际操作写一个时钟效果还真一时把我难住了,主要有几点大家要注意的.先看实际效果 要实现这样的效果 某年某月某日星期几几 ...

随机推荐

  1. JVM内存结构 JVM的类加载机制

    JVM内存结构: 1.java虚拟机栈:存放的是对象的引用(指针)和局部变量 2.程序计数器:每个线程都有一个程序计数器,跟踪代码运行到哪个位置了 3.堆:对象.数组 4.方法区:字节流(字节码文件) ...

  2. RBAC权限模型——项目实战

    RBAC权限模型——项目实战

  3. JVM性能调优(转)

    本文转自:http://www.cnblogs.com/chen77716/archive/2010/06/26/2130807.html 最近因项目存在内存泄漏,故进行大规模的JVM性能调优 , 现 ...

  4. CSS 图像透明/不透明

    CSS 图像透明/不透明 使用CSS很容易创建透明的图像. 注意:CSS Opacity属性是W3C的CSS3建议的一部分. 一.示例一:创建一个透明图像 CSS3中属性的透明度是 opacity. ...

  5. js 判断是ie浏览器

    if (!+[1,]) { //IE window.event.returnValue = false; } else { return false; }

  6. 重写(overwrite)、重载(overload)和覆盖(override)三者之间的区别

    覆盖:子类继承了父类的同名无参函数.当子类从父类继承了一个无参函数,而又定义了一个同样的无参函数,则子类定义的方法覆盖父类的方法,称为覆盖. 重载:子类继承了父类的同名有参函数.当子类继承了父类的一个 ...

  7. saltstack之keepalived的安装配置

    使用saltstack编译安装keepalived: 创建相应的目录,并在目录下创建相应的sls配置文件 [root@node1 ~]# mkdir /srv/salt/prod/keepalived ...

  8. COGS 197 [HAOI2008] 排名系统

    ★★★☆   输入文件:rank.in   输出文件:rank.out   简单对比 时间限制:1 s   内存限制:128 MB [题目描述] 排名系统通常要应付三种请求:上传一条新的得分记录.查询 ...

  9. 【bzoj1369】[Baltic2003]Gem(树形dp+结论)

    题目传送门:bzoj1369 这题其实有个结论:节点数为n的树,对其染色使相邻节点颜色不同,且总颜色权值最小,所需的颜色数量是$ O(\log n) $的. 所以我们就可以愉快的dp了:$ f[i][ ...

  10. windows系统下简单node.js环境配置 安装

    国内目前关注最高,维护最好的一个关于nodejs的网站应该是http://www.cnodejs.org/ windows系统下简单nodejs环境配置. 第一步:下载安装文件 下载地址:官网 htt ...