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. Use Section Delegate as Footer of Each Section Instead of Header in QML ListView
QtWS25 Last Chance

Use Section Delegate as Footer of Each Section Instead of Header in QML ListView

Scheduled Pinned Locked Moved Solved QML and Qt Quick
4 Posts 3 Posters 909 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.
  • C Offline
    C Offline
    Clover
    wrote on last edited by
    #1

    The example on this page uses section delegate as header: http://doc.qt.io/qt-5/qml-qtquick-listview.html#section.property-prop

    Are there any methods to use section delegate as footer of each section instead? Can't find it in the document.

    DiracsbracketD 1 Reply Last reply
    0
    • C Clover

      The example on this page uses section delegate as header: http://doc.qt.io/qt-5/qml-qtquick-listview.html#section.property-prop

      Are there any methods to use section delegate as footer of each section instead? Can't find it in the document.

      DiracsbracketD Offline
      DiracsbracketD Offline
      Diracsbracket
      wrote on last edited by
      #2

      @Clover
      No, there aren't any methods for that.

      1 Reply Last reply
      0
      • GrecKoG Offline
        GrecKoG Offline
        GrecKo
        Qt Champions 2018
        wrote on last edited by
        #3

        You could hack it like so :

        ListView {
            anchors.fill: parent
            model: ListModel {
                ListElement { name: "Arthur" }
                ListElement { name: "Arlette" }
                ListElement { name: "Bonnie" }
                ListElement { name: "Bernadette" }
                ListElement { name: "Clothilde" }
                ListElement { name: "Charles" }
                ListElement { name: "Clyde" }
                ListElement { name: "Dodo" }
            }
            section {
                property: "name"
                criteria: ViewSection.FirstCharacter
            }
            delegate: Column {
                width: parent.width
                id: column
                ItemDelegate {
                    width: parent.width
                    text: model.name
                }
                Label {
                    visible: column.ListView.section !== column.ListView.nextSection
                    text: column.ListView.section
                }
            }
        }
        

        Embed the section in each delegate and display it when the section differs from the next one.

        C 1 Reply Last reply
        1
        • GrecKoG GrecKo

          You could hack it like so :

          ListView {
              anchors.fill: parent
              model: ListModel {
                  ListElement { name: "Arthur" }
                  ListElement { name: "Arlette" }
                  ListElement { name: "Bonnie" }
                  ListElement { name: "Bernadette" }
                  ListElement { name: "Clothilde" }
                  ListElement { name: "Charles" }
                  ListElement { name: "Clyde" }
                  ListElement { name: "Dodo" }
              }
              section {
                  property: "name"
                  criteria: ViewSection.FirstCharacter
              }
              delegate: Column {
                  width: parent.width
                  id: column
                  ItemDelegate {
                      width: parent.width
                      text: model.name
                  }
                  Label {
                      visible: column.ListView.section !== column.ListView.nextSection
                      text: column.ListView.section
                  }
              }
          }
          

          Embed the section in each delegate and display it when the section differs from the next one.

          C Offline
          C Offline
          Clover
          wrote on last edited by
          #4

          @GrecKo Thank you! I am using a similar hack now.

          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