Writing generic QML ListView that can be created to reference different instances of a c++ data class.



  • I have a QtQuick 2 application with a c++ back end. The app needs to display various different lists with the data being processed in the c++. I have a c++ class that handles everything to do with the lists (a load of link lists) and passes QML a QList of strings to display in each list. If the user presses key 2 the 2nd item in the list is found by the c++ and the relevant list is displayed by the QML etc.

    I need to be able to make this generic. Obviously in the c++ I just create multiple versions of my object holding the differing data (the app loads different addons to do different things and each would need its own version of the c++ class). So, do I get each addon to pass each instance to QML with the same name ("menuManager")? If so how would the QML differentiate between A:menuManager, B:menuManager, C:menuManager? My assumption is that passing B would lose the reference to A.

    How can I make the code generic so I can reference A, B, C without either of them knowing about the other (separate dll's). If I call the code below from the main.qml in A, B and C as a component how can I associate each with the correct c++ so I get the same functionality with each but from different source data. (The application will flip between A, B and C so not reloading things is best).

    @
    import QtQuick 2.0

    Rectangle
    {
    id: theMenu
    property double fontSize: menuManager.menuFontPointSize
    property double menuWidth: menuManager.menuWidth
    property string menuTitle: menuManager.menuTitle
    property double menuItemHeight: 0

    Component
    {
        id: menuEntryDelegate
    
        Rectangle
        {
            id: menuItemContainer
            width: menuEntry.width
            height: menuEntry.height * 1.25
    
            property double fontSize: theMenu.fontSize
            property double menuWidth: theMenu.menuWidth
            property double menuItemHeight: theMenu.menuItemHeight//TBD - listview needs the height
    
            state: ListView.isCurrentItem ? "selected" : "notselected"
    
            Text
            {
                id: menuEntry
                font.pointSize: fontSize
                width: menuWidth
                wrapMode: Text.WordWrap
                text: displayText
                clip: true
    
            }
    
            states:
            [
                State
                {
                    name: "selected"
                    PropertyChanges
                    {
                        target: menuItemContainer
                        color: "#FAFCD9"
                    }
    

    ...
    ...
    ]

        }
    }
    
    Rectangle
    {
        id: menuContainer
        width:theMenu.menuWidth
        height: parent.height
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.top: parent.top
    
        property string menuTitle: theMenu.menuTitle
    
        ListView
        {
            id: menuHolder
            model: menuModel
            anchors.fill: parent
            opacity: 1
    
            clip: true
    
            property string menuTitle: ""
    
            header: Rectangle
            {
                width: menuHolder.width
                height: 50
                color: "#2A51A3"
    
    
               Text
                {
                   id: header
                   anchors.centerIn: parent
    
                   text: menuTitle//menuManager.menuTitle
                   font.pointSize: menuManager.menuFontPointSize
                   color: "white"
                   wrapMode: Text.WordWrap
                }
            }
    
            delegate: menuEntryDelegate
            focus: true
    
    
            Keys.onPressed:
            {
    ......
                //Ways to select a menu item
                else if((event.key >= Qt.Key_1 && event.key <= Qt.Key_9)
                        || event.key === Qt.Key_Return || event.key === Qt.Key_Enter)
                {
                    if(event.key >= Qt.Key_1 && event.key <= Qt.Key_9)
                    {
                        menuHolder.currentIndex = event.key  - Qt.Key_1;
                    }
    
                    menuManager.displayMenu(menuHolder.currentIndex);
                    theMenu.fontSize = menuManager.menuFontPointSize
                }
            }
        }
    }
    

    }
    @



  • I'm not quite following you here - so do you want to simultaneously display data from A, B, and C? Isn't that going to mean having separate QML root contexts anyways?

    Do you want to display them all in the same root context, but at different times in the program's execution? In that case, can you unbind and rebind data A, B, and C from the root context?


Log in to reply
 

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