0

我正在尝试在 QML 中制作一个可翻转的时钟。但是无法获得想要的可翻转效果，我参考了翻转方法的文档，以此作为进一步开发的基础。

尝试了各种方法，但没有成功。任何想法如何获得这种效果。

以下是参考的文档代码片段

import QtQuick 1.0

 Flipable {
     id: flipable
     width: 240
     height: 240

     property bool flipped: false

     front: Image { source: "front.png"; anchors.centerIn: parent }
     back: Image { source: "back.png"; anchors.centerIn: parent }

     transform: Rotation {
         id: rotation
         origin.x: flipable.width/2
         origin.y: flipable.height/2
         axis.x: 1; axis.y: 0; axis.z: 0     // set axis.x to 1 to rotate around y-axis
         angle: 0    // the default angle
     }

     states: State {
         name: "back"
         PropertyChanges { target: rotation; angle: 180 }
         when: flipable.flipped
     }

     transitions: Transition {
         NumberAnimation { target: rotation; property: "angle"; duration: 4000 }
     }

     MouseArea {
         anchors.fill: parent
         onClicked: flipable.flipped = !flipable.flipped
     }
 }
4

1 回答 1

1

你不能只翻转一个项目的一半。要模拟翻转时钟，您必须使用图像的两个克隆。

尝试在上面的代码末尾添加：

Item {
  anchors {top: flipable.top; horizontalCenter: flipable.horizontalCenter}
  width: flipable.width
  height: flipable.height / 2
  z: flipable.z + 1

  clip: true

  Image {
    source: "front.png";
    anchors.centerIn: parent
  }
}

显然，这段代码不是解决方案，它只是提示你必须为完整的解决方案做什么。

于 2012-11-07T11:46:28.233 回答