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. How to H/V scrollable table with A LOT of items (ListView of ListViews)
Forum Updated to NodeBB v4.3 + New Features

How to H/V scrollable table with A LOT of items (ListView of ListViews)

Scheduled Pinned Locked Moved QML and Qt Quick
tableviewlistviewscrollareagridview
1 Posts 1 Posters 852 Views 1 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.
  • C Offline
    C Offline
    crsn
    wrote on 17 Apr 2015, 11:28 last edited by crsn
    #1

    Hi,

    I'm trying to design a qml item that will contain thousands of items with the layout of a grid.

    I tried several approaches (TableView, GridView) but everytime I had issues trying to resize my Component using a rows * columns format or with memory.

    The best approach i found so far is the following:

    import QtQuick 2.4
    import QtQuick.Controls 1.3
    import QtQuick.Window 2.2
    import QtQuick.Dialogs 1.2
    
    ApplicationWindow {
        title: qsTr("Hello World")
        width: 800
        height: 600
        visible: true
    
        Item {
            id: grid
            property int numRows: 1000
            property int numColumns: 1000
            property int cellSize: 35
            property int cellSpacing: 1
    
            anchors.fill: parent
    
            ScrollView {
                id: scrollView
                anchors.fill: parent
                anchors.centerIn: parent
                contentItem: columnsList
    
                ListView {
                    id: columnsList
    
                    anchors.fill: parent
                    anchors.centerIn: parent
                    orientation: ListView.Vertical
                    spacing: grid.cellSpacing
                    clip: true
                    interactive: false
                    cacheBuffer: 1
    
                    model: grid.numRows
    
                    delegate: ListView {
                        id: row
                        width: columnsList.width
                        height: grid.cellSize
                        orientation: ListView.Horizontal
                        spacing: grid.cellSpacing
                        clip: true
                        interactive: false
                        cacheBuffer: 1
    
                        model: grid.numColumns
                        delegate: Rectangle {
                            width: grid.cellSize
                            height: grid.cellSize
                            color: "green"
                        }
                    }
                }
            }
        }
    

    It would be perfect if it wasn't for the fact that the horizontal scrollbar isn't shown!
    I trid also to set height and width manually, but this causes all the cells to be created and it's not acceptable.

    Is it a good approach?
    Is there a workaround to make the horizontal scrollbar appear?

    1 Reply Last reply
    0

    1/1

    17 Apr 2015, 11:28

    • Login

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