Results 1 to 2 of 2

Thread: list View scroll indicator

  1. #1
    Join Date
    Jun 2016
    Posts
    99
    Thanks
    18
    Thanked 1 Time in 1 Post
    Qt products
    Qt5
    Platforms
    Unix/X11

    Default list View scroll indicator

    I'm working on fixing a list view scroll indicator, the issue is the scroll indicator never makes it to bottom of the list view.

    Qt Code:
    1. //BITListViewScroller
    2. import QtQuick 2.3
    3. import "../../Common/UI"
    4.  
    5. Rectangle {
    6. objectName: "BITListViewScroller"
    7.  
    8. property int listHeight: parent.height - Metrics.buttonHeight
    9.  
    10. border { color: '#44FFFFFF'; width: Metrics.ptToPxF(1.5) }
    11. anchors.right: parent.right; width: Metrics.ptToPx(6)
    12. height: Math.max(Metrics.buttonHeight, parent.visibleArea.heightRatio * listHeight)
    13. y: parent.visibleArea.yPosition * listHeight
    14. color: '#EE000000'
    15. visible: parent.contentHeight > parent.height // visible if content taller than listview
    16. opacity: parent.moving ? 1 : .3 // translucent when not moving
    17.  
    18. Behavior on opacity { NumberAnimation { duration: 200 } }
    19. }
    To copy to clipboard, switch view to plain text mode 

    List view use BITListViewScrollIndicator

    Qt Code:
    1. //ListViewWithScrollbar
    2. import QtQuick 2.3
    3. import "../../Common/UI"
    4.  
    5. ListView {
    6. id: listView
    7. boundsBehavior: Flickable.StopAtBounds
    8. snapMode: ListView.SnapToItem
    9. clip: true
    10.  
    11. BITListViewScroller{}
    12. }
    To copy to clipboard, switch view to plain text mode 

    Implementation of the listView and Scroll indicator, When scrolling through the list the indicator has a large gap between it and the bottom of the list

    I have messed with the visibleArea's heightRatio and yPosition to get rid of the gar but subtracting of some set integer value and it seems to get rid of the gap but its used in multiple places.

    I found in the documentation that the do the same calculation for a scroll indicator

    I need a way to adjust the BITListViewScroller heightRatio and yPosition to get rid of the gap ?

    Qt Code:
    1. //Implemantatioin of ListViewWithScrollbar
    2. // Test Units
    3. ListViewWithScrollbar {
    4. id: scrollViewTestUnits
    5. width : root.width
    6. height : root.height - columnMasterUnit.height - bNavigationTitleBar.height
    7. anchors {
    8. top : columnMasterUnit.bottom;
    9. left: bNavigationTitleBar.left
    10. }
    11. onFlickingChanged: {
    12. console.debug(visibleArea.heightRatio, visibleArea.yPosition)
    13. }
    14.  
    15. model: mAboutTestUnitsModel
    16. delegate: Row {
    17. spacing: Metrics.buttonHeight/2
    18. anchors.right: parent.right
    19. Text {
    20. width: scrollViewTestUnits.width - parent.spacing
    21. wrapMode: Text.Wrap
    22. horizontalAlignment: Text.AlignLeft
    23. font { family: PStyle.defaultFontFamily; bold: false; pixelSize: Metrics.ptToPx(unitsFont)}
    24. text : Name + (Version == "" ? "" : "\n " + Version)
    25. }
    26. }
    27. }
    To copy to clipboard, switch view to plain text mode 

    attached is a screen cap of my scroll idicator with the gap between the indicator and the bottom of the list...

    do I need to adjust the height of the scroll indicator ?

    I thought about exposing properties using property bindings to expose the indicators height and y values at setting them based on what that particular list view needs

    -I can get rid of the gap by subtracting off 445 from the parent.visibleArea.heightRatio * listHeight calculation but its seems wrong or hacky to do it like that

    scroll indicator issue.jpg

  2. #2
    Join Date
    Jun 2016
    Posts
    99
    Thanks
    18
    Thanked 1 Time in 1 Post
    Qt products
    Qt5
    Platforms
    Unix/X11

    Default Re: list View scroll indicator

    The issue is propagating from the Metrics.buttonHeight calculation removing this fixes most of my issues

    I'm able to see the scroll indicator hit the bottom of the flickableArea now, however I'm still having issues getting the indicator to resize appropriately based of the amount of data populated. With large data sets the indicator disappears cause it is so small. Hard coding a min value for the scroll indicator size is not the correct solution (weird things happen indicator goes past list view area). This is hard to explain but it seems like I need to reverse the calculations I'm performing, since this is based of a heightRatio and yPosition. Since I need to set a static size of the indicator when large amounts of data are loaded I then need to calculate the yPosition I believe based of static size of indicator

    The buttonHeight metrics are computed based upon the display dot pitch and a minimum acceptable height for interactive elements. The minimum height is based on human factors.
    Recommended button height: 9mm
    Minimum button height: 7mm

    Qt Code:
    1. property int listHeight: parent.height - Metrics.buttonHeight
    2.  
    3. border { color: '#44FFFFFF'; width: Metrics.ptToPxF(1.5) }
    4. anchors.right: parent.right; width: Metrics.ptToPx(6)
    5. height: Math.max(Metrics.buttonHeight, parent.visibleArea.heightRatio * listHeight)
    6. y: parent.visibleArea.yPosition * listHeight
    To copy to clipboard, switch view to plain text mode 

Similar Threads

  1. Llarge set of data in QML List view/C++ List model
    By ashwasimha in forum Qt Quick
    Replies: 4
    Last Post: 26th October 2016, 08:50
  2. Replies: 5
    Last Post: 4th March 2015, 23:02
  3. Replies: 2
    Last Post: 5th August 2011, 15:48
  4. List View with sections for alphabetialy sorted list
    By woodtluk in forum Qt Programming
    Replies: 4
    Last Post: 12th October 2010, 12:50
  5. Scroll View for Canvas
    By Kapil in forum Qt Programming
    Replies: 10
    Last Post: 25th March 2006, 08:19

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Digia, Qt and their respective logos are trademarks of Digia Plc in Finland and/or other countries worldwide.