I have a Vertical ListView nested in a horizontal Listview like below (it is generic code because the real code is too long and I wanted to give an idea of what I want to do ) :

ApplicationWindow{
       id:appwindow
       ............
       Item{
        id:dayView
        ...........
        ListView{
            id:dayCalendar 
            orientation: Qt.Horizontal
            model:31
            delegate: Item{
            ...............
            ListView{
                id:daylistView
                orientation: Qt.Vertical
                model:24
                delegate:Item{
                     id:hourItem
                     property string hourTime:hourweeklistviewLabel
                     property string notetaking:notesLabe 
                     .............
                     MouseArea{
                          anchors.fill:parent
                          onClicked:{
                          windowLoader.active =true
                          daylistView.currentIndex=index

                          }
                     }  
                     Rectangle{}
                     Label{
                       id:hourweeklistviewLabel
                     }
                     Label{
                       id:notesLabel                                        
                       anchors.left:hourweeklistviewLabel.right
                       anchors.leftMargin: 30
                       text:""
                     }//Label
                    }//delegate:Item
                   }//ListView
                  } //delegate:Item
                 }//ListView
                }//Item

There is also a loader that loads a window when I click inside MouseArea inside the vertical ListView:

Loader {
    id:windowLoader
    focus: true
    active:false
    sourceComponent: Window{
        id:inputWin
        title:"Enter Note"
        width:500
        height:300
        visible:true

        onClosing:{
            windowLoader.active=false
            daylistView.currentIndex = calendarMonth.selectedDate.getDate() === new Date().getDate()
                    && calendarMonth.selectedDate.getMonth() === new Date().getMonth()?getHour():12
        }
        TextField {
            id:title
            x:50
            y:20
            placeholderText :'Enter Note'
            text:daylistView.currentItem.notetaking.text
        }
        TextField{
            id:timeDate

            anchors.horizontalCenter: title.horizontalCenter
            anchors.top:title.bottom
            anchors.topMargin:10
            placeholderText :  calendarMonth.selectedDate.getDate()  "-"
                     (calendarMonth.selectedDate.getMonth() 1) "-"
                     calendarMonth.selectedDate.getFullYear()   " "
                     daylistView.currentItem.hourTime.text  ":00"
                }

            Button {
                 id: button
                 text: qsTr("Add Note")
                 anchors.centerIn:parent

                 onClicked: {
                       if (title.text !==""){daylistView.currentItem.notetaking.text= title.text}
                       else{}

                    }
                }
            }
        }

The problem I am facing is that ListView daylistView when I run the app is not defined inside the Window inputWin so I can not use the code in the window (bidirectional binding between title.text and daylistView.currentItem.notetaking.text is broken and daylistView.currentIndex is null). I tried to expose daylistView as property but listview continues not to be defined. How to make this listview be defined?

Thank you.

CodePudding user response：

This makes sense, because you are creating multiple instances of the daylistView, so it is undefined which one you want.

You can however expose the ListView as property in the root delegate and use it through ListView.currentItem, given that you set currentIndex on the dayCalendar ListView

ListView{
    id: dayCalendar

    delegate: Item {
        id: calDelegate
        property int calIndex: index
        property var dayList: daylistView
        
        ListView {
            id: daylistView

            delegate: Item {
                MouseArea {
                    onClicked: {
                        dayCalendar.currentIndex = calDelegate.calIndex
                        daylistView.currentIndex = index
                        ...
                    }
                }
            }
        } 
    }

Inside the loaded qml:

TextField {
    id:title
    text: dayCalendar.currentItem.dayList.currentItem.notetaking.text
}