diff --git a/qml/component/AutoImage.qml b/qml/component/AutoImage.qml
new file mode 100644
index 0000000..75fbc61
--- /dev/null
+++ b/qml/component/AutoImage.qml
@@ -0,0 +1,34 @@
+import QtQuick 2.9
+import QtQuick.Controls 2.2
+
+Item {
+ property alias source: baseImage.source
+ property alias sourceSize: baseImage.sourceSize.width
+
+ readonly property bool loading: baseImage.status == Image.Loading
+ signal clicked()
+
+ id: rekt
+
+ width: loading ? 128 : baseImage.implicitWidth
+ height: loading ? progressBar.height : baseImage.implicitHeight
+
+ Image {
+ id: baseImage
+ }
+
+ ProgressBar {
+ id: progressBar
+ width: parent.width
+ visible: loading
+
+ indeterminate: true
+ }
+
+ MouseArea {
+ anchors.fill: parent
+ propagateComposedEvents: true
+
+ onClicked: rekt.clicked()
+ }
+}
diff --git a/qml/component/ImageBubble.qml b/qml/component/ImageBubble.qml
index fe473da..887b37e 100644
--- a/qml/component/ImageBubble.qml
+++ b/qml/component/ImageBubble.qml
@@ -9,8 +9,8 @@ AvatarContainer {
Rectangle {
id: messageRect
- width: messageImage.implicitWidth + 24
- height: messageImage.implicitHeight + 24
+ width: messageImage.width + 24
+ height: messageImage.height + 24
color: sentByMe ? background : Material.accent
@@ -21,17 +21,13 @@ AvatarContainer {
height: messageImage.height
anchors.centerIn: parent
- Image {
+ AutoImage {
id: messageImage
z: -4
- sourceSize.width: 128
+ sourceSize: 128
source: "image://mxc/" + (content.thumbnail_url ? content.thumbnail_url : content.url)
- MouseArea {
- anchors.fill: parent
- propagateComposedEvents: true
- onClicked: downloadAndOpen()
- }
+ onClicked: downloadAndOpen()
}
}
}
diff --git a/res.qrc b/res.qrc
index 5cafb40..3365c4d 100644
--- a/res.qrc
+++ b/res.qrc
@@ -31,5 +31,6 @@
qml/form/SettingGeneralForm.qml
qml/component/EmojiPicker.qml
qml/component/EmojiButton.qml
+ qml/component/AutoImage.qml