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.
//BITListViewScroller
import QtQuick 2.3
import "../../Common/UI"
Rectangle {
objectName: "BITListViewScroller"
property int listHeight: parent.height - Metrics.buttonHeight
border { color: '#44FFFFFF'; width: Metrics.ptToPxF(1.5) }
anchors.right: parent.right; width: Metrics.ptToPx(6)
height: Math.max(Metrics.buttonHeight, parent.visibleArea.heightRatio * listHeight)
y: parent.visibleArea.yPosition * listHeight
color: '#EE000000'
visible: parent.contentHeight > parent.height // visible if content taller than listview
opacity: parent.moving ? 1 : .3 // translucent when not moving
Behavior on opacity { NumberAnimation { duration: 200 } }
}
//BITListViewScroller
import QtQuick 2.3
import "../../Common/UI"
Rectangle {
objectName: "BITListViewScroller"
property int listHeight: parent.height - Metrics.buttonHeight
border { color: '#44FFFFFF'; width: Metrics.ptToPxF(1.5) }
anchors.right: parent.right; width: Metrics.ptToPx(6)
height: Math.max(Metrics.buttonHeight, parent.visibleArea.heightRatio * listHeight)
y: parent.visibleArea.yPosition * listHeight
color: '#EE000000'
visible: parent.contentHeight > parent.height // visible if content taller than listview
opacity: parent.moving ? 1 : .3 // translucent when not moving
Behavior on opacity { NumberAnimation { duration: 200 } }
}
To copy to clipboard, switch view to plain text mode
List view use BITListViewScrollIndicator
//ListViewWithScrollbar
import QtQuick 2.3
import "../../Common/UI"
ListView {
id: listView
boundsBehavior: Flickable.StopAtBounds
snapMode: ListView.SnapToItem
clip: true
BITListViewScroller{}
}
//ListViewWithScrollbar
import QtQuick 2.3
import "../../Common/UI"
ListView {
id: listView
boundsBehavior: Flickable.StopAtBounds
snapMode: ListView.SnapToItem
clip: true
BITListViewScroller{}
}
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 ?
//Implemantatioin of ListViewWithScrollbar
// Test Units
ListViewWithScrollbar {
id: scrollViewTestUnits
width : root.width
height : root.height - columnMasterUnit.height - bNavigationTitleBar.height
anchors {
top : columnMasterUnit.bottom;
left: bNavigationTitleBar.left
}
onFlickingChanged: {
console.debug(visibleArea.heightRatio, visibleArea.yPosition)
}
model: mAboutTestUnitsModel
delegate: Row {
spacing: Metrics.buttonHeight/2
anchors.right: parent.right
Text {
width: scrollViewTestUnits.width - parent.spacing
wrapMode: Text.Wrap
horizontalAlignment: Text.AlignLeft
font { family: PStyle.defaultFontFamily; bold: false; pixelSize: Metrics.ptToPx(unitsFont)}
text : Name + (Version == "" ? "" : "\n " + Version)
}
}
}
//Implemantatioin of ListViewWithScrollbar
// Test Units
ListViewWithScrollbar {
id: scrollViewTestUnits
width : root.width
height : root.height - columnMasterUnit.height - bNavigationTitleBar.height
anchors {
top : columnMasterUnit.bottom;
left: bNavigationTitleBar.left
}
onFlickingChanged: {
console.debug(visibleArea.heightRatio, visibleArea.yPosition)
}
model: mAboutTestUnitsModel
delegate: Row {
spacing: Metrics.buttonHeight/2
anchors.right: parent.right
Text {
width: scrollViewTestUnits.width - parent.spacing
wrapMode: Text.Wrap
horizontalAlignment: Text.AlignLeft
font { family: PStyle.defaultFontFamily; bold: false; pixelSize: Metrics.ptToPx(unitsFont)}
text : Name + (Version == "" ? "" : "\n " + Version)
}
}
}
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
Bookmarks