Implement basic ImageMessages in qml timeline
I suck at sizing so the images in the message are currently hardcoded to
300 pixels in width...
3 files changed, 20 insertions, 1 deletions
diff --git a/resources/qml/TimelineView.qml b/resources/qml/TimelineView.qml
index 0151686a..399e85eb 100644
--- a/resources/qml/TimelineView.qml
+++ b/resources/qml/TimelineView.qml
@@ -23,6 +23,8 @@ Rectangle {
ListView {
id: chat
+ cacheBuffer: 4*parent.height
+
visible: timelineManager.timeline != null
anchors.fill: parent
@@ -40,12 +42,14 @@ Rectangle {
anchors.left: parent.left
anchors.right: parent.right
anchors.rightMargin: scrollbar.width
+ height: loader.height
Loader {
id: loader
+ asynchronous: false
Layout.fillWidth: true
- height: item.height
Layout.alignment: Qt.AlignTop
+ height: item.height
source: switch(model.type) {
case MtxEvent.Aliases: return "delegates/Aliases.qml"
diff --git a/resources/qml/delegates/ImageMessage.qml b/resources/qml/delegates/ImageMessage.qml
new file mode 100644
index 00000000..a3bc78e5
--- /dev/null
+++ b/resources/qml/delegates/ImageMessage.qml
@@ -0,0 +1,14 @@
+import QtQuick 2.6
+
+Item {
+ width: 300
+ height: 300 * eventData.proportionalHeight
+
+ Image {
+ anchors.fill: parent
+
+ source: eventData.url.replace("mxc://", "image://MxcImage/")
+ asynchronous: true
+ fillMode: Image.PreserveAspectFit
+ }
+}
diff --git a/resources/res.qrc b/resources/res.qrc
index 6f6d480a..62ed53e5 100644
--- a/resources/res.qrc
+++ b/resources/res.qrc
@@ -119,5 +119,6 @@
<file>qml/Avatar.qml</file>
<file>qml/delegates/TextMessage.qml</file>
<file>qml/delegates/NoticeMessage.qml</file>
+ <file>qml/delegates/ImageMessage.qml</file>
</qresource>
</RCC>
|