I am new to programming but I volunteered to make a GUI for my job. I have a nice GUI going that triggers GPIO on the PI using QT Quick. There is one more feature I really want. I have a model with List Elements being displayed using pathview. I want specific details about the item in the current index. In this case its a recipe system so when you scroll through all the recipes in pathview, I want the recipe for the item that is highlighted to show up at the bottom of the screen. My problem is if index 3 is selected I don't know how to get ingredient 1, ingredient 2, etc for index 3. If I called the pathview id: view, is there some sort of view, element 3, ingredient 1 lookup I can use?

import QtQuick 2.0

In Recipes.qml
ListModel {
id: recipe
ListElement { name: "Beef Rissotto"
icon: "file:/Beef_Risott.jpg" }
ListElement { name: "Southwestern Alfredo"
icon: "file:/Southwestern_Alfredo.jpg" }
ListElement { name: "Chef's chocolate salty balls"
icon: "file:/Beef_Risott.jpg" }
ListElement { name: "Other good stuff"
icon: "file:/Southwestern_Alfredo.jpg" }

}


In main.qml


Component {
id: appDelegate
Item {
width: 400; height: 400; z:1;
scale: PathView.iconScale

Image {
id: myIcon
y: 0; anchors.horizontalCenter: parent.horizontalCenter
source: icon

}
Text {
anchors { top: myIcon.bottom; horizontalCenter: parent.horizontalCenter }

text: name
font.pixelSize: 40
}

MouseArea {
anchors.fill: parent
onClicked: view.currentIndex = index



}
}
}

Component {
id: appHighlight
Rectangle { width: 400; height: 400; color: "yellow" }
}

PathView {
id: view
anchors.fill: parent
//highlight: appHighlight
preferredHighlightBegin: 0.5
preferredHighlightEnd: 0.5
focus: true
model: recipe
delegate: appDelegate
path: Path {
startX: 100
startY: 120
PathAttribute { name: "iconScale"; value: 0.2 }
PathLine { x: 400; y: 120; }
PathAttribute { name: "iconScale"; value: 0.4 }
PathLine { x: 700; y: 120;}
PathAttribute { name: "iconScale"; value: 0.2 }

}



Image {
id: image
x: 0
y: 0
width: 800
height: 480
opacity: 1
anchors.bottom: parent.bottom
source: "file:/background.jpg"
}

Rectangle{width: parent.width; heightarent.height/2.5 ; color: "black";anchors.bottomarent.bottom;

I would like to put the specific ingredients here

}