ScrollView And ListModel Problem



  • Hello guys

    I want to show ListElements on ScrollView. When I run the program, program is crushed. What is the problem?

    @import QtQuick 2.1
    import QtQuick.Controls 1.1

    ApplicationWindow {
    title: qsTr("Hello World")
    width: 640
    height: 480

    menuBar: MenuBar {
        Menu {
            title: qsTr("File")
            MenuItem {
                text: qsTr("Exit")
                onTriggered: Qt.quit();
            }
        }
    }
    
    ScrollView{
        width: parent.width
        height: parent.height
    
        flickableItem.interactive: true
    
        ListModel {
            id: fruitModel
    
            ListElement {
                name: "Apple"
                cost: 2.45
            }
            ListElement {
                name: "Orange"
                cost: 3.25
            }
            ListElement {
                name: "Banana"
                cost: 1.95
            }
    
            ListView {
                anchors.fill: parent
                model: fruitModel
                delegate: Row {
                    Text { text: "Fruit: " + name }
                    Text { text: "Cost: $" + cost }
                }
            }
        }
    }
    

    }
    @



  • I think This topic should moves to Qt Quick Category. Please move that.



  • First, your ListView is inside ListModel which cannot be, so you need to close breacket } before ListView and separate these two.

    Second, put ListModel before ScrollView because:
    "Only one Item can be a direct child of the ScrollView and the child is implicitly anchored to fill the scroll view."



  • [quote author="Lepa Brena" date="1389089662"]First, your ListView is inside ListModel which cannot be, so you need to close breacket } before ListView and separate these two.

    Second, put ListModel before ScrollView because:
    "Only one Item can be a direct child of the ScrollView and the child is implicitly anchored to fill the scroll view."

    [/quote]
    You definitely right. I change code a little bit.

    SteelStandardListPage.qml
    @import QtQuick 2.1
    import QtQuick.Controls 1.1
    import QtQuick.Controls.Styles 1.1

    Item{

    ListModel{
        id:steelTypeModel
    
        ListElement{
            profileType: "I Profile"
            profileTypePage: "content/ProfileDetailPage.qml"
        }
    
        ListElement{
            profileType: "U Profile"
            profileTypePage: "content/ProfileDetailPage.qml"
        }
    }
    
    ScrollView {
        width: parent.width
        height: parent.height
    
        flickableItem.interactive: true
    
        ListView {
            anchors.fill: parent
            model: steelTypeModel
            delegate: AndroidDelegate {
                text: "Type: " + profileType
                //onClicked: StackView.push({Item: "content/ProfileDetailPage.qml", immediate: true, replace: true})
                onClicked: StackView.push(Qt.resolvedUrl(profileTypePage))
            }
    

    style: ScrollViewStyle{
    transientScrollBars: true
    handle: Item{
    implicitWidth: 14
    implicitHeight: 26
    Rectangle{
    color: "#424246"
    anchors.fill: parent
    anchors.topMargin: 6
    anchors.leftMargin: 4
    anchors.rightMargin: 4
    anchors.bottomMargin: 6
    }
    }
    scrollBarBackground: Item{
    implicitWidth: 14
    implicitHeight: 26
    }

        }
    
    }@
    

    How can I use push to show another pages? For example; I touch the first List Element(I profile) then I want to show "content/ProfileDetailPage.qml" . I wrote a code, but this code doesn't work.

    @onClicked: StackView.push(Qt.resolvedUrl(profileTypePage))@



  • You should have StackView item first, so you can push another page on it.



  • [quote author="Lepa Brena" date="1390898659"]You should have StackView item first, so you can push another page on it.[/quote]

    So every qml file contain own StackView. For example; 1.qml file has StackView ( id:StackView1), 2.qml file has StackView ( id:StackView2). Am I right?



  • Hmmm... I think I didn't understand you well...
    StackView is a control like Image, ScrollView and so.. you have to create it in your .qml.

    Best example is "Touch" in QML examples...
    "Touch QML Example":http://qt-project.org/doc/qt-5.1/qtquickcontrols/touch-main-qml.html



  • [quote author="Lepa Brena" date="1390993003"]Hmmm... I think I didn't understand you well...
    StackView is a control like Image, ScrollView and so.. you have to create it in your .qml.

    Best example is "Touch" in QML examples...
    "Touch QML Example":http://qt-project.org/doc/qt-5.1/qtquickcontrols/touch-main-qml.html[/quote]

    Touch example contains one StackView. I wrote StackView every qml files and I can pass the pages as I want. Is there any problem on the future?



  • Sorry, did not see StackView item. Can you add some id, and the use it?
    id: myStackView

    onClicked: myStackView.push(Qt.resolvedUrl(profileTypePage))


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.