Question

我在主QML表单上使用Repeater有9：9的Rectangle元素矩阵。我想要实现的是，如果用户点击其中一个矩形，它会缩放到TextEdit小部件，然后在Esc上按下缩放。

QML可以吗？
如果是，我应该如何将Rectangle转换为TextEdit并缩放此TextEdit以填充父级？

刚开始使用QML并且还无法从http://doc.qt.nokia.com/4.7-snapshot/qdeclarativeanimation.html得到答案。

谢谢。

Answer 1

1）当然可以！这或多或少是QML的制作方式。

2）这是一个如何做你想做的事情的例子（不是唯一的方法）：

Rectangle {
  id: parentRect
  width: 500; height: 500

  // Every item in the grid should look like this
  Rectangle {
    id: singleItem
    color: "red"
    state: "closed"


    // Hidden text input, shown when user clicks
    TextInput {
      id: textInput
      anchors.fill: parent
      text: "Input here"
      cursorVisible: true
    }

    // MouseArea that will catch the user click
    MouseArea {
      anchors.fill: parent
      onClicked: singleItem.state = "open"
    }

    // Item states
    states: [
      State {
        name: "closed"
        PropertyChanges {target: singleItem; width: 25; height: 25}
        PropertyChanges {target: textInput; opacity: 0}
      },
      State {
        name: "open"
        PropertyChanges {target: singleItem; width: parentRect.width; height: parentRect.height}
        PropertyChanges {target: textInput; opacity: 1; focus: true}
      }
    ]

    // Transitions between states
    transitions: Transition {
      ParallelAnimation {
        NumberAnimation {
          target: singleItem
          properties: "width,height"
          duration: 1000
        }
        NumberAnimation {
          target: textInput
          property: "opacity"
          duration: 1000
        }
      }
    }
  }

}

Answer 2

即使我是qt-quick的新手。除非我们编写代码来执行此操作，否则我认为不可能进行缩放。我不确定。： - ）

这种效果很好，很快就会看到即将发布的版本。尝试向社区提供功能请求＆lt; 3

QML从单击的矩形缩放到另一个UI元素

2 个答案: