ScrollView And ListModel Problem

kingsta

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 }
            }
        }
    }
}

}
@

kingsta

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

? Offline

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."

kingsta

[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))@

? Offline

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

kingsta

[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?

? Offline

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

kingsta

[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?

? Offline

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

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