[vlc-commits] [Git][videolan/vlc][master] 4 commits: qml: allow center text in table delegates

Steve Lhomme (@robUx4) gitlab at videolan.org
Tue Jan 7 16:47:15 UTC 2025



Steve Lhomme pushed to branch master at VideoLAN / VLC


Commits:
cf268027 by Prince Gupta at 2025-01-07T16:32:04+00:00
qml: allow center text in table delegates

- - - - -
e5bd5dfc by Prince Gupta at 2025-01-07T16:32:04+00:00
qml: fix alignment in music albums table

use default delegates

- - - - -
07920d72 by Prince Gupta at 2025-01-07T16:32:04+00:00
qml: introduce title column delegates

- - - - -
a39444d4 by Prince Gupta at 2025-01-07T16:32:04+00:00
qml: support small screen config in Music Albums delegate

- - - - -


4 changed files:

- modules/gui/qt/medialibrary/qml/MusicAlbumsGridExpandDelegate.qml
- modules/gui/qt/widgets/qml/TableColumns.qml
- modules/gui/qt/widgets/qml/TableViewDelegate.qml
- modules/gui/qt/widgets/qml/TableViewExt.qml


Changes:

=====================================
modules/gui/qt/medialibrary/qml/MusicAlbumsGridExpandDelegate.qml
=====================================
@@ -364,52 +364,63 @@ FocusScope {
         MusicTrackListDisplay {
             id: tracks
 
-            headerColor: theme.bg.secondary
+            readonly property var _titleModel: [{
+                weight: 1,
 
-            fadingEdge.backgroundColor: headerColor
+                model: {
+                    criteria: "title",
 
-            property Component titleDelegate: Widgets.TableRowDelegate {
-                id: title
+                    visible: true,
 
-                RowLayout {
-                    anchors.fill: parent
+                    text: VLCStyle.isScreenSmall ? qsTr("Tracks") : qsTr("Title"),
 
-                    Widgets.ListLabel {
-                        text: title.rowModel?.track_number ?? ""
-                        color: theme.fg.primary
-                        font.weight: Font.Normal
+                    showSection: "",
 
-                        Layout.fillHeight: true
-                        Layout.leftMargin: VLCStyle.margin_xxsmall
-                        Layout.preferredWidth: VLCStyle.margin_large
-                    }
+                    subCriterias: ["track_number", "duration"],
 
-                    Widgets.ListLabel {
-                        text: title.rowModel?.title ?? ""
-                        color: theme.fg.primary
+                    colDelegate: tableColumns.titleTextDelegate,
+                    headerDelegate: tableColumns.titleTextHeaderDelegate
+                }
+            }]
 
-                        Layout.fillHeight: true
-                        Layout.fillWidth: true
-                    }
+            readonly property var _allModel: [
+            {
+                size: .2,
+
+                model: {
+                    criteria: "track_number",
+
+                    visible: true,
+
+                    text: qsTr("#"),
+
+                    showSection: "",
+
+                    hCenterText: true
                 }
-            }
+            },
+                ..._titleModel,
+            {
+                size: 1,
 
-            property Component titleHeaderDelegate: Widgets.TableHeaderDelegate {
-                id: headerDelegate
-                Row {
-                    anchors.fill: parent
-                    Widgets.CaptionLabel {
-                        text: "#"
-                        width: VLCStyle.margin_large
-                        color: headerDelegate.colorContext.fg.secondary
-                    }
+                model: {
+                    criteria: "duration",
 
-                    Widgets.CaptionLabel {
-                        text: qsTr("Title")
-                        color: headerDelegate.colorContext.fg.secondary
-                    }
+                    visible: true,
+
+                    text: qsTr("Duration"),
+
+                    showSection: "",
+
+                    colDelegate: tableColumns.timeColDelegate,
+                    headerDelegate: tableColumns.timeHeaderDelegate
                 }
-            }
+            }]
+
+
+            headerColor: theme.bg.secondary
+
+            fadingEdge.backgroundColor: headerColor
 
             header: Loader {
                 sourceComponent: VLCStyle.isScreenSmall
@@ -434,44 +445,19 @@ FocusScope {
                 currentIndex = 0
             }
 
-            sortModel: [{
-                weight: 1,
-
-                model: {
-                    criteria: "title",
-
-                    visible: true,
-
-                    text: qsTr("Title"),
-
-                    showSection: "",
-
-                    colDelegate: titleDelegate,
-                    headerDelegate: titleHeaderDelegate
-                }
-            }, {
-                size: 1,
-
-                model: {
-                    criteria: "duration",
-
-                    visible: true,
-
-                    text: qsTr("Duration"),
-
-                    showSection: "",
-
-                    colDelegate: tableColumns.timeColDelegate,
-                    headerDelegate: tableColumns.timeHeaderDelegate
-                }
-            }]
+            sortModel: VLCStyle.isScreenSmall
+                       ? _titleModel // use criterias text with small screens
+                       : _allModel
 
             Navigation.parentItem: root
             Navigation.leftItem: VLCStyle.isScreenSmall ? null : root.enqueueActionBtn
             Navigation.upItem: headerItem
 
+
             Widgets.MLTableColumns {
                 id: tableColumns
+
+                showCriterias: VLCStyle.isScreenSmall
             }
         }
     }


=====================================
modules/gui/qt/widgets/qml/TableColumns.qml
=====================================
@@ -45,6 +45,13 @@ Item {
         return []
     }
 
+    // function (rowModel, colModel) -> string
+    // implement this function for providing custom text for title column
+    property var _titleTextProvider: function (rowModel, colModel) {
+        const text = rowModel?.[colModel.criteria]
+        return text || qsTr("Unknown Title")
+    }
+
     // this is called in reponse to user request to play
     // model is associated row data of delegate
     signal playClicked(var model)
@@ -132,61 +139,14 @@ Item {
                 onPlayIconClicked: root.playClicked(titleDel.rowModel)
             }
 
-            Column {
+            TitleText {
                 Layout.fillHeight: true
                 Layout.fillWidth: true
 
                 Layout.topMargin: VLCStyle.margin_xxsmall
                 Layout.bottomMargin: VLCStyle.margin_xxsmall
 
-                Widgets.TextAutoScroller {
-                    id: textRect
-
-                    anchors.left: parent.left
-                    anchors.right: parent.right
-
-                    height: (root.showCriterias) ? Math.round(parent.height / 2)
-                                                 : parent.height
-
-                    visible: root.showTitleText
-                    enabled: visible
-
-                    clip: scrolling
-
-                    label: text
-
-                    forceScroll: titleDel.currentlyFocused
-
-                    Widgets.ListLabel {
-                        id: text
-
-                        anchors.verticalCenter: parent.verticalCenter
-                        text: (titleDel.rowModel && root.showTitleText)
-                              ? (titleDel.rowModel[titleDel.colModel.criteria] || qsTr("Unknown Title"))
-                              : ""
-
-                        color: titleDel.selected
-                            ? titleDel.colorContext.fg.highlight
-                            : titleDel.colorContext.fg.primary
-
-                    }
-                }
-
-                Widgets.MenuCaption {
-                    anchors.left: parent.left
-                    anchors.right: parent.right
-
-                    height: textRect.height
-
-                    visible: root.showCriterias
-                    enabled: visible
-
-                    text: (visible) ? root.getCriterias(titleDel.colModel, titleDel.rowModel) : ""
-
-                    color: titleDel.selected
-                        ? titleDel.colorContext.fg.highlight
-                        : titleDel.colorContext.fg.secondary
-                }
+                source: titleDel
             }
         }
     }
@@ -209,17 +169,12 @@ Item {
                 color: titleHeadDel.colorContext.fg.secondary
             }
 
-            Widgets.CaptionLabel {
-                horizontalAlignment: Text.AlignHCenter
-                verticalAlignment: Text.AlignVCenter
+            TitleHeaderText {
                 height: parent.height
 
                 color: titleHeadDel.colorContext.fg.secondary
 
                 text: titleHeadDel.colModel.text ?? ""
-                visible: root.showTitleText
-
-                Accessible.ignored: true
             }
         }
     }
@@ -240,6 +195,28 @@ Item {
         }
     }
 
+    property Component titleTextDelegate: TableRowDelegate {
+        id: titleTextdel
+
+        TitleText {
+            anchors.fill: parent
+
+            source: titleTextdel
+        }
+    }
+
+    property Component titleTextHeaderDelegate: TableHeaderDelegate {
+        id: titleHeaderTextDel
+
+        TitleHeaderText {
+            height: parent.height
+
+            color: titleHeaderTextDel.colorContext.fg.secondary
+
+            text: titleHeaderTextDel.colModel.text ?? ""
+        }
+    }
+
     property Component timeColDelegate: TableRowDelegate {
         id: timeDel
 
@@ -266,4 +243,66 @@ Item {
         text: "000h00"
     }
 
+    component TitleHeaderText: Widgets.CaptionLabel {
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+
+        visible: root.showTitleText
+
+        Accessible.ignored: true
+    }
+
+    component TitleText: Column {
+        required property var source
+
+        Widgets.TextAutoScroller {
+            id: textRect
+
+            anchors.left: parent.left
+            anchors.right: parent.right
+
+            height: (root.showCriterias) ? Math.round(parent.height / 2)
+                                         : parent.height
+
+            visible: root.showTitleText
+            enabled: visible
+
+            clip: scrolling
+
+            label: text
+
+            forceScroll: source.currentlyFocused
+
+            Widgets.ListLabel {
+                id: text
+
+                anchors.verticalCenter: parent.verticalCenter
+                text: (source.rowModel && root.showTitleText)
+                      ? root._titleTextProvider(source.rowModel, source.colModel)
+                      : ""
+
+                color: source.selected
+                    ? source.colorContext.fg.highlight
+                    : source.colorContext.fg.primary
+
+            }
+        }
+
+        Widgets.MenuCaption {
+            anchors.left: parent.left
+            anchors.right: parent.right
+
+            height: textRect.height
+
+            visible: root.showCriterias
+            enabled: visible
+
+            text: (visible) ? root.getCriterias(source.colModel, source.rowModel) : ""
+
+            color: source.selected
+                ? source.colorContext.fg.highlight
+                : source.colorContext.fg.secondary
+        }
+    }
+
 }


