qml 带时钟效果
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 带时钟效果的更多相关文章
- js简单 图片版时钟,带翻转效果
js简单 图片版时钟,带翻转效果 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
- android标题栏上面弹出提示框(二) PopupWindow实现,带动画效果
需求:上次用TextView写了一个从标题栏下面弹出的提示框.android标题栏下面弹出提示框(一) TextView实现,带动画效果, 总在找事情做的产品经理又提出了奇葩的需求.之前在通知栏显示 ...
- android标题栏下面弹出提示框(一) TextView实现,带动画效果
产品经理用的是ios手机,于是android就走上了模仿的道路.做这个东西也走了一些弯路,写一篇博客放在这里,以后自己也可用参考,也方便别人学习. 弯路: 1.刚开始本来用PopupWindow去实现 ...
- jquery制作弹出层带遮罩效果,点击阴影部分层消失
jquery制作弹出层带遮罩效果,点击阴影部分层消失. 整体还是比较简单的. HTML代码很简单 <a href="#" class="big-link" ...
- Flash AS实现时钟效果(全脚本实现)
最近工作中用到个Flash效果,好久没有写FlashAS脚本了,就想从以前写的代码中找一些实例.竟然看到硬盘中还留有若干年前的代码. 这个时钟效果是全部采用脚本实现,图形也是用脚本绘制的.写于2005 ...
- transform实现的时钟效果
又来一个时钟效果了,这个的实现不需要canvas,都是div.ul.li画出的,好玩有真实. 哈哈~ 需要的js才能实现到走动这个效果,但js的内容不多,也不难. 主要是一个css里transform ...
- js+css实现带缓冲效果右键弹出菜单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 纯CSS3带动画效果导航菜单
随着互联网的发展,网页能表现的东西越来越多.由最开始单纯的文字和链接构成的网页,到后来的表格布局,再到div+css模式,现在发展到了html+css3.网页能表达的东西越来越多,css3兴起已经很多 ...
- 原生javascript实现网页显示日期时钟效果
刚接触javascript中Date内置对象时,以为这些方法都太简单了,结果要自己实际操作写一个时钟效果还真一时把我难住了,主要有几点大家要注意的.先看实际效果 要实现这样的效果 某年某月某日星期几几 ...
随机推荐
- app安全研究
国内Android App在线漏洞检测平台 腾讯金刚审计系统 http://service.security.tencent.com/kingkong 免费 无限制 腾讯御安全 http://yaq ...
- js 空数组 空对象判断
js 空数组是true还是false 1 2 var arr = new Array(); // 或 var arr = []; 我们知道,初始化后,即使数组arr中没有元素,也是一个object ...
- ABP官方文档翻译 1.5 多租户
多租户 什么是多租户? 数据库和部署架构 多部署-多数据库 单部署-多数据库 单部署-单数据库 单部署-混合数据库 多部署-单/多/混合数据库 ABP的多租户 启用多租户 租主和租户 会话 决定当前租 ...
- 【前端】强大的javascript原生选择器querySelector 和 querySelectorAll
querySelector 和 querySelectorAll 在传统的 JavaScript 开发中,查找 DOM 往往是开发人员遇到的第一个头疼的问题,原生的 JavaScript 所提供的 D ...
- centos7配置安装redis
关闭防火墙:systemctl stop firewalld.service #停止firewallsystemctl disable firewalld.service #禁止firewall开机启 ...
- 线程实现Runnable接口比继承Thread的优势
1.适合多个相同程序代码的线程去处理同一资源,把虚拟CPU(线程)同程序的代码.数据有效分离,较好地体现了面向对象的设计思想.2.可以避免由于java单继承特性带来的局限.3.增强了程序的健壮性,代码 ...
- JS 如何获取当前上一个月、下一个月和月份所含天数
在数据报表查询中,经常需要设置查询的日期区间,如查询2018-02-01至2018-02-28的整月数据,这时需要提供快捷整月查询按钮: 如: 一般日期年月日之间由"-"或者&qu ...
- Codeforces Round #365 (Div. 2) D - Mishka and Interesting sum(离线树状数组)
http://codeforces.com/contest/703/problem/D 题意: 给出一行数,有m次查询,每次查询输出区间内出现次数为偶数次的数字的异或和. 思路: 这儿利用一下异或和的 ...
- grafana二次开发
grafana官方地址: https://github.com/grafana/grafana 开发文档:http://docs.grafana.org/project/building_from_s ...
- npm install 报错 ECONNREFUSED
在window环境下,使用npm install 命令安装任何框架,都会报如下的错误 error code ECONNREFUSED error errno ECONNREFUSED error Fe ...