QML ListView populate属性不起作用(其动画)

时间:2015-09-03 11:10:00

标签: qt qml qtquick2 qtquickcontrols qtquickextras

我在ListView内跟随QML ueLoginWindow

import QtQuick 2.0
import QtMultimedia 5.5
import QtQuick.Controls 1.3
import QtQuick.Extras 1.4
import QtQuick.Layouts 1.2
import QtQuick.Window 2.2
import QtTest 1.1
import Enginio 1.0
import QtBluetooth 5.5
import QtCanvas3D 1.0
import QtLocation 5.5
import QtNfc 5.5
import QtPositioning 5.5
import QtQuick.LocalStorage 2.0
import QtQuick.XmlListModel 2.0
import QtSensors 5.5
import QtWebChannel 1.0
import QtWebKit 3.0
import QtWebSockets 1.0

import "../items"

Rectangle
{
    id: ueLoginWindow

    width: 768
    height: 512

    radius: 16

    border.color: "#ffffff"
    border.width: 4

    clip: true

    anchors.centerIn: parent

    gradient: Gradient
    {
        GradientStop
        {
            position: 0
            color: "#ffffff"
        }   // GradientStop

        GradientStop
        {
            position: 0.81
            color: "#000000"
        }   // GradientStop
    }   // gradient

    ColumnLayout
    {
        id: ueMainLayout

        anchors.margins: ueLoginWindow.radius
        anchors.fill: parent

        clip: true

        antialiasing: true

        layoutDirection: Qt.LeftToRight
        spacing: 16

        Text
        {
            id: ueLoginText

            color: "#000000"

            text: qsTr("STAFF LOGIN")
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 458
            anchors.top: parent.top
            anchors.topMargin: 0
            styleColor: "#ffffff"
            font.family: "Courier"
            font.bold: true

            clip: true

            font.pointSize: 23
            font.capitalization: Font.AllUppercase

            textFormat: Text.RichText

            verticalAlignment: Text.AlignVCenter
            horizontalAlignment: Text.AlignHCenter

            Layout.alignment: Qt.AlignHCenter|Qt.AlignTop

            Layout.fillWidth: true
            Layout.fillHeight: true
        }   // Text

//        ListView
//        {
//            id: uePeopleView

//            antialiasing: true

//            model: uePeopleModel

//            spacing: 16

//            clip: true

//            Layout.alignment: Qt.AlignCenter

//            Layout.fillWidth: true

//            Layout.margins: ueLoginWindow.radius

//            Layout.minimumHeight: 192
//            Layout.preferredHeight: 192
//            Layout.maximumHeight: 192

//            orientation: ListView.Horizontal

//            delegate: Component
//            {
//                id: uePersonDelegate

//                Item
//                {
//                    width: 192
//                    height: 192

//                    Column
//                    {
//                        Image
//                        {
//                            source: "image://uePeopleModel/"+model.ueRoleImage
//                        }   // Image

//                        Text
//                        {
//                            text: model.ueRoleName

//                            font.pointSize: 10
//                            verticalAlignment: Text.AlignVCenter
//                            horizontalAlignment: Text.AlignHCenter
//                        }   // Text
//                    }   // Column
//                }   // Item
//            }   // delegate

//            scale: parent.ListView.isCurrentItem?0.8:1
//            Behavior on scale
//            {
//                NumberAnimation
//                {
//                    duration: 200
//                }   // NumberAnimation
//            }   // Behavior

//            preferredHighlightBegin: width/2-15
//            preferredHighlightEnd: width/2+15
//            highlightRangeMode: ListView.StrictlyEnforceRange
//            Component.onCompleted:
//            {
//                currentIndex=count/2
//            }   // Component.onCompleted

//            populate: Transition
//            {
//                NumberAnimation
//                {
//                    property: "opacity";
//                    from: 0;
//                    to: 1.0;
//                    duration: 400
//                }   // NumberAnimation

//                NumberAnimation
//                {
//                    property: "scale";
//                    from: 0;
//                    to: 1.0;
//                    duration: 400
//                }   // NumberAnimation
//            }   // Transition
//        }   // Listview

        ListView
        {
            id: uePeopleView
            anchors.top: parent.top
            anchors.topMargin: 29
            highlightFollowsCurrentItem: false

            antialiasing: true

            model: uePeopleModel

            spacing: 16

            clip: true

            Layout.alignment: Qt.AlignCenter

            Layout.fillWidth: true

            Layout.margins: ueLoginWindow.radius

            Layout.minimumHeight: 192
            Layout.preferredHeight: 192
            Layout.maximumHeight: 192

            orientation: ListView.Horizontal

            delegate: Component
            {
                id: uePersonDelegate

                Item
                {
                    width: 192
                    height: 192

                    Column
                    {
                        Image
                        {
                            source: "image://uePeopleModel/"+model.ueRoleImage
                        }   // Image

                        Text
                        {
                            text: model.ueRoleName

                            font.pointSize: 10
                            verticalAlignment: Text.AlignVCenter
                            horizontalAlignment: Text.AlignHCenter
                        }   // Text
                    }   // Column
                }   // Item
            }   // delegate

            scale: parent.ListView.isCurrentItem?0.8:1
            Behavior on scale
            {
                NumberAnimation
                {
                    duration: 200
                }   // NumberAnimation
            }   // Behavior

            preferredHighlightBegin: width/2-15
            preferredHighlightEnd: width/2+15
            highlightRangeMode: ListView.StrictlyEnforceRange
            Component.onCompleted: currentIndex=count/2
        }   // Listview

        Tumbler
        {
            id: ueLoginKeypadTumbler
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 77
            anchors.top: parent.top
            anchors.topMargin: 224
            clip: true

            Layout.preferredHeight: 96

            Layout.fillWidth: true
            Layout.alignment: Qt.AlignCenter

            Layout.margins: ueLoginWindow.radius

            antialiasing: true

            TumblerColumn
            {
                id: ueNumericTumblerColumnDigit1000

                model: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

                width: 165
            }   // ueNumericTumblerColumnDigit1000

            TumblerColumn
            {
                id: ueNumericTumblerColumnDigit100

                model: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

                width: 165
            }   // ueNumericTumblerColumnDigit100

            TumblerColumn
            {
                id: ueNumericTumblerColumnDigit10

                model: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

                width: 165
            }   // ueNumericTumblerColumnDigit10

            TumblerColumn
            {
                id: ueNumericTumblerColumnDigit1

                model: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

                width: 165
            }   // ueNumericTumblerColumnDigit1
        }   // ueLoginKeypadTumbler

        RowLayout
        {
            id: ueButtonsLayout

            layoutDirection: Qt.LeftToRight
            spacing: 16

            UeButton
            {
                id: ueButtonLogin
                text: qsTr("Login")

                Layout.alignment: Qt.AlignHCenter|Qt.AlignBottom

                Layout.fillWidth: true
                Layout.fillHeight: true

                ueText: qsTr("Login")
            }   // UeButton

            UeButton
            {
                id: ueButtonClear
                text: qsTr("Clear")

                Layout.alignment: Qt.AlignHCenter|Qt.AlignBottom

                Layout.fillWidth: true
                Layout.fillHeight: true

                ueText: qsTr("Clear")
            }   // UeButton

            UeButton
            {
                id: ueButtonQuit

                Layout.alignment: Qt.AlignHCenter|Qt.AlignBottom

                Layout.fillWidth: true
                Layout.fillHeight: true

                ueText: qsTr("Quit")
            }   // UeButton
        }   // RowLayout
    }   // ColumnLayout
}   // Rectangle

现在,当我运行应用时,这些项目会从ListView正确地投放到model,但根据populate属性,不会对项目进行动画处理。我希望所有项目都根据populate属性进行动画处理。我错过了什么,因为在populate property docs州:

  

populate:Transition此属性包含要应用的转换   最初为视图创建的项目。

     

它适用于在以下时间创建的所有项目:

     

首先创建视图视图的模型更改视图的模型是   如果模型是QAbstractItemModel子类

,则重置

1 个答案:

答案 0 :(得分:1)

我认为问题是model属性应该在ListView初始化后更新:

ListView {

    // don't initialise model property this time.
    //model: uePeopleModel

    // update the model property after ListView initialised.
    Component.onCompleted: {
        model = uePeopleModel;
    }
}