[vlc-commits] qml: use the same layout as the Album detail view for the Video detail view

Pierre Lamot git at videolan.org
Fri Jan 10 15:06:47 CET 2020


vlc | branch: master | Pierre Lamot <pierre at videolabs.io> | Thu Dec 19 15:26:36 2019 +0100| [649b550cfe21051debfac30e0a88f66bf46db2e5] | committer: Jean-Baptiste Kempf

qml: use the same layout as the Album detail view for the Video detail view

Signed-off-by: Jean-Baptiste Kempf <jb at videolan.org>

> http://git.videolan.org/gitweb.cgi/vlc.git/?a=commit;h=649b550cfe21051debfac30e0a88f66bf46db2e5
---

 .../qt/medialibrary/qml/VideoInfoExpandPanel.qml   | 303 +++++++++------------
 1 file changed, 130 insertions(+), 173 deletions(-)

diff --git a/modules/gui/qt/medialibrary/qml/VideoInfoExpandPanel.qml b/modules/gui/qt/medialibrary/qml/VideoInfoExpandPanel.qml
index e76f610064..845662edec 100644
--- a/modules/gui/qt/medialibrary/qml/VideoInfoExpandPanel.qml
+++ b/modules/gui/qt/medialibrary/qml/VideoInfoExpandPanel.qml
@@ -23,6 +23,7 @@ import QtQuick.Layouts 1.3
 import org.videolan.medialib 0.1
 
 import "qrc:///widgets/" as Widgets
