[vlc-devel] [PATCH 02/25] qml: break main layout of Player widget
Prince Gupta
guptaprince8832 at gmail.com
Thu Mar 11 09:16:10 UTC 2021
some object needs to overlap other items conditionally, using a main
layout makes this difficult
---
modules/gui/qt/player/qml/Player.qml | 397 +++++++++++++--------------
1 file changed, 197 insertions(+), 200 deletions(-)
diff --git a/modules/gui/qt/player/qml/Player.qml b/modules/gui/qt/player/qml/Player.qml
index 3e3f9b5a9e..6f79bdaeac 100644
--- a/modules/gui/qt/player/qml/Player.qml
+++ b/modules/gui/qt/player/qml/Player.qml
@@ -201,262 +201,259 @@ Widgets.NavigableFocusScope {
}
}
- //property alias centralLayout: mainLayout.centralLayout
- ColumnLayout {
- id: mainLayout
- anchors.fill: parent
-
- Widgets.DrawerExt{
- id: topcontrolView
+ Widgets.DrawerExt{
+ id: topcontrolView
- Layout.preferredHeight: height
- Layout.fillWidth: true
- Layout.alignment: Qt.AlignTop
+ anchors {
+ top: parent.top
+ left: parent.left
+ right: parent.right
+ }
- edge: Widgets.DrawerExt.Edges.Top
- property var autoHide: topcontrolView.contentItem.autoHide
+ edge: Widgets.DrawerExt.Edges.Top
+ property var autoHide: topcontrolView.contentItem.autoHide
- state: "visible"
+ state: "visible"
- component: FocusScope {
- width: topcontrolView.width
- height: topbar.implicitHeight
- focus: true
- property bool autoHide: topbar.autoHide && !resumeDialog.visible
+ component: FocusScope {
+ width: topcontrolView.width
+ height: topbar.implicitHeight
+ focus: true
+ property bool autoHide: topbar.autoHide && !resumeDialog.visible
- TopBar{
- id: topbar
+ TopBar {
+ id: topbar
- anchors.fill: parent
+ anchors.fill: parent
- focus: true
- visible: !resumeDialog.visible
+ focus: true
+ visible: !resumeDialog.visible
- onAutoHideChanged: {
- if (autoHide)
- toolbarAutoHide.restart()
- }
+ onAutoHideChanged: {
+ if (autoHide)
+ toolbarAutoHide.restart()
+ }
- lockAutoHide: playlistpopup.state === "visible"
- title: mainPlaylistController.currentItem.title
- colors: rootPlayer.colors
+ lockAutoHide: playlistpopup.state === "visible"
+ title: mainPlaylistController.currentItem.title
+ colors: rootPlayer.colors
- navigationParent: rootPlayer
- navigationDownItem: playlistpopup.showPlaylist ? playlistpopup : (audioControls.visible ? audioControls : controlBarView)
- navigationRightItem: csdGroup
- }
+ navigationParent: rootPlayer
+ navigationDownItem: playlistpopup.showPlaylist ? playlistpopup : (audioControls.visible ? audioControls : controlBarView)
+ navigationRightItem: csdGroup
+ }
- ResumeDialog {
- id: resumeDialog
+ ResumeDialog {
+ id: resumeDialog
- anchors.fill: parent
- colors: rootPlayer.colors
- navigationParent: rootPlayer
+ anchors.fill: parent
+ colors: rootPlayer.colors
+ navigationParent: rootPlayer
- onHidden: {
- if (activeFocus) {
- topbar.focus = true
- controlBarView.forceActiveFocus()
- }
+ onHidden: {
+ if (activeFocus) {
+ topbar.focus = true
+ controlBarView.forceActiveFocus()
}
}
}
}
+ }
- Item {
- id: centerContent
-
- Layout.fillWidth: true
- Layout.fillHeight: true
- Layout.topMargin: VLCStyle.margin_xsmall
-
- ColumnLayout {
- anchors.fill: parent
- spacing: 0
+ Item {
+ id: centerContent
+ anchors {
+ left: parent.left
+ right: parent.right
+ top: topcontrolView.bottom
+ bottom: controlBarView.top
+ topMargin: VLCStyle.margin_xsmall
+ bottomMargin: VLCStyle.margin_xsmall
+ }
- visible: !rootPlayer.hasEmbededVideo
+ ColumnLayout {
+ anchors.fill: parent
+ spacing: 0
+ visible: !rootPlayer.hasEmbededVideo
- Item {
- Layout.fillHeight: true
- }
+ Item {
+ Layout.fillHeight: true
+ }
- Item {
- Layout.preferredHeight: Math.max(Math.min(parent.height, parent.width - VLCStyle.margin_small * 2), 0)
- Layout.maximumHeight: rootPlayer.height / 2.7182
- Layout.minimumHeight: 1
- Layout.preferredWidth: height * cover.sar
- Layout.alignment: Qt.AlignHCenter
+ Item {
+ Layout.preferredHeight: Math.max(Math.min(parent.height, parent.width - VLCStyle.margin_small * 2), 0)
+ Layout.maximumHeight: rootPlayer.height / 2.7182
+ Layout.minimumHeight: 1
+ Layout.preferredWidth: height * cover.sar
+ Layout.alignment: Qt.AlignHCenter
- Image {
- id: cover
+ Image {
+ id: cover
- source: rootPlayer.coverSource
- fillMode: Image.PreserveAspectFit
+ source: rootPlayer.coverSource
+ fillMode: Image.PreserveAspectFit
- //source aspect ratio
- readonly property real sar: cover.sourceSize.width / cover.sourceSize.height
- anchors.fill: parent
- }
+ //source aspect ratio
+ readonly property real sar: cover.sourceSize.width / cover.sourceSize.height
+ anchors.fill: parent
+ }
- Widgets.CoverShadow {
- anchors.fill: cover
- source: cover
- primaryVerticalOffset: VLCStyle.dp(24)
- primaryRadius: VLCStyle.dp(54)
- secondaryVerticalOffset: VLCStyle.dp(5)
- secondaryRadius: VLCStyle.dp(14)
- }
+ Widgets.CoverShadow {
+ anchors.fill: cover
+ source: cover
+ primaryVerticalOffset: VLCStyle.dp(24)
+ primaryRadius: VLCStyle.dp(54)
+ secondaryVerticalOffset: VLCStyle.dp(5)
+ secondaryRadius: VLCStyle.dp(14)
}
+ }
- Widgets.SubtitleLabel {
- id: albumLabel
+ Widgets.SubtitleLabel {
+ id: albumLabel
- Layout.fillWidth: true
- Layout.preferredHeight: implicitHeight
- Layout.topMargin: VLCStyle.margin_xxlarge
+ Layout.fillWidth: true
+ Layout.preferredHeight: implicitHeight
+ Layout.topMargin: VLCStyle.margin_xxlarge
- visible: centerContent.height > (albumLabel.y + albumLabel.height)
- text: mainPlaylistController.currentItem.album
- font.pixelSize: VLCStyle.fontSize_xxlarge
- horizontalAlignment: Text.AlignHCenter
- color: rootPlayer.colors.playerFg
- Accessible.description: i18n.qtr("album")
- }
+ visible: centerContent.height > (albumLabel.y + albumLabel.height)
+ text: mainPlaylistController.currentItem.album
+ font.pixelSize: VLCStyle.fontSize_xxlarge
+ horizontalAlignment: Text.AlignHCenter
+ color: rootPlayer.colors.playerFg
+ Accessible.description: i18n.qtr("album")
+ }
- Widgets.MenuLabel {
- id: artistLabel
+ Widgets.MenuLabel {
+ id: artistLabel
- Layout.fillWidth: true
- Layout.preferredHeight: implicitHeight
- Layout.topMargin: VLCStyle.margin_small
+ Layout.fillWidth: true
+ Layout.preferredHeight: implicitHeight
+ Layout.topMargin: VLCStyle.margin_small
- visible: centerContent.height > (artistLabel.y + artistLabel.height)
- text: mainPlaylistController.currentItem.artist
- font.weight: Font.Light
- horizontalAlignment: Text.AlignHCenter
- color: rootPlayer.colors.playerFg
- Accessible.description: i18n.qtr("artist")
- }
+ visible: centerContent.height > (artistLabel.y + artistLabel.height)
+ text: mainPlaylistController.currentItem.artist
+ font.weight: Font.Light
+ horizontalAlignment: Text.AlignHCenter
+ color: rootPlayer.colors.playerFg
+ Accessible.description: i18n.qtr("artist")
+ }
- Widgets.NavigableRow {
- id: audioControls
+ Widgets.NavigableRow {
+ id: audioControls
- Layout.preferredHeight: implicitHeight
- Layout.preferredWidth: implicitWidth
- Layout.topMargin: VLCStyle.margin_large
- Layout.alignment: Qt.AlignHCenter
- visible: player.videoTracks.count === 0 && centerContent.height > (audioControls.y + audioControls.height)
- focus: visible
- spacing: VLCStyle.margin_xxsmall
- navigationParent: rootPlayer
- KeyNavigation.up: topcontrolView
- KeyNavigation.down: controlBarView
-
- model: ObjectModel {
- Widgets.IconToolButton {
- size: VLCIcons.pixelSize(VLCStyle.icon_large)
- iconText: VLCIcons.skip_back
- onClicked: player.jumpBwd()
- text: i18n.qtr("Step back")
- color: rootPlayer.colors.playerFg
- }
-
- Widgets.IconToolButton {
- size: VLCIcons.pixelSize(VLCStyle.icon_large)
- iconText: VLCIcons.visualization
- onClicked: player.toggleVisualization()
- text: i18n.qtr("Visualization")
- color: rootPlayer.colors.playerFg
- }
-
- Widgets.IconToolButton{
- size: VLCIcons.pixelSize(VLCStyle.icon_large)
- iconText: VLCIcons.skip_for
- onClicked: player.jumpFwd()
- text: i18n.qtr("Step forward")
- color: rootPlayer.colors.playerFg
- }
+ Layout.preferredHeight: implicitHeight
+ Layout.preferredWidth: implicitWidth
+ Layout.topMargin: VLCStyle.margin_large
+ Layout.alignment: Qt.AlignHCenter
+ visible: player.videoTracks.count === 0 && centerContent.height > (audioControls.y + audioControls.height)
+ focus: visible
+ spacing: VLCStyle.margin_xxsmall
+ navigationParent: rootPlayer
+ KeyNavigation.up: topcontrolView
+ KeyNavigation.down: controlBarView
+
+ model: ObjectModel {
+ Widgets.IconToolButton {
+ size: VLCIcons.pixelSize(VLCStyle.icon_large)
+ iconText: VLCIcons.skip_back
+ onClicked: player.jumpBwd()
+ text: i18n.qtr("Step back")
+ color: rootPlayer.colors.playerFg
}
- }
- Item {
- Layout.fillHeight: true
+ Widgets.IconToolButton {
+ size: VLCIcons.pixelSize(VLCStyle.icon_large)
+ iconText: VLCIcons.visualization
+ onClicked: player.toggleVisualization()
+ text: i18n.qtr("Visualization")
+ color: rootPlayer.colors.playerFg
+ }
+
+ Widgets.IconToolButton{
+ size: VLCIcons.pixelSize(VLCStyle.icon_large)
+ iconText: VLCIcons.skip_for
+ onClicked: player.jumpFwd()
+ text: i18n.qtr("Step forward")
+ color: rootPlayer.colors.playerFg
+ }
}
}
-
+ Item {
+ Layout.fillHeight: true
+ }
}
+ }
- Widgets.DrawerExt {
- id: controlBarView
+ Widgets.DrawerExt {
+ id: controlBarView
- Layout.preferredHeight: height
- Layout.fillWidth: true
- Layout.alignment: Qt.AlignBottom
+ property var autoHide: controlBarView.contentItem.autoHide
- focus: true
+ anchors {
+ bottom: parent.bottom
+ left: parent.left
+ right: parent.right
+ }
+ focus: true
+ state: "visible"
+ edge: Widgets.DrawerExt.Edges.Bottom
- property var autoHide: controlBarView.contentItem.autoHide
+ component: Item {
+ id: controllerBarId
- state: "visible"
- edge: Widgets.DrawerExt.Edges.Bottom
+ width: controlBarView.width
+ height: controllerId.implicitHeight + controllerId.anchors.bottomMargin
+ property alias autoHide: controllerId.autoHide
- component: Item {
- id: controllerBarId
+ Item {
+ anchors.fill: parent
+ anchors.topMargin: rootPlayer.positionSliderY - controlBarView.y
+ visible: !rootPlayer.hasEmbededVideo
- width: controlBarView.width
- height: controllerId.implicitHeight + controllerId.anchors.bottomMargin
- property alias autoHide: controllerId.autoHide
+ Rectangle {
+ id: controlBarBackground
- Item {
anchors.fill: parent
- anchors.topMargin: rootPlayer.positionSliderY - controlBarView.y
- visible: !rootPlayer.hasEmbededVideo
-
- Rectangle {
- id: controlBarBackground
-
- anchors.fill: parent
- color: rootPlayer.colors.playerBg
- visible: false
- }
+ color: rootPlayer.colors.playerBg
+ visible: false
+ }
- GaussianBlur {
- anchors.fill: parent
- source: controlBarBackground
- radius: 22
- samples: 46
- opacity: .7
- }
+ GaussianBlur {
+ anchors.fill: parent
+ source: controlBarBackground
+ radius: 22
+ samples: 46
+ opacity: .7
}
+ }
+
+ MouseArea {
+ id: controllerMouseArea
+ hoverEnabled: true
+ anchors.fill: parent
- MouseArea {
- id: controllerMouseArea
- hoverEnabled: true
+ ControlBar {
+ id: controllerId
+ focus: true
anchors.fill: parent
+ anchors.leftMargin: VLCStyle.applicationHorizontalMargin
+ anchors.rightMargin: VLCStyle.applicationHorizontalMargin
+ anchors.bottomMargin: VLCStyle.applicationVerticalMargin
+ colors: rootPlayer.colors
- ControlBar {
- id: controllerId
- focus: true
- anchors.fill: parent
- anchors.leftMargin: VLCStyle.applicationHorizontalMargin
- anchors.rightMargin: VLCStyle.applicationHorizontalMargin
- anchors.bottomMargin: VLCStyle.applicationVerticalMargin
- colors: rootPlayer.colors
-
- lockAutoHide: playlistpopup.state === "visible"
- || !player.hasVideoOutput
- || !rootPlayer.hasEmbededVideo
- || controllerMouseArea.containsMouse
- onAutoHideChanged: {
- if (autoHide)
- toolbarAutoHide.restart()
- }
-
- navigationParent: rootPlayer
- navigationUpItem: playlistpopup.showPlaylist ? playlistpopup : (audioControls.visible ? audioControls : topcontrolView)
+ lockAutoHide: playlistpopup.state === "visible"
+ || !player.hasVideoOutput
+ || !rootPlayer.hasEmbededVideo
+ || controllerMouseArea.containsMouse
+ onAutoHideChanged: {
+ if (autoHide)
+ toolbarAutoHide.restart()
}
+
+ navigationParent: rootPlayer
+ navigationUpItem: playlistpopup.showPlaylist ? playlistpopup : (audioControls.visible ? audioControls : topcontrolView)
}
}
}
--
2.25.1
More information about the vlc-devel
mailing list