[vlc-commits] qml: collapse the central banner tab buttons when there is not enough space

[Pierre Lamot]

vlc | branch: master | Pierre Lamot <pierre at videolabs.io> | Fri Sep 25 18:30:07 2020 +0200| [1fe20de6ccf0cdb226f20275bfa9f53a3cdd3502] | committer: Pierre Lamot

qml: collapse the central banner tab buttons when there is not enough space

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

 modules/gui/qt/maininterface/qml/BannerSources.qml | 5 +++++
 modules/gui/qt/style/VLCStyle.qml                  | 3 +++
 modules/gui/qt/widgets/qml/BannerTabButton.qml     | 5 +++--
 3 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/modules/gui/qt/maininterface/qml/BannerSources.qml b/modules/gui/qt/maininterface/qml/BannerSources.qml
index f5c7fe3ae0..c8810e18c1 100644
--- a/modules/gui/qt/maininterface/qml/BannerSources.qml
+++ b/modules/gui/qt/maininterface/qml/BannerSources.qml
@@ -105,6 +105,9 @@ Widgets.NavigableFocusScope {
                 width: parent.width
                 height: VLCStyle.globalToolbar_height
 
+                property bool colapseTabButtons: globalToolbar.width  > (Math.max(globalToolbarLeft.width, globalToolbarRight.width) + VLCStyle.applicationHorizontalMargin)* 2
+                                                 + globalMenuGroup.model.count * VLCStyle.bannerTabButton_width_large
+
                 //drag and dbl click the titlebar in CSD mode
                 Loader {
                     anchors.fill: parent
@@ -113,6 +116,7 @@ Widgets.NavigableFocusScope {
                 }
 
                 RowLayout {
+                    id: globalToolbarLeft
                     anchors.verticalCenter: parent.verticalCenter
                     anchors.left: parent.left
                     anchors.leftMargin: VLCStyle.applicationHorizontalMargin
@@ -155,6 +159,7 @@ Widgets.NavigableFocusScope {
 
                     delegate: Widgets.BannerTabButton {
                         iconTxt: model.icon
+                        showText: globalToolbar.colapseTabButtons
                         selected: model.index === selectedIndex
                         onClicked: root.itemClicked(model.index)
                         height: globalMenuGroup.height
diff --git a/modules/gui/qt/style/VLCStyle.qml b/modules/gui/qt/style/VLCStyle.qml
index df3a3c072e..648076c947 100644
--- a/modules/gui/qt/style/VLCStyle.qml
+++ b/modules/gui/qt/style/VLCStyle.qml
@@ -187,6 +187,9 @@ Item {
     property int localToolbar_height: dp(40, scale)
     property int banner_icon_size: dp(38, scale)
 
+    property int bannerTabButton_width_small: banner_icon_size
+    property int bannerTabButton_width_large: column_width
+
     //timings
     property int delayToolTipAppear: 500;
     property int timingPlaylistClose: 1000;
diff --git a/modules/gui/qt/widgets/qml/BannerTabButton.qml b/modules/gui/qt/widgets/qml/BannerTabButton.qml
index 66e288ffaf..fba705e033 100644
--- a/modules/gui/qt/widgets/qml/BannerTabButton.qml
+++ b/modules/gui/qt/widgets/qml/BannerTabButton.qml
@@ -29,10 +29,11 @@ T.TabButton {
 
     property color color: VLCStyle.colors.banner
     property color colorSelected: VLCStyle.colors.bg
+    property bool showText: true
 
     text: model.displayText
     padding: 0
-    width: VLCStyle.colWidth(1)
+    width: control.showText ? VLCStyle.bannerTabButton_width_large : VLCStyle.banner_icon_size
     height: implicitHeight
     implicitWidth: contentItem.implicitWidth
     implicitHeight: contentItem.implicitHeight
@@ -73,7 +74,7 @@ T.TabButton {
 
             Widgets.MenuLabel {
                 id: txt
-
+                visible: showText
                 font.weight: (control.activeFocus || control.hovered || control.selected) ? Font.DemiBold : Font.Normal
                 color: (control.activeFocus || control.hovered || control.selected) ? VLCStyle.colors.text : VLCStyle.colors.menuCaption
                 text: control.text