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. ScrollView: only get visible drawing area?
Forum Updated to NodeBB v4.3 + New Features

ScrollView: only get visible drawing area?

Scheduled Pinned Locked Moved Solved QML and Qt Quick
2 Posts 1 Posters 242 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.
  • T Offline
    T Offline
    Tobias Fensch
    wrote on last edited by
    #1

    Hello,

    I am using a QML-ScrollView and want to draw something in C++ with a QQuickPaintedItem.

    At the moment, in the Paint-Method of the QQuickPaintedItem, my drawing area takes up the entire scroll area. This has some ugly side effects as mentioned here: ScrollView: contentWidth limited?

    Here my question: Is it possible to get only the visible scroll area as the drawing area? And than repaint the visible area on scroll changed event?

    I am using Qt5.15

    regards,
    Tobias

    1 Reply Last reply
    0
    • T Offline
      T Offline
      Tobias Fensch
      wrote on last edited by
      #2

      To solve this, I use a ListView to divide the area in segments, 8.000 pixel each.

      ListView {
          id: graphicView
          anchors.fill: parent
          orientation: Qt.Horizontal
          spacing: 0
          // always repaint items on scroll
          reuseItems: false
      
          // the width of the scrollable area
          readonly property real displayWidth: 64000
          // define a max width for segmentation to avoid the contentWidth limitation of qml
          readonly property int segmentWith: 8000
          readonly property int segmentCount: Math.max(1, Math.round(displayWidth / segmentWith))
          onSegmentCountChanged: {
              console.log("OsziGraphic: displayWidth = " + displayWidth + ", segmentCount = " + segmentCount);
          }
      
          model: graphicView.segmentCount
          delegate:
              OsziGraphicViewModel {
                  height: ListView.view.height
                  width: graphicView.displayWidth / graphicView.segmentCount
                  segmentIndex: index
              }
      }
      

      In the backend I inherit from QQuickPaintedItem to add properties for the current segment index and the render area to draw in. I translate the rendered coordinates to draw as if the entire area is used.

      void QQuickSegmentedPaintedItem::paint(QPainter *painter)
      {
          if (m_segmentIndex == -1)
              return;
      
           // calculate the current render rect inside the drawing area
           m_renderRect = QRect(m_segmentIndex * boundingRect().width(), 0, boundingRect().width(), boundingRect().height());
      
           // move the drawing area relative to the current render area
           painter->translate(-m_renderRect.left(), 0);
      }
      

      This works nicely for my needs. I hope you get the idea.

      cheers!

      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