=====================================
modules/gui/qt/widgets/qml/TableViewDelegate.qml
=====================================
@@ -74,6 +74,11 @@ T.Control {
                 id: text
 
                 anchors.verticalCenter: parent.verticalCenter
+
+                width: parent.width
+
+                horizontalAlignment: defaultDelId.colModel.hCenterText ? Text.AlignHCenter : Text.AlignLeft
+
                 text: defaultDelId.rowModel[defaultDelId.colModel.criteria] ?? ""
 
                 color: defaultDelId.selected


=====================================
modules/gui/qt/widgets/qml/TableViewExt.qml
=====================================
@@ -35,7 +35,7 @@ FocusScope {
 
     property Component tableHeaderDelegate:  TableHeaderDelegate {
         Widgets.CaptionLabel {
-            horizontalAlignment: Text.AlignLeft
+            horizontalAlignment: colModel.hCenterText ? Text.AlignHCenter : Text.AlignLeft
             verticalAlignment: Text.AlignVCenter
 
             anchors.fill: parent



View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/9203fc06e9961a9d176b09fa785f6b0c177e3285...a39444d484b07fdd22b4583986fe3097854e3043

-- 
View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/9203fc06e9961a9d176b09fa785f6b0c177e3285...a39444d484b07fdd22b4583986fe3097854e3043
You're receiving this email because of your account on code.videolan.org.


VideoLAN code repository instance


More information about the vlc-commits mailing list