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. Update Listview elements on signal in qml
Forum Updated to NodeBB v4.3 + New Features

Update Listview elements on signal in qml

Scheduled Pinned Locked Moved Solved QML and Qt Quick
3 Posts 2 Posters 356 Views 2 Watching
  • 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.
  • N Offline
    N Offline
    nikhil30
    wrote on 14 May 2020, 15:11 last edited by nikhil30
    #1

    Hi,
    I am using listview in order to display vertical list of elements. I want to update the listview elements (Text property) on the reception of signal in qml.
    How could i update the listview elements'property using c++ functions on signal received...?

    Below is the snippet of my code:

        Component {
            id: my_delegate
    
                Item {
                    id: alarm_1
                    width: 680
                    height: 190
    
                    Rectangle {
                        x:0
                        y:188
                        width:(680-10)
                        height:4
                        smooth: false
                        border.width: 2
                        border.color: "#303030"
                    }
    
                    Text {
                        id: alarm_primary_zone
                        x: 20
                        y: 20
                        width: 300
                        height: 26
                        color: "#e0e0e0"
                        text: alarm.getAlarmPrimZone(index)
                        font.family: "Honeywell Sans"
                        wrapMode: Text.WordWrap
                        verticalAlignment: Text.AlignTop
                        font.pixelSize: 22
                        horizontalAlignment: Text.AlignLeft
                    }
    
                    Text {
                        id: alarm_1_primary_zone_label
                        x: 20
                        y: 54
                        width: 300
                        height: 26
                        color: "#e0e0e0"
                        text:alarm.getAlarmZoneLabel(index)
                        font.family: "Honeywell Sans"
                        wrapMode: Text.WordWrap
                        verticalAlignment: Text.AlignTop
                        font.pixelSize: 22
                        horizontalAlignment: Text.AlignLeft
                    }
    
                    Text {
                        id: alarm_1_device_label
                        x: 20
                        y: 88
                        width: 300
                        height: 26
                        color: "#e0e0e0"
                        text: alarm.getAlarmPointInfo(index)
                        font.family: "Honeywell Sans"
                        wrapMode: Text.WordWrap
                        verticalAlignment: Text.AlignTop
                        font.pixelSize: 22
                        horizontalAlignment: Text.AlignLeft
                    }
    
                    Text {
                        id: alarm_1_date_time_stamp
                        x: 450
                        y: 88
                        width: 211
                        height: 26
                        color: "#ffffff"
                        text: alarm.getAlarmTimestamp(index)
                        font.family: "Honeywell Sans"
                        wrapMode: Text.WordWrap
                        verticalAlignment: Text.AlignTop
                        font.pixelSize: 22
                        horizontalAlignment: Text.AlignLeft
                    }
    }
    
        ListView {
            id:view
            x:120
            y:80
            width:680
            height:320
            contentWidth: 680
            delegate: my_delegate
            model: alarm.getDisplayEvtCount(); //no of elements in list
            boundsBehavior: Flickable.StopAtBounds
            flickableDirection:Flickable.VerticalFlick
            orientation: Qt.Vertical
            spacing: 0
            interactive: true
            cacheBuffer: 190
        }
    Connections {
             onDisplayListUpdate {
                      //  want to update listview elements here 
                      //  e.g alarm_primary_zone.text = "New Text"  or call c++ function alarm.getAlarmPrimZone(index)
             }
    }
    
    1 Reply Last reply
    0
    • S Offline
      S Offline
      sierdzio
      Moderators
      wrote on 15 May 2020, 04:19 last edited by
      #2

      You're doing it backwards. You should update the model used by ListView, then the delegates will update automatically.

      Currently you're just using an integer model, so easiest way to trigger an update is to do:

      view.model = 0
      view.model = alarm.getDisplayEvtCount();
      

      But a much better and future-proof solution is to construct a custom model based on QAbstractItemModel class. Define the roles you need and use them in your delegates in QML. This way Qt will handle view updates completely automatically.

      There are also other ways to do this, see: link and link.

      (Z(:^

      1 Reply Last reply
      0
      • N Offline
        N Offline
        nikhil30
        wrote on 15 May 2020, 18:41 last edited by
        #3

        Thanks for the reply.

        I will also try to implement custom model based on QAbstractItemModel class as suggested.

        1 Reply Last reply
        0

        2/3

        15 May 2020, 04:19

        • Login

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