Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. [solved] invoke a function defined on ListElement
QtWS25 Last Chance

[solved] invoke a function defined on ListElement

Scheduled Pinned Locked Moved QML and Qt Quick
9 Posts 3 Posters 3.5k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • M Offline
    M Offline
    muchasuerte
    wrote on last edited by
    #1

    There is a way to invoke a function defined on ListElement from ListView delegate?

    How I can invoke "action" from "ListViewDelegate" ?

    @
    ListModel {
    id: menuModel
    ListElement {
    title: "Item1";
    focus: true
    Keys.onPressed: {
    console.log("ListElement Captured:", event.text);
    }
    function action(){
    console.log("log-2")
    }
    }
    ListElement {
    title: "Item2";
    function action(){
    console.log("log-2")
    }
    }
    }

    ListView {
        id: list1
        orientation: "Horizontal"
        width: menuModel.count * 120
        anchors.centerIn: parent
        model: menuModel
        cacheBuffer: 200
        delegate: ListViewDelegate {}
        focus: true
    
        Behavior on x {
            NumberAnimation { duration: 600; easing.type: Easing.OutQuint }
        }
    }@
    
    1 Reply Last reply
    0
    • T Offline
      T Offline
      thisisbhaskar
      wrote on last edited by
      #2

      First thing is that ListElement is not a displayable element, so you don't get keys.onPressed in it.

      And I don't think you can have a function inside ListElement, is it valid syntactically. Don't you get run time error if you do that??
      You can not call these functions as you don't have a way to reference them, ListElement does not have id or something like that..

      what is your use-case, why do you want to do this??

      1 Reply Last reply
      0
      • M Offline
        M Offline
        muchasuerte
        wrote on last edited by
        #3

        I want use a ListView to implement a main menu.

        ListElement is displayable by an ListViewDelegate, but from it I can view only properties like "title".

        I'd like associate an function to every ListElement ad call it from the ListViewDelegate

        es:
        @
        Item {
        id: container
        width: 120 ; height: 120;
        anchors.leftMargin: 20; anchors.rightMargin: 20
        focus: true

        Keys.onPressed: {
            if ( event.key == Qt.Key_Return )
            {
                // can I invoke here a method defined on listElement ?
                event.accepted = true
            }
        }
        
        Text {
            id: label
            width: parent.width
            horizontalAlignment: Text.AlignHCenter
            anchors.top: icon.bottom
            color: Qt.darker("#FFFFFF", 2)
            text: title
            font.pixelSize: 14
            font.bold: true
        }
        
        
        MouseArea {
            id: mouseArea
            anchors.fill: parent
            hoverEnabled: true
            focus: true
            onClicked: {
                ListView.view.currentIndex = index
                container.forceActiveFocus()
                console.log("onClicked ...")
            }
        }
        
        states: State {
            name: "active"; when: container.activeFocus
            PropertyChanges { target: label; font.pixelSize: 16 }
            PropertyChanges { target: label; color: "#FFFFFF" }
        }
        
        transitions: Transition {
            NumberAnimation { properties: "scale"; duration: 100 }
        }
        

        }
        @

        1 Reply Last reply
        0
        • T Offline
          T Offline
          thisisbhaskar
          wrote on last edited by
          #4

          No you can not do that..

          One more way you can try is to use VisualItemModel, have a .qml file which defines the component for your delegate of your VisualItemModel and try it out.

          1 Reply Last reply
          0
          • M Offline
            M Offline
            muchasuerte
            wrote on last edited by
            #5

            thanks you, I solve my problem.

            1 Reply Last reply
            0
            • T Offline
              T Offline
              thisisbhaskar
              wrote on last edited by
              #6

              How did you solve it.. can you post your solution here...

              1 Reply Last reply
              0
              • M Offline
                M Offline
                muchasuerte
                wrote on last edited by
                #7

                Yes, sorry :

                I define IconButton like that
                @
                Item {
                property alias title: label.text
                property string imgFocus: ""
                property string imgNoFocus: ""

                id: container
                width: 120 ; height: 120;
                anchors.leftMargin: 20; anchors.rightMargin: 20
                focus: true
                signal activity
                
                Keys.onPressed: {
                    if ( event.key == Qt.Key_Return )
                    {
                         activity()
                         event.accepted = true
                    }
                    else
                        console.log( " onPressed " + event.key + " Qt.Key_Back: " + Qt.Key_Delete + " Qt.Key_0: " + Qt.Key_0);
                
                }
                
                Image { id: icon;
                    width: 120;
                    height: 120;
                    anchors.rightMargin: 0;
                    anchors.bottomMargin: 11;
                    anchors.fill: parent;
                    source: imgNoFocus;
                    smooth: true
                }
                
                Text {
                    id: label
                    width: parent.width
                    horizontalAlignment: Text.AlignHCenter
                    anchors.top: icon.bottom
                    color: Qt.darker("#FFFFFF", 2)
                    font.pixelSize: 14
                    font.bold: true
                }
                
                
                MouseArea {
                    id: mouseArea
                    anchors.fill: parent
                    hoverEnabled: true
                    focus: true
                    onClicked: {
                        console.log("onClicked ...")
                    }
                }
                
                states: State {
                    name: "active"; when: container.activeFocus
                    PropertyChanges { target: label; font.pixelSize: 16 }
                    PropertyChanges { target: label; color: "#FFFFFF" }
                    PropertyChanges { target: icon; source: imgFocus }
                }
                
                transitions: Transition {
                    NumberAnimation { properties: "scale"; duration: 100 }
                }
                

                }
                @

                and use it into a VisualItemModel as you suggest :

                @

                VisualItemModel {
                    id: mainMenuModel
                    IconButton {
                        title: "Tv";
                        imgFocus: "themes/watch_big.png";
                        imgNoFocus: "themes/watch_small.png"
                        onActivity: {
                            console.log(title)
                            list1.model = tvMenuModel
                        }
                    }
                

                }

                ListView {
                    id: list1
                    orientation: "Horizontal"
                    model: mainMenuModel
                    width: model.count * 120
                    anchors.centerIn: parent
                    cacheBuffer: 200
                    focus: true
                
                    Behavior on x {
                        NumberAnimation { duration: 600; easing.type: Easing.OutQuint }
                    }
                }
                

                @

                1 Reply Last reply
                0
                • N Offline
                  N Offline
                  njeisecke
                  wrote on last edited by
                  #8

                  ListModel and (I guess) ListElement are somehow special and limited in functionality. See http://bugreports.qt.nokia.com/browse/QTBUG-19763 for a discussion.

                  It seems that you currently (Qt Quick < 2.0) should not use ListModel or ListElements for anything else than declaring a data model.

                  1 Reply Last reply
                  0
                  • T Offline
                    T Offline
                    thisisbhaskar
                    wrote on last edited by
                    #9

                    Ok great.. VisualItemModel solves the problem :).

                    1 Reply Last reply
                    0

                    • Login

                    • Login or register to search.
                    • First post
                      Last post
                    0
                    • Categories
                    • Recent
                    • Tags
                    • Popular
                    • Users
                    • Groups
                    • Search
                    • Get Qt Extensions
                    • Unsolved