feat: fade out nexus nav list
This commit is contained in:
parent
d6d53ed7bc
commit
328c4ba37d
2 changed files with 54 additions and 0 deletions
|
|
@ -19,6 +19,8 @@ ColumnLayout {
|
|||
NavLocations {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
Layout.topMargin: -topMargin
|
||||
Layout.bottomMargin: -bottomMargin
|
||||
nState: root.nState
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ import QtQuick.Layouts
|
|||
import Caelestia.Config
|
||||
import qs.components
|
||||
import qs.components.containers
|
||||
import qs.components.effects
|
||||
import qs.services
|
||||
import qs.modules.nexus
|
||||
|
||||
|
|
@ -13,8 +14,59 @@ StyledFlickable {
|
|||
|
||||
required property NexusState nState
|
||||
|
||||
property real topFadeOpacity: visibleArea.yPosition > 0 ? 0 : 1
|
||||
property real bottomFadeOpacity: visibleArea.yPosition + visibleArea.heightRatio < 1 ? 0 : 1
|
||||
|
||||
topMargin: Tokens.padding.large
|
||||
bottomMargin: Tokens.padding.large
|
||||
contentHeight: content.implicitHeight
|
||||
|
||||
layer.enabled: true
|
||||
layer.effect: Mask {
|
||||
maskSource: mask
|
||||
|
||||
Rectangle {
|
||||
id: mask
|
||||
|
||||
anchors.fill: parent
|
||||
visible: false
|
||||
layer.enabled: true
|
||||
|
||||
gradient: Gradient {
|
||||
orientation: Gradient.Vertical
|
||||
|
||||
GradientStop {
|
||||
position: 0
|
||||
color: Qt.rgba(0, 0, 0, root.topFadeOpacity)
|
||||
}
|
||||
GradientStop {
|
||||
position: 0.3
|
||||
color: Qt.rgba(0, 0, 0, 1)
|
||||
}
|
||||
GradientStop {
|
||||
position: 0.7
|
||||
color: Qt.rgba(0, 0, 0, 1)
|
||||
}
|
||||
GradientStop {
|
||||
position: 1
|
||||
color: Qt.rgba(0, 0, 0, root.bottomFadeOpacity)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Behavior on topFadeOpacity {
|
||||
Anim {
|
||||
type: Anim.SlowEffects
|
||||
}
|
||||
}
|
||||
|
||||
Behavior on bottomFadeOpacity {
|
||||
Anim {
|
||||
type: Anim.SlowEffects
|
||||
}
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
id: content
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue