[vlc-devel] [PATCH 9/9] qml: show covers for album tracks

jagannatharjun guptaprince8832 at gmail.com
Tue Jun 2 17:17:33 CEST 2020


---
 .../qml/MusicTrackListDisplay.qml             | 45 +++++++++++++++++--
 1 file changed, 41 insertions(+), 4 deletions(-)

diff --git a/modules/gui/qt/medialibrary/qml/MusicTrackListDisplay.qml b/modules/gui/qt/medialibrary/qml/MusicTrackListDisplay.qml
index 32c1e3a6f0..4a28aa7bc2 100644
--- a/modules/gui/qt/medialibrary/qml/MusicTrackListDisplay.qml
+++ b/modules/gui/qt/medialibrary/qml/MusicTrackListDisplay.qml
@@ -29,29 +29,66 @@ Widgets.KeyNavigableTableView {
     id: root
 
     property var sortModelSmall: [
-        { isPrimary: true, criteria: "title",       width: VLCStyle.colWidth(1), text: i18n.qtr("Title"),    showSection: "title" },
+        { isPrimary: true, criteria: "title",       width: VLCStyle.colWidth(1), text: i18n.qtr("Title"),    showSection: "title", colDelegate: titleDelegate, headerDelegate: titleHeaderDelegate },
         { criteria: "album_title", width: VLCStyle.colWidth(1), text: i18n.qtr("Album"),    showSection: "album_title" },
         { criteria: "main_artist", width: VLCStyle.colWidth(1), text: i18n.qtr("Artist"),   showSection: "main_artist" },
         { criteria: "duration",    width: VLCStyle.colWidth(1), text: i18n.qtr("Duration"), showSection: "" },
     ]
 
     property var sortModelMedium: [
-        { isPrimary: true, criteria: "title",       width: VLCStyle.colWidth(2), text: i18n.qtr("Title"),    showSection: "title" },
+        { isPrimary: true, criteria: "title",       width: VLCStyle.colWidth(2), text: i18n.qtr("Title"),    showSection: "title", colDelegate: titleDelegate, headerDelegate: titleHeaderDelegate },
         { criteria: "album_title", width: VLCStyle.colWidth(2), text: i18n.qtr("Album"),    showSection: "album_title" },
         { criteria: "main_artist", width: VLCStyle.colWidth(1), text: i18n.qtr("Artist"),   showSection: "main_artist" },
         { criteria: "duration",    width: VLCStyle.colWidth(1), text: i18n.qtr("Duration"), showSection: "" },
     ]
 
     property var sortModelLarge: [
-        { isPrimary: true, criteria: "title",       width: VLCStyle.colWidth(2), text: i18n.qtr("Title"),    showSection: "title" },
+        { isPrimary: true, criteria: "title",       width: VLCStyle.colWidth(2), text: i18n.qtr("Title"),    showSection: "title", colDelegate: titleDelegate, headerDelegate: titleHeaderDelegate },
         { criteria: "album_title", width: VLCStyle.colWidth(2), text: i18n.qtr("Album"),    showSection: "album_title" },
         { criteria: "main_artist", width: VLCStyle.colWidth(2), text: i18n.qtr("Artist"),   showSection: "main_artist" },
         { criteria: "duration",    width: VLCStyle.colWidth(1), text: i18n.qtr("Duration"), showSection: "" },
         { criteria: "track_number",width: VLCStyle.colWidth(1), text: i18n.qtr("Track"), showSection: "" },
         { criteria: "disc_number", width: VLCStyle.colWidth(1), text: i18n.qtr("Disc"),  showSection: "" },
-
     ]
 
+    property Component titleDelegate: RowLayout {
+        property var rowModel: parent.rowModel
+        property var model: parent.colModel
+
+        anchors.fill: parent
+        spacing: VLCStyle.margin_normal
+
+        Image {
+            source: !rowModel ? VLCStyle.noArtCover : (rowModel.cover || VLCStyle.noArtCover)
+            mipmap: true // this widget can down scale the source a lot, so for better visuals we use mipmap
+
+            Layout.preferredHeight: VLCStyle.heightAlbumCover_xsmall
+            Layout.preferredWidth: VLCStyle.heightAlbumCover_xsmall
+        }
+
+        Widgets.ListLabel {
+            text: !rowModel ? "" : (rowModel[model.criteria] || "")
+
+            Layout.fillHeight: true
+            Layout.fillWidth: true
+        }
+    }
+
+    property Component titleHeaderDelegate: Row {
+        spacing: VLCStyle.margin_normal
+
+        Widgets.IconLabel {
+            width: VLCStyle.heightAlbumCover_xsmall
+            horizontalAlignment: Text.AlignHCenter
+            text: VLCIcons.album_cover
+            color: VLCStyle.colors.caption
+        }
+
+        Widgets.CaptionLabel {
+            text: model.text || ""
+        }
+    }
+
     sortModel: ( width < VLCStyle.colWidth(6) ) ? sortModelSmall
                                                 : ( width < VLCStyle.colWidth(9) ) ? sortModelMedium : sortModelLarge
     section.property: "title_first_symbol"
-- 
2.25.1



More information about the vlc-devel mailing list