diff --git a/app/qml/components/MMMorePhoto.qml b/app/qml/components/MMMorePhoto.qml index a8fd4aede..5a1a08fe6 100644 --- a/app/qml/components/MMMorePhoto.qml +++ b/app/qml/components/MMMorePhoto.qml @@ -10,13 +10,12 @@ import QtQuick import QtQuick.Controls import Qt5Compat.GraphicalEffects -import "." Row { id: control + required property url photoUrl property int hiddenPhotoCount: 0 - property alias source: image.source property int space: 0 signal clicked() @@ -29,6 +28,8 @@ Row { width: control.width - control.space height: width + + source: control.photoUrl asynchronous: true layer.enabled: true layer { @@ -55,6 +56,7 @@ Row { anchors.centerIn: parent width: image.width height: parent.height + radius: 20 * __dp color: __style.transparentColor border.color: __style.forestColor @@ -66,6 +68,7 @@ Row { anchors.fill: parent source: image.source + asynchronous: true layer.enabled: true diff --git a/app/qml/components/MMPhoto.qml b/app/qml/components/MMPhoto.qml index d97dd49c4..6fd3eb873 100644 --- a/app/qml/components/MMPhoto.qml +++ b/app/qml/components/MMPhoto.qml @@ -15,10 +15,12 @@ import "." Image { id: control + property url photoUrl + signal clicked( var path ) height: width - source: model.modelData + source: control.photoUrl asynchronous: true layer.enabled: true layer { @@ -38,7 +40,7 @@ Image { MouseArea { anchors.fill: parent - onClicked: control.clicked(model.modelData) + onClicked: control.clicked(control.photoUrl) } Rectangle { @@ -53,7 +55,7 @@ Image { onStatusChanged: { if (status === Image.Error) { - console.error("MMPhoto: Error loading image: " + model.modelData); + console.error("MMPhoto: Error loading image: " + control.photoUrl); } } } diff --git a/app/qml/components/MMPhotoGallery.qml b/app/qml/components/MMPhotoGallery.qml index c39e3446d..b0de689cd 100644 --- a/app/qml/components/MMPhotoGallery.qml +++ b/app/qml/components/MMPhotoGallery.qml @@ -9,7 +9,6 @@ import QtQuick import QtQuick.Controls -import "." Item { id: control @@ -38,18 +37,20 @@ Item { height: 15 * __dp Text { + width: column.width - showAllButton.width - 10 * __dp + text: control.title font: __style.p6 elide: Text.ElideRight - width: column.width - showAllButton.width - 10 * __dp color: __style.nightColor } Text { id: showAllButton - text: qsTr("Show all") anchors.right: parent.right + + text: qsTr("Show all") font: __style.t4 color: __style.forestColor @@ -63,28 +64,34 @@ Item { ListView { id: rowView + height: 120 * __dp + width: parent.width + spacing: control.maxVisiblePhotos !== 0 ? 20 * __dp : 0 + orientation: ListView.Horizontal + model: { if(control.maxVisiblePhotos >= 0 && control.model.length > control.maxVisiblePhotos) { return control.model.slice(0, control.maxVisiblePhotos) } return control.model } - spacing: control.maxVisiblePhotos !== 0 ? 20 * __dp : 0 - orientation: ListView.Horizontal - height: 120 * __dp - width: parent.width delegate: MMPhoto { width: rowView.height + + photoUrl: model.modelData + onClicked: function(path) { control.clicked(path) } } footer: MMMorePhoto { + width: visible ? rowView.height + rowView.spacing: 0 + hiddenPhotoCount: control.model.length - control.maxVisiblePhotos visible: control.maxVisiblePhotos >= 0 && control.model.length > control.maxVisiblePhotos - source: visible ? model[control.maxVisiblePhotos] : "" - width: visible ? rowView.height + rowView.spacing: 0 + photoUrl: visible ? model[control.maxVisiblePhotos] : "" space: visible ? rowView.spacing : 0 + onClicked: control.showAll() } } @@ -103,10 +110,11 @@ Item { } Text { + width: column.width - msgRow.spacing - msgIcon.width + text: errorMsg.length > 0 ? errorMsg : warningMsg font: __style.t4 wrapMode: Text.WordWrap - width: column.width - msgRow.spacing - msgIcon.width visible: errorMsg.length > 0 || warningMsg.length > 0 } }