QT 5.3/QML：可调整大小的堆栈视图，取决于当前项目

我正在开发一个QML

StackView

，它以要从中选择的项目列表开始。选择后，我想转换

。
将（…）
推送到比
初始项
尺寸更大的输入表单

我尝试和出错的唯一方法是将表单
项
设置为嵌套的无边框窗口

问题1。嵌套窗口不能是用于此的正确概念类型。。。正确的？一定还有别的办法。正确的方法是什么

问题2。在此之后，我的目标是创建一个在不同大小的堆栈之间增长或收缩的过渡动画。不排除这种可能性的建议是最好的

代码

Main.qml：

import QtQuick 2.3
import QtQuick.Controls 1.2
import QtQuick.Layouts 1.1

ApplicationWindow {
  property int itemHeight: 30
  property int cornerRadius : 5

  visible: true
  color: "transparent"
  flags: Qt.FramelessWindowHint

  ListModel {
    id: searchFacets
    ListElement {
      title: "Topics"
      page: "content/TopicSearch.qml"
    }
    //    ListElement {
    //      title: "Domains"
    //    }
  }

  StackView {
    id: stackView

    focus: true

    initialItem: SearchFacets {
      id: facets
    }
    delegate: StackViewDelegate {
      pushTransition: StackViewTransition {
        PropertyAnimation {
          target: enterItem
          property: "opacity"
          from: 0
          to: 1
        }
      }
    }
  }
}

首项：

import QtQuick 2.3

Item {
  height : listView.count * itemHeight
  ListView {
    id: listView
    model: searchFacets
    anchors.fill: parent
    focus: true
    highlightFollowsCurrentItem: false

    highlight:   Rectangle {
      width: parent.width
      height: itemHeight
      radius : cornerRadius
      color: "green"
      opacity: 0.5
      z:2
      x: listView.currentItem.x;
      y: listView.currentItem.y

      Behavior on y {
        SpringAnimation {
          spring: 60
          damping: 1.0
        }
      }
    }

    delegate:   Component {
      Item {
        width: parent.width
        height : itemHeight

        Rectangle {
          anchors.fill: parent
          color: "#212126"
          radius: cornerRadius
          z:0
          border.width: 2
          border.color : "white"
        }

        MouseArea {
          id: mouseArea
          anchors.fill: parent
          hoverEnabled: true

          onClicked: {
            console.log("clicked index: " + index)
            listView.currentIndex = index
//            listView.forceActiveFocus()
            stackView.push(Qt.resolvedUrl(page))
          }
        }
        Text {
          text: title
          font.pixelSize: 24
          font.bold: true
          z:1
          anchors.horizontalCenter: parent.horizontalCenter
          anchors.verticalCenter: parent.verticalCenter
          color: "white"
          antialiasing: true
        }
      }
    }
  }
}

输入表格：

import QtQuick 2.3
import QtQuick.Window 2.0
Item {
  Window {
    width: 400
    height: 400
    visible: true
    flags: Qt.FramelessWindowHint

    Rectangle {
      anchors.fill: parent
      visible: true
      color: "red"
    }
  }
}

一种可能的解决方案是更新导致转换的单击处理程序中的
StackView
维度的大小。我不知道这是否会对设置过渡动画造成任何问题

MouseArea {
  id: mouseArea
  anchors.fill: parent
  hoverEnabled: true

  onClicked: {
    console.log("clicked index: " + index)
    listView.currentIndex = index

    var component = Qt.createComponent(page)
    var res = component.createObject(stackView)
    stackView.height = res.height
    stackView.width = res.width
    stackView.push(res)
  }
}