104 lines
2.3 KiB
QML
104 lines
2.3 KiB
QML
pragma ComponentBehavior: Bound
|
|
|
|
import QtQuick
|
|
import qs.Effects
|
|
|
|
CustomListView {
|
|
id: root
|
|
|
|
property real endFadeOpacity: fadeShouldBeActive(false) ? 0 : 1
|
|
property real fadeAmount: 0.1
|
|
property real fadeThreshold: 0.0
|
|
readonly property bool horizontal: orientation === ListView.Horizontal
|
|
property real startFadeOpacity: fadeShouldBeActive(true) ? 0 : 1
|
|
|
|
function contentSize(): real {
|
|
return horizontal ? contentWidth : contentHeight;
|
|
}
|
|
|
|
function fadeShouldBeActive(isStart: bool): bool {
|
|
// When content is smaller than flickable size, hide fade when rebound starts.
|
|
if (contentSize() + marginStart() + marginEnd() < viewportSize() && rebound.running && ((isStart ? overshootStart() > 0 : overshootStart() < 0))) {
|
|
return false;
|
|
}
|
|
|
|
if (isStart)
|
|
return visibleStart() > 0;
|
|
|
|
return visibleStart() + visibleRatio() < 1;
|
|
}
|
|
|
|
function marginEnd(): real {
|
|
return horizontal ? rightMargin - fadeThreshold : bottomMargin - fadeThreshold;
|
|
}
|
|
|
|
function marginStart(): real {
|
|
return horizontal ? leftMargin - fadeThreshold : topMargin - fadeThreshold;
|
|
}
|
|
|
|
function overshootStart(): real {
|
|
return horizontal ? horizontalOvershoot : verticalOvershoot;
|
|
}
|
|
|
|
function viewportSize(): real {
|
|
return horizontal ? width : height;
|
|
}
|
|
|
|
function visibleRatio(): real {
|
|
return horizontal ? visibleArea.widthRatio : visibleArea.heightRatio;
|
|
}
|
|
|
|
function visibleStart(): real {
|
|
return horizontal ? visibleArea.xPosition : visibleArea.yPosition;
|
|
}
|
|
|
|
flickableDirection: horizontal ? Flickable.HorizontalFlick : Flickable.VerticalFlick
|
|
layer.enabled: true
|
|
|
|
Behavior on endFadeOpacity {
|
|
Anim {
|
|
type: Anim.SlowEffects
|
|
}
|
|
}
|
|
layer.effect: Mask {
|
|
maskSource: mask
|
|
|
|
Rectangle {
|
|
id: mask
|
|
|
|
anchors.fill: parent
|
|
layer.enabled: true
|
|
visible: false
|
|
|
|
gradient: Gradient {
|
|
orientation: root.horizontal ? Gradient.Horizontal : Gradient.Vertical
|
|
|
|
GradientStop {
|
|
color: Qt.rgba(0, 0, 0, root.startFadeOpacity)
|
|
position: 0
|
|
}
|
|
|
|
GradientStop {
|
|
color: Qt.rgba(0, 0, 0, 1)
|
|
position: root.fadeAmount
|
|
}
|
|
|
|
GradientStop {
|
|
color: Qt.rgba(0, 0, 0, 1)
|
|
position: 1 - root.fadeAmount
|
|
}
|
|
|
|
GradientStop {
|
|
color: Qt.rgba(0, 0, 0, root.endFadeOpacity)
|
|
position: 1
|
|
}
|
|
}
|
|
}
|
|
}
|
|
Behavior on startFadeOpacity {
|
|
Anim {
|
|
type: Anim.SlowEffects
|
|
}
|
|
}
|
|
}
|