+import "qrc:///util/KeyHelper.js" as KeyHelper
 import "qrc:///style/"
 
 Widgets.NavigableFocusScope {
@@ -60,217 +61,173 @@ Widgets.NavigableFocusScope {
 
     Rectangle{
         id: contentRect
-        height: implicitHeight
+        //height: implicitHeight
         implicitHeight: contentLayout.implicitHeight + VLCStyle.margin_xsmall * 2
         width: parent.width
+
+        anchors {
+            bottom: parent.bottom
+            right: parent.right
+            left: parent.left
+            top: arrowRect.bottom
+        }
+        //height: parent.height - arrowRect.height
+
         clip: true
         color: VLCStyle.colors.bgAlt
 
         RowLayout {
             id: contentLayout
-            anchors {
-                fill: parent
-                topMargin: VLCStyle.margin_xsmall
-                bottomMargin: VLCStyle.margin_xsmall
-                leftMargin: VLCStyle.margin_normal
-            }
-
-            spacing: VLCStyle.margin_small
+            spacing: VLCStyle.margin_xsmall
 
-            Image {
-                id: img
-                Layout.alignment: Qt.AlignCenter
-                Layout.preferredWidth: width
-                Layout.preferredHeight: height
+            anchors.margins: VLCStyle.margin_small
 
-                width: VLCStyle.cover_xlarge
-                height: VLCStyle.cover_xlarge
-                fillMode:Image.PreserveAspectFit
+            implicitHeight: artAndControl.implicitHeight
 
-                source: model.thumbnail || VLCStyle.noArtCover
-            }
+            anchors.fill: parent
 
-            Column{
-                id: infoCol
-                height: childrenRect.height
-                width: Math.min(title.implicitWidth, 200*VLCStyle.scale)
-
-                Layout.alignment: Qt.AlignCenter
-                Layout.preferredWidth: width
-                Layout.preferredHeight: height
-
-                spacing: VLCStyle.margin_small
-                Text{
-                    id: newtxt
-                    font.pixelSize: VLCStyle.fontSize_normal
-                    font.weight: Font.ExtraBold
-                    text: "NEW"
-                    color: VLCStyle.colors.accent
-                    visible: model.playcount < 1
-                }
-                Text{
-                    id: title
-                    wrapMode: Text.Wrap
-                    font.pixelSize: VLCStyle.fontSize_xlarge
-                    font.weight: Font.ExtraBold
-                    text: model.title || ""
-                    color: VLCStyle.colors.text
-                    width: parent.width
-                }
-                Text {
-                    id: time
-                    text: model.duration || ""
-                    color: VLCStyle.colors.textInactive
-                    font.pixelSize: VLCStyle.fontSize_small
-                }
-            }
+            FocusScope {
+                id: artAndControl
 
+                focus: true
 
-            Widgets.NavigableFocusScope {
-                id: infoPanel
+                implicitHeight: artAndControlLayout.implicitHeight
+                implicitWidth: artAndControlLayout.implicitWidth
 
-                Layout.fillHeight: true
-                Layout.fillWidth: true
+                Layout.preferredWidth: implicitWidth
+                Layout.preferredHeight: implicitHeight
+                Layout.alignment: Qt.AlignTop
 
-                ScrollView {
-                    id: infoPannelScrollView
-                    contentHeight: infoInnerCol.height
-
-                    anchors.fill: parent
-
-                    focus: true
-                    clip: true
-
-                    ListView {
-                        id: infoInnerCol
-                        spacing: VLCStyle.margin_xsmall
-                        model: [
-                            {text: i18n.qtr("File Name"),    data: expandRect.model.title, bold: true},
-                            {text: i18n.qtr("Path"),         data: expandRect.model.mrl},
-                            {text: i18n.qtr("Length"),       data: expandRect.model.duration},
-                            {text: i18n.qtr("File size"),    data: ""},
-                            {text: i18n.qtr("Times played"), data: expandRect.model.playcount},
-                            {text: i18n.qtr("Video track"),  data: expandRect.model.videoDesc},
-                            {text: i18n.qtr("Audio track"),  data: expandRect.model.audioDesc},
-                        ]
-                        delegate: Label {
-                            font.bold: Boolean(modelData.bold)
-                            font.pixelSize: VLCStyle.fontSize_normal
-                            text: modelData.text + ": " + modelData.data
-                            color: VLCStyle.colors.text
-                            width: parent.width
-                            wrapMode: Label.Wrap
-                        }
-                    }
-                    Keys.priority: Keys.BeforeItem
-                    Keys.onPressed: {
-                        if (event.key !== Qt.Key_Up && event.key !== Qt.Key_Down) {
-                            infoPanel.defaultKeyAction(event, 0)
-                        }
-                    }
-                }
+                Column {
+                    id: artAndControlLayout
+                    anchors.margins: VLCStyle.margin_small
+                    spacing: VLCStyle.margin_small
 
-                Rectangle {
-                    z: 2
-                    anchors.fill: parent
-                    border.width: 1
-                    border.color: VLCStyle.colors.accent
-                    color: "transparent"
-                    visible: infoPanel.activeFocus
-                }
+                    /* A bigger cover for the album */
+                    Image {
+                        id: expand_cover_id
 
-                Rectangle {
-                    anchors { top: parent.top; left: parent.left;  right: parent.right }
-                    z: 1
-                    visible: !infoPannelScrollView.contentItem.atYBeginning
-                    height: parent.height * 0.2
-                    gradient: Gradient{
-                        GradientStop { position: 0.0; color: VLCStyle.colors.bgAlt }
-                        GradientStop { position: 1.0; color: "transparent" }
+                        height: VLCStyle.video_large_height
+                        width: VLCStyle.video_large_width
+                        source: model.thumbnail || VLCStyle.noArtCover
+                        sourceSize: Qt.size(width, height)
+                        fillMode: Image.PreserveAspectFit
                     }
-                }
 
-                Rectangle {
-                    anchors { bottom: parent.bottom; left: parent.left;  right: parent.right }
-                    z: 1
-                    visible: !infoPannelScrollView.contentItem.atYEnd
-                    height: parent.height * 0.2
-                    gradient: Gradient{
-                        GradientStop { position: 0.0; color: "transparent" }
-                        GradientStop { position: 1.0; color: VLCStyle.colors.bgAlt }
-                    }
-                }
+                    Widgets.NavigableCol {
+                        id: actionButtons
 
-                navigationParent: expandRect
-                navigationRightItem: actionButtons
-            }
+                        focus: true
 
-            Rectangle {
-                width: 1
-                Layout.fillHeight: true
-                Layout.preferredWidth: 1
-                gradient: Gradient {
-                    GradientStop { position: 0.0; color: "transparent" }
-                    GradientStop { position: 0.25; color: VLCStyle.colors.buttonBorder }
-                    GradientStop { position: 0.75; color: VLCStyle.colors.buttonBorder }
-                    GradientStop { position: 1.0; color: "transparent" }
-                }
+                        width: expand_cover_id.width
 
-            }
+                        model: ObjectModel {
+                            Widgets.TabButtonExt {
+                                id: playActionBtn
 
-            Widgets.NavigableCol {
-                id: actionButtons
+                                width: actionButtons.width
 
-                focus: true
+                                iconTxt: VLCIcons.play
+                                text: i18n.qtr("Play")
+                                onClicked: medialib.addAndPlay( model.id )
+                            }
 
-                Layout.alignment: Qt.AlignCenter
-                Layout.preferredWidth: childrenRect.width
+                            Widgets.TabButtonExt {
+                                id: enqueueActionBtn
 
-                model: ObjectModel {
-                    Widgets.TabButtonExt {
-                        id: playActionBtn
-                        iconTxt: VLCIcons.play
-                        text: i18n.qtr("Play")
-                        onClicked: medialib.addAndPlay( expandRect.model.id )
-                    }
+                                width: actionButtons.width
 
-                    Widgets.TabButtonExt {
-                        id: enqueueActionBtn
-                        iconTxt: VLCIcons.add
-                        text: i18n.qtr("Enqueue")
-                        onClicked: medialib.addToPlaylist( expandRect.model.id )
+                                iconTxt: VLCIcons.add
+                                text: i18n.qtr("Enqueue")
+                                onClicked: medialib.addToPlaylist( model.id )
+                            }
+                        }
+
+                        navigationParent: expandRect
+                        navigationRightItem: infoPannelScrollView
                     }
                 }
-
-                navigationParent: expandRect
-                navigationLeftItem: infoPanel
-                navigationRightItem: closeButton
             }
 
 
-            Widgets.NavigableFocusScope {
-                id: closeButton
+            ColumnLayout {
+                id: expand_infos_id
 
-                Layout.alignment: Qt.AlignTop | Qt.AlignVCenter
-                Layout.preferredWidth: closeButtonId.size
-                Layout.preferredHeight: closeButtonId.size
+                Layout.fillWidth: true
+                Layout.fillHeight: true
+
+                spacing: VLCStyle.margin_xsmall
 
-                Widgets.IconToolButton {
-                    id: closeButtonId
+                Text {
+                    id: expand_infos_title_id
 
-                    size: VLCStyle.icon_normal
-                    iconText: VLCIcons.close
-                    text: i18n.qtr("Close")
-                    color: VLCStyle.colors.lightText
+                    Layout.preferredHeight: implicitHeight
+                    Layout.fillWidth: true
 
-                    focus: true
-                    onClicked: expandRect.retract()
+                    text: model.title || i18n.qtr("Unknown title")
+                    font.pixelSize: VLCStyle.fontSize_xxlarge
+                    font.bold: true
+                    color: VLCStyle.colors.text
                 }
 
-                Keys.priority: Keys.AfterItem
-                Keys.onPressed: defaultKeyAction(event, 0)
-                navigationParent: expandRect
-                navigationLeftItem: actionButtons
+                Widgets.NavigableFocusScope {
+                    id: infoPanel
+
+                    Layout.fillHeight: true
+                    Layout.fillWidth: true
+
+                    navigationParent: expandRect
+                    navigationLeftItem: actionButtons
+
+                    ScrollView {
+                        id: infoPannelScrollView
+
+                        contentHeight: infoInnerCol.height
+
+                        anchors.fill: parent
+                        anchors.margins: VLCStyle.margin_xxsmall
+
+                        focus: true
+                        clip: true
+
+                        ListView {
+                            id: infoInnerCol
+                            spacing: VLCStyle.margin_xsmall
+                            model: [
+                                {text: i18n.qtr("File Name"),    data: expandRect.model.title, bold: true},
+                                {text: i18n.qtr("Path"),         data: expandRect.model.mrl},
+                                {text: i18n.qtr("Length"),       data: expandRect.model.duration},
+                                {text: i18n.qtr("File size"),    data: ""},
+                                {text: i18n.qtr("Times played"), data: expandRect.model.playcount},
+                                {text: i18n.qtr("Video track"),  data: expandRect.model.videoDesc},
+                                {text: i18n.qtr("Audio track"),  data: expandRect.model.audioDesc},
+                            ]
+                            delegate: Label {
+                                font.bold: Boolean(modelData.bold)
+                                font.pixelSize: VLCStyle.fontSize_normal
+                                text: modelData.text + ": " + modelData.data
+                                color: VLCStyle.colors.text
+                                width: parent.width
+                                wrapMode: Label.Wrap
+                            }
+                        }
+                        Keys.priority: Keys.BeforeItem
+                        Keys.onPressed: {
+                            if ( !KeyHelper.matchUp(event) && !KeyHelper.matchDown(event) ) {
+                                infoPanel.defaultKeyAction(event, 0)
+                            }
+                        }
+                    }
+
+                    Rectangle {
+                        z: 2
+                        anchors.fill: parent
+                        border.width: 2 * VLCStyle.scale
+                        border.color: VLCStyle.colors.accent
+                        color: "transparent"
+                        visible: infoPanel.activeFocus
+                    }
+                }
             }
         }
     }



More information about the vlc-commits mailing list