diff --git a/qml.qrc b/qml.qrc
index 71bf3277b79781cfa71869403fbf08717092adfc..135bfadb4030160a465330951e3ceda90801a9a8 100644
--- a/qml.qrc
+++ b/qml.qrc
@@ -168,5 +168,6 @@
<file>src/commoncomponents/SBSMessageBase.qml</file>
<file>src/commoncomponents/GeneratedMessageDelegate.qml</file>
<file>src/commoncomponents/DataTransferMessageDelegate.qml</file>
+ <file>src/mainview/components/ScrollToBottomButton.qml</file>
</qresource>
</RCC>
diff --git a/resources/icons/down_triangle_arrow_black_24dp.svg b/resources/icons/down_triangle_arrow_black_24dp.svg
new file mode 100644
index 0000000000000000000000000000000000000000..03720ccf554f2d0893d24cd08182005ab51f1b0b
--- /dev/null
+++ b/resources/icons/down_triangle_arrow_black_24dp.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"> <polygon stroke="#000000" points="0,0 12,24 24,0 "/> </svg>
\ No newline at end of file
diff --git a/src/constant/JamiStrings.qml b/src/constant/JamiStrings.qml
index f0c9e6796b95b03b84c110eef6ee49455ec81c30..cefd63286d038c2f91aaf955a57160838717a7c3 100644
--- a/src/constant/JamiStrings.qml
+++ b/src/constant/JamiStrings.qml
@@ -255,6 +255,9 @@ Item {
property string showPlugins: qsTr("Show available plugins")
property string addToConversations: qsTr("Add to conversations")
+ // Chatview footer
+ property string jumpToLatest: qsTr("Jump to latest")
+
// ConnectToAccountManager
property string enterJAMSURL: qsTr("Enter Jami Account Management Server (JAMS) URL")
property string required: qsTr("Required")
diff --git a/src/constant/JamiTheme.qml b/src/constant/JamiTheme.qml
index 6048a129c8bc6a1cbd3b3b8bd6c321a451996e90..0f2b081479bd81ffc8dfc0961179d2709dd7e942 100644
--- a/src/constant/JamiTheme.qml
+++ b/src/constant/JamiTheme.qml
@@ -282,6 +282,7 @@ Item {
property real chatViewFooterButtonRadius: 5
property real chatViewFooterFileContainerPreferredHeight: 150
property real chatViewFooterTextAreaMaximumHeight: 130
+ property real chatViewScrollToBottomButtonBottomMargin: 8
// MessageWebView File Transfer Container
property real filesToSendContainerSpacing: 5
diff --git a/src/mainview/components/MessageListView.qml b/src/mainview/components/MessageListView.qml
index a320174b71cef32b9f94d61b03942d08ffd5b67b..cd7ff3c3e07da8d06a845b1604a79aba1cd11a75 100644
--- a/src/mainview/components/MessageListView.qml
+++ b/src/mainview/components/MessageListView.qml
@@ -261,4 +261,16 @@ ListView {
}
}
}
+
+ ScrollToBottomButton {
+ id: scrollToBottomButton
+
+ anchors.bottom: root.bottom
+ anchors.bottomMargin: JamiTheme.chatViewScrollToBottomButtonBottomMargin
+ anchors.horizontalCenter: root.horizontalCenter
+
+ activeStateTrigger: Math.abs(root.contentY) > root.height * 2
+ onClicked: root.ScrollBar.vertical.position =
+ 1.0 - root.ScrollBar.vertical.size
+ }
}
diff --git a/src/mainview/components/ScrollToBottomButton.qml b/src/mainview/components/ScrollToBottomButton.qml
new file mode 100644
index 0000000000000000000000000000000000000000..cb9b10892fc04f1e49c2a9e9028bb1efd0c9a4b1
--- /dev/null
+++ b/src/mainview/components/ScrollToBottomButton.qml
@@ -0,0 +1,130 @@
+/*
+ * Copyright (C) 2020 by Savoir-faire Linux
+ * Author: Mingrui Zhang <mingrui.zhang@savoirfairelinux.com>
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtGraphicalEffects 1.15
+
+import net.jami.Constants 1.1
+
+import "../../commoncomponents"
+
+Control {
+ id: root
+
+ property alias activeStateTrigger: activeState.when
+
+ signal clicked
+
+ height: jumpToLatestText.contentHeight + 15
+ width: jumpToLatestText.contentWidth + arrowDropDown.width + 50
+
+ opacity: 0
+
+ states: State {
+ id: activeState
+
+ name: "active"
+ PropertyChanges {
+ target: root
+ opacity: 1
+ }
+ }
+
+ transitions: [
+ Transition {
+ to: "active"
+ NumberAnimation {
+ target: root
+ duration: JamiTheme.shortFadeDuration
+ property: "opacity"
+ }
+ },
+ Transition {
+ from: "active"
+ NumberAnimation {
+ target: root
+ duration: JamiTheme.shortFadeDuration
+ property: "opacity"
+ to: 0.0
+ }
+ }
+ ]
+
+ contentItem: Item {
+ Item {
+ anchors.centerIn: parent
+
+ height: jumpToLatestText.contentHeight
+ width: jumpToLatestText.contentWidth + arrowDropDown.width + 3
+
+ Text {
+ id: jumpToLatestText
+
+ anchors.left: parent.left
+ anchors.verticalCenter: parent.verticalCenter
+
+ font.weight: Font.DemiBold
+ font.pointSize: JamiTheme.textFontSize + 2
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+
+ text: JamiStrings.jumpToLatest
+ color: JamiTheme.whiteColor
+ }
+
+ ResponsiveImage {
+ id: arrowDropDown
+
+ anchors.left: jumpToLatestText.right
+ anchors.leftMargin: 3
+ anchors.verticalCenter: parent.verticalCenter
+ anchors.verticalCenterOffset: 2
+
+ containerWidth: 12
+ containerHeight: 12
+
+ color: JamiTheme.whiteColor
+ source: JamiResources.down_triangle_arrow_black_24dp_svg
+ }
+ }
+ }
+
+ background: Rectangle {
+ radius: 20
+ color: JamiTheme.jamiDarkBlue
+
+ MouseArea {
+ anchors.fill: parent
+ cursorShape: Qt.PointingHandCursor
+
+ onClicked: root.clicked()
+ }
+
+ layer {
+ enabled: true
+ effect: DropShadow {
+ horizontalOffset: 3.0
+ verticalOffset: 3.0
+ radius: 8.0
+ samples: 16
+ color: JamiTheme.shadowColor
+ }
+ }
+ }
+}