Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. I want to make listview design format

I want to make listview design format

Scheduled Pinned Locked Moved General and Desktop
qt creator
8 Posts 3 Posters 1.8k 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.
  • darongyiD Offline
    darongyiD Offline
    darongyi
    wrote on last edited by
    #1

    I want to draw listview design like this.
    I m considering using QML or normal form..

    listview design

    I draw listview and It's hard to make same form my pic.

    p3c0P 1 Reply Last reply
    0
    • darongyiD darongyi

      I want to draw listview design like this.
      I m considering using QML or normal form..

      listview design

      I draw listview and It's hard to make same form my pic.

      p3c0P Offline
      p3c0P Offline
      p3c0
      Moderators
      wrote on last edited by
      #2

      @darongyi Can you show what you have tried ?

      157

      darongyiD 1 Reply Last reply
      0
      • p3c0P p3c0

        @darongyi Can you show what you have tried ?

        darongyiD Offline
        darongyiD Offline
        darongyi
        wrote on last edited by
        #3

        @p3c0

        This is my github repository.

        p3c0P 1 Reply Last reply
        0
        • darongyiD darongyi

          @p3c0

          This is my github repository.

          p3c0P Offline
          p3c0P Offline
          p3c0
          Moderators
          wrote on last edited by
          #4

          @darongyi Looking at your requirement, IMO, the best way would be to use QListView with custom delegate by subclassing QStyledItemDelegate and overriding paint().
          Or If using QML then following example may help you:

          import QtQuick 2.4
          
          Item {
              width: 100
              height: 120
          
              ListModel {
                  id: model
                  ListElement { name: "W"; number: "3,000" }
                  ListElement { name: "V"; number: "150" }
                  ListElement { name: "A"; number: "20" }
              }
          
              ListView {
                  anchors.fill: parent
                  model: model
                  delegate: Rectangle {
                      width: parent.width
                      height: 40
                      Row {
                          anchors.centerIn: parent
                          Rectangle { width: 60; height: 40; Text { color: index==0 ? "blue": "darkgray"; font.pointSize: 14; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; text: number } }
                          Rectangle { width: 40; height: 40; Text { color: "lightgray"; anchors.centerIn: parent; text: name } }
                      }
                  }
              }
          }
          

          You can added another Rectangle with with height as 1 for separator between each Item.

          157

          1 Reply Last reply
          0
          • darongyiD Offline
            darongyiD Offline
            darongyi
            wrote on last edited by
            #5

            Thank you!
            I found qml book

            p3c0P 1 Reply Last reply
            0
            • darongyiD darongyi

              Thank you!
              I found qml book

              p3c0P Offline
              p3c0P Offline
              p3c0
              Moderators
              wrote on last edited by
              #6

              @darongyi You can mark the post as solved and upvote answers if you found them useful so that it would be helpful to others too.

              157

              1 Reply Last reply
              0
              • TobyYiT Offline
                TobyYiT Offline
                TobyYi
                wrote on last edited by
                #7

                @darongyi If you use qml to design your listview,it can be very easy to do it ,and www.qmlbook,org is good to you

                将QtCoding进行到底,做Qt的宠儿
                关注移动互联网,关注手机助手
                开发即时通讯,服务于金融行业
                My github :https://github.com/toby20130333

                1 Reply Last reply
                0
                • darongyiD Offline
                  darongyiD Offline
                  darongyi
                  wrote on last edited by
                  #8

                  I made code and class.
                  I wrote on my blog. Check It out!

                  Customize QListWidgetItem

                  1 Reply Last reply
                  1

                  • Login

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