Use OpacityRamp to hint at scrollable attachmentsOptions
This commit is contained in:
parent
2b634471dc
commit
81ffb53062
1 changed files with 15 additions and 4 deletions
|
@ -1174,7 +1174,6 @@ Page {
|
||||||
spacing: Theme.paddingSmall
|
spacing: Theme.paddingSmall
|
||||||
topPadding: Theme.paddingSmall
|
topPadding: Theme.paddingSmall
|
||||||
anchors.horizontalCenter: parent.horizontalCenter
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
clip: true
|
|
||||||
visible: height > 0
|
visible: height > 0
|
||||||
width: parent.width - ( 2 * Theme.horizontalPageMargin )
|
width: parent.width - ( 2 * Theme.horizontalPageMargin )
|
||||||
height: isNeeded ? implicitHeight : 0
|
height: isNeeded ? implicitHeight : 0
|
||||||
|
@ -1210,13 +1209,23 @@ Page {
|
||||||
id: attachmentOptionsFlickable
|
id: attachmentOptionsFlickable
|
||||||
|
|
||||||
property bool isNeeded: false
|
property bool isNeeded: false
|
||||||
width: parent.width
|
width: chatPage.width
|
||||||
|
x: -Theme.horizontalPageMargin
|
||||||
height: isNeeded ? attachmentOptionsRow.height : 0
|
height: isNeeded ? attachmentOptionsRow.height : 0
|
||||||
Behavior on height { SmoothedAnimation { duration: 200 } }
|
Behavior on height { SmoothedAnimation { duration: 200 } }
|
||||||
visible: height > 0
|
visible: height > 0
|
||||||
contentHeight: attachmentOptionsRow.height
|
contentHeight: attachmentOptionsRow.height
|
||||||
contentWidth: Math.max(parent.width, attachmentOptionsRow.width)
|
contentWidth: Math.max(width, attachmentOptionsRow.width)
|
||||||
clip: true
|
property bool fadeRight: (attachmentOptionsRow.width-contentX) > width
|
||||||
|
property bool fadeLeft: !fadeRight && contentX > 0
|
||||||
|
layer.enabled: fadeRight || fadeLeft
|
||||||
|
layer.effect: OpacityRampEffectBase {
|
||||||
|
direction: attachmentOptionsFlickable.fadeRight ? OpacityRamp.LeftToRight : OpacityRamp.RightToLeft
|
||||||
|
source: attachmentOptionsFlickable
|
||||||
|
slope: 1 + 6 * (chatPage.width) / Screen.width
|
||||||
|
offset: 1 - 1 / slope
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
Row {
|
Row {
|
||||||
id: attachmentOptionsRow
|
id: attachmentOptionsRow
|
||||||
|
@ -1226,6 +1235,8 @@ Page {
|
||||||
anchors.right: parent.right
|
anchors.right: parent.right
|
||||||
layoutDirection: Qt.RightToLeft
|
layoutDirection: Qt.RightToLeft
|
||||||
spacing: Theme.paddingMedium
|
spacing: Theme.paddingMedium
|
||||||
|
leftPadding: Theme.horizontalPageMargin
|
||||||
|
rightPadding: Theme.horizontalPageMargin
|
||||||
|
|
||||||
IconButton {
|
IconButton {
|
||||||
id: attachImageIconButton
|
id: attachImageIconButton
|
||||||
|
|
Loading…
Reference in a new issue