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 }

                }

            }

        }

转载于:https://www.cnblogs.com/wxmwanggood/p/9140606.html