[vlc-commits] [Git][videolan/vlc][master] 11 commits: qml/IconControlButton: set colorFocus from provided 'colors' property

Jean-Baptiste Kempf (@jbk) gitlab at videolan.org
Tue Jul 6 03:32:07 UTC 2021



Jean-Baptiste Kempf pushed to branch master at VideoLAN / VLC


Commits:
524616d6 by Prince Gupta at 2021-07-05T21:31:43+00:00
qml/IconControlButton: set colorFocus from provided 'colors' property

- - - - -
1b90844e by Prince Gupta at 2021-07-05T21:31:43+00:00
qml/TopBar: use IconControlButton

- - - - -
13976c04 by Prince Gupta at 2021-07-05T21:31:43+00:00
qml: add inplace overlay text on ab control button

also changes overlay colors to accent, overlay text was not visible in
light theme

- - - - -
d8b9d195 by Prince Gupta at 2021-07-05T21:31:43+00:00
qml/IconToolButton: remove overlay text

- - - - -
07dda9f7 by Prince Gupta at 2021-07-05T21:31:43+00:00
qml/IconToolButton: remove 'backgroundVisible' property

this property is not used anywhere, also contextually this property is
incorrect

- - - - -
56916811 by Prince Gupta at 2021-07-05T21:31:43+00:00
qml/IconToolButton: remove 'borderEnabled' property

this property is not in use anymore

- - - - -
8e807881 by Prince Gupta at 2021-07-05T21:31:43+00:00
qml/IconToolButton: improve foreground color management

- - - - -
9e3a6553 by Prince Gupta at 2021-07-05T21:31:43+00:00
qml/IconToolButton: allow changing background color

- - - - -
6485e69a by Prince Gupta at 2021-07-05T21:31:43+00:00
qml/IconControlButton: set background transparent

- - - - -
2d243f56 by Prince Gupta at 2021-07-05T21:31:43+00:00
qml/IconControlButton: update foreground colors

- - - - -
c882e2c8 by Prince Gupta at 2021-07-05T21:31:43+00:00
qml: remove 'acceptFocus' property

- - - - -


6 changed files:

- modules/gui/qt/player/qml/ControlButtons.qml
- modules/gui/qt/player/qml/TeletextWidget.qml
- modules/gui/qt/player/qml/TopBar.qml
- modules/gui/qt/player/qml/VolumeWidget.qml
- modules/gui/qt/widgets/qml/IconControlButton.qml
- modules/gui/qt/widgets/qml/IconToolButton.qml


Changes:

=====================================
modules/gui/qt/player/qml/ControlButtons.qml
=====================================
@@ -119,7 +119,6 @@ Item{
             iconText: VLCIcons.exit
             text: i18n.qtr("Back")
             onClicked: history.previous()
-            property bool acceptFocus: true
         }
     }
 
@@ -131,7 +130,6 @@ Item{
             checked: mainPlaylistController.random
             iconText: VLCIcons.shuffle_on
             onClicked: mainPlaylistController.toggleRandom()
-            property bool acceptFocus: true
             text: i18n.qtr("Random")
         }
     }
@@ -144,7 +142,6 @@ Item{
             iconText: VLCIcons.previous
             enabled: mainPlaylistController.hasPrev
             onClicked: mainPlaylistController.prev()
-            property bool acceptFocus: true
             text: i18n.qtr("Previous")
         }
     }
@@ -164,8 +161,6 @@ Item{
             property color color: isOpaque ? colors.buttonText : "#303030"
             property color colorDisabled: isOpaque ? colors.textInactive : "#7f8c8d"
 
-            property bool acceptFocus: true
-
             property bool paintOnly: false
 
             property bool isCursorInside: false
@@ -382,7 +377,6 @@ Item{
             iconText: VLCIcons.next
             enabled: mainPlaylistController.hasNext
             onClicked: mainPlaylistController.next()
-            property bool acceptFocus: true
             text: i18n.qtr("Next")
         }
     }
@@ -395,7 +389,6 @@ Item{
             iconText: VLCIcons.dvd_prev
             onClicked: player.chapterPrev()
             enabled: player.hasChapters
-            property bool acceptFocus: visible
             text: i18n.qtr("Previous chapter")
         }
     }
@@ -409,7 +402,6 @@ Item{
             iconText: VLCIcons.dvd_next
             onClicked: player.chapterNext()
             enabled: player.hasChapters
-            property bool acceptFocus: visible
             text: i18n.qtr("Next chapter")
         }
     }
@@ -425,7 +417,6 @@ Item{
                   ? VLCIcons.repeat_one
                   : VLCIcons.repeat_all
             onClicked: mainPlaylistController.toggleRepeatMode()
-            property bool acceptFocus: true
             text: i18n.qtr("Repeat")
         }
     }
@@ -485,7 +476,7 @@ Item{
                     playlistWidget.gainFocus(playlistBtn)
                 }
             }
-            property bool acceptFocus: true
+
             text: i18n.qtr("Playlist")
         }
 
@@ -497,10 +488,10 @@ Item{
             id: menuBtn
             size: VLCStyle.icon_medium
             iconText: VLCIcons.ellipsis
-            onClicked: contextMenu.popup(this.mapToGlobal(0, 0))
-            property bool acceptFocus: true
             text: i18n.qtr("Menu")
 
+            onClicked: contextMenu.popup(this.mapToGlobal(0, 0))
+
             QmlGlobalMenu {
                 id: contextMenu
 
@@ -535,7 +526,6 @@ Item{
                 verticalAlignment: Text.AlignVCenter
                 horizontalAlignment: Text.AlignHCenter
             }
-            property bool acceptFocus: false
         }
     }
 
@@ -562,7 +552,7 @@ Item{
                 verticalAlignment: Text.AlignVCenter
                 horizontalAlignment: Text.AlignHCenter
             }
-            property bool acceptFocus: false
+
             Component.onCompleted: {
                 parent.Layout.fillWidth=true
             }
@@ -577,7 +567,6 @@ Item{
             enabled: player.hasVideoOutput
             iconText: player.fullscreen ? VLCIcons.defullscreen :VLCIcons.fullscreen
             onClicked: player.fullscreen = !player.fullscreen
-            property bool acceptFocus: true
             text: i18n.qtr("fullscreen")
         }
     }
@@ -591,7 +580,6 @@ Item{
             enabled: player.isPlaying
             checked: player.isRecording
             onClicked: player.toggleRecord()
-            property bool acceptFocus: true
             text: i18n.qtr("record")
         }
     }
@@ -600,23 +588,33 @@ Item{
         id: toggleABloopstateDelegate
         Widgets.IconControlButton {
             id: abBtn
+
             size: VLCStyle.icon_medium
             checked: player.ABloopState !== PlayerController.ABLOOP_STATE_NONE
-            iconText: switch(player.ABloopState) {
+            onClicked: player.toggleABloopState()
+            text: i18n.qtr("A to B")
+
+            iconText: {
+                switch(player.ABloopState) {
                   case PlayerController.ABLOOP_STATE_A: return VLCIcons.atob_bg_b
                   case PlayerController.ABLOOP_STATE_B: return VLCIcons.atob_bg_none
                   case PlayerController.ABLOOP_STATE_NONE: return VLCIcons.atob_bg_ab
-                  }
-            textOverlay: switch(player.ABloopState) {
-                         case PlayerController.ABLOOP_STATE_A: return VLCIcons.atob_fg_a
-                         case PlayerController.ABLOOP_STATE_B: return VLCIcons.atob_fg_ab
-                         case PlayerController.ABLOOP_STATE_NONE: return ""
-                         }
-            onClicked: player.toggleABloopState()
-            color: VLCStyle.colors.buttonText
-            colorOverlay: VLCStyle.colors.banner
-            property bool acceptFocus: true
-            text: i18n.qtr("A to B")
+                }
+            }
+
+            Widgets.IconLabel {
+                anchors.centerIn: abBtn.contentItem
+
+                color: abBtn.colors.accent
+
+                text: {
+                    switch(player.ABloopState) {
+                      case PlayerController.ABLOOP_STATE_A: return VLCIcons.atob_fg_a
+                      case PlayerController.ABLOOP_STATE_B: return VLCIcons.atob_fg_ab
+                      case PlayerController.ABLOOP_STATE_NONE: return ""
+                    }
+                }
+            }
         }
     }
 
@@ -628,7 +626,6 @@ Item{
             enabled: player.isPlaying
             iconText: VLCIcons.snapshot
             onClicked: player.snapshot()
-            property bool acceptFocus: true
             text: i18n.qtr("Snapshot")
         }
     }
@@ -642,7 +639,6 @@ Item{
             enabled: player.isPlaying
             iconText: VLCIcons.stop
             onClicked: mainPlaylistController.stop()
-            property bool acceptFocus: true
             text: i18n.qtr("Stop")
         }
     }
@@ -655,7 +651,6 @@ Item{
             enabled: player.isPlaying
             iconText: VLCIcons.info
             onClicked: dialogProvider.mediaInfoDialog()
-            property bool acceptFocus: true
             text: i18n.qtr("Informations")
         }
     }
@@ -669,7 +664,6 @@ Item{
             enabled: player.isPlaying
             iconText: VLCIcons.frame_by_frame
             onClicked: player.frameNext()
-            property bool acceptFocus: true
             text: i18n.qtr("Next frame")
         }
     }
@@ -682,7 +676,6 @@ Item{
             size: VLCStyle.icon_medium
             iconText: VLCIcons.faster
             onClicked: player.faster()
-            property bool acceptFocus: true
             text: i18n.qtr("Faster")
         }
     }
@@ -695,7 +688,6 @@ Item{
             size: VLCStyle.icon_medium
             iconText: VLCIcons.slower
             onClicked: player.slower()
-            property bool acceptFocus: true
             text: i18n.qtr("Slower")
         }
     }
@@ -707,7 +699,6 @@ Item{
             size: VLCStyle.icon_medium
             iconText: VLCIcons.eject
             onClicked: dialogProvider.openDialog()
-            property bool acceptFocus: true
             text: i18n.qtr("Open media")
         }
     }
@@ -719,7 +710,6 @@ Item{
             size: VLCStyle.icon_medium
             iconText: VLCIcons.extended
             onClicked: dialogProvider.extendedDialog()
-            property bool acceptFocus: true
             Accessible.name: i18n.qtr("Extended settings")
         }
     }
@@ -731,7 +721,6 @@ Item{
             size: VLCStyle.icon_medium
             iconText: VLCIcons.skip_for
             onClicked: player.jumpFwd()
-            property bool acceptFocus: true
             text: i18n.qtr("Step forward")
         }
     }
@@ -743,7 +732,6 @@ Item{
             size: VLCStyle.icon_medium
             iconText: VLCIcons.skip_back
             onClicked: player.jumpBwd()
-            property bool acceptFocus: true
             text: i18n.qtr("Step back")
         }
     }
@@ -755,7 +743,6 @@ Item{
             size: VLCStyle.icon_medium
             iconText: VLCIcons.clear
             onClicked: mainInterface.close()
-            property bool acceptFocus: true
             text: i18n.qtr("Quit")
         }
     }
@@ -771,7 +758,6 @@ Item{
             model: player.aspectRatio
             currentIndex: -1
             onCurrentIndexChanged: model.toggleIndex(currentIndex)
-            property bool acceptFocus: true
             Accessible.name: i18n.qtr("Aspect ratio")
         }
     }
@@ -800,7 +786,6 @@ Item{
                     g_mainDisplay.showPlayer()
             }
 
-            property bool acceptFocus: true
             text: i18n.qtr("Switch Player")
         }
     }


=====================================
modules/gui/qt/player/qml/TeletextWidget.qml
=====================================
@@ -33,7 +33,6 @@ FocusScope{
     height: teleWidget.height
 
     property bool autohide: !paintOnly && !player.isTeletextAvailable
-    property bool acceptFocus: autohide
     property bool paintOnly: false
     visible: !autohide
 


=====================================
modules/gui/qt/player/qml/TopBar.qml
=====================================
@@ -135,7 +135,7 @@ FocusScope{
 
         spacing: VLCStyle.margin_xxsmall
 
-        Widgets.IconToolButton {
+        Widgets.IconControlButton {
             id: backBtn
 
             Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
@@ -144,9 +144,9 @@ FocusScope{
             size: VLCStyle.banner_icon_size
             iconText: VLCIcons.topbar_previous
             text: i18n.qtr("Back")
-            color: topFocusScope.colors.playerFg
-            colorFocus: topFocusScope.colors.bgFocus
             focus: true
+            colors: topFocusScope.colors
+
             Navigation.parentItem: topFocusScope
             Navigation.rightItem: menuSelector
             onClicked: {
@@ -245,23 +245,21 @@ FocusScope{
         topPadding: VLCStyle.margin_xxsmall
         rightPadding: VLCStyle.margin_xxsmall
 
-        Widgets.IconToolButton {
+        Widgets.IconControlButton {
             id: menuSelector
 
             focus: true
             size: VLCStyle.banner_icon_size
             iconText: VLCIcons.ellipsis
             text: i18n.qtr("Menu")
-            color: rootPlayer.colors.playerFg
-            colorFocus: rootPlayer.colors.bgFocus
-            property bool acceptFocus: true
-
-            onClicked: contextMenu.popup(this.mapToGlobal(0, height))
+            colors: topFocusScope.colors
 
             Navigation.parentItem: topFocusScope
             Navigation.leftItem: backBtn
             Navigation.rightItem: playlistButton
 
+            onClicked: contextMenu.popup(this.mapToGlobal(0, height))
+
             QmlGlobalMenu {
                 id: contextMenu
 
@@ -272,19 +270,16 @@ FocusScope{
             }
         }
 
-        Widgets.IconToolButton {
+        Widgets.IconControlButton {
             id: playlistButton
 
             objectName: ControlListModel.PLAYLIST_BUTTON
             size: VLCStyle.banner_icon_size
             iconText: VLCIcons.playlist
             text: i18n.qtr("Playlist")
-            color: rootPlayer.colors.playerFg
-            colorFocus: rootPlayer.colors.bgFocus
+            colors: topFocusScope.colors
             focus: false
 
-            property bool acceptFocus: true
-
             Navigation.parentItem: topFocusScope
             Navigation.leftItem: menuSelector
             onClicked: tooglePlaylistVisibility()


=====================================
modules/gui/qt/player/qml/VolumeWidget.qml
=====================================
@@ -34,7 +34,6 @@ FocusScope{
     property bool paintOnly: true
     enabled: !paintOnly
 
-    property bool acceptFocus: true
     Component.onCompleted: paintOnly = false
 
     property color color: colors.buttonText


=====================================
modules/gui/qt/widgets/qml/IconControlButton.qml
=====================================
@@ -25,7 +25,12 @@ IconToolButton {
 
     property VLCColors colors: VLCStyle.colors
 
+    backgroundColor: "transparent"
+    backgroundColorHover: "transparent"
+
     color: colors.playerControlBarFg
+    colorHover: colors.playerControlBarFg
+    colorHighlighted: colors.accent
     colorDisabled: colors.blendColors(control.colors.playerBg, control.colors.playerControlBarFg, .75)
-    colorOverlay: "transparent"
+    colorFocus: colors.bgFocus
 }


=====================================
modules/gui/qt/widgets/qml/IconToolButton.qml
=====================================
@@ -23,79 +23,64 @@ import "qrc:///style/"
 
 ToolButton {
     id: control
+
     property bool paintOnly: false
 
     property int size: VLCStyle.icon_normal
 
-    padding: 0
-
     property string iconText: ""
 
-    property color color: (control.highlighted) ? VLCStyle.colors.accent
-                                                : VLCStyle.colors.icon
+    // background colors
+    property color backgroundColor: "transparent"
+    property color backgroundColorHover: VLCStyle.colors.buttonHover
 
+    // foreground colors based on state
+    property color color: VLCStyle.colors.icon
+    property color colorHover: VLCStyle.colors.buttonTextHover
+    property color colorHighlighted: VLCStyle.colors.accent
     property color colorDisabled: VLCStyle.colors.textInactive
-    property color colorOverlay: "transparent"
+
+    // active border color
     property color colorFocus: VLCStyle.colors.bgFocus
-    property string textOverlay: ""
-    property bool borderEnabled: false
-    property bool backgroundVisible: background.active
 
     enabled: !paintOnly
 
+    padding: 0
+
     ToolTip.text: control.text
     ToolTip.delay: 500
 
-    contentItem: Item {
+    contentItem: Label {
+        id: text
+
+        text: control.iconText
+        color: background.foregroundColor
+
+        anchors.centerIn: parent
+
+        font.pixelSize: VLCIcons.pixelSize(control.size)
+        font.family: VLCIcons.fontFamily
+        font.underline: control.font.underline
+
+        verticalAlignment: Text.AlignVCenter
+        horizontalAlignment: Text.AlignHCenter
+
+        Accessible.ignored: true
 
         Label {
-            id: text
-            text: control.iconText
-            color: (control.enabled) ? background.foregroundColor : control.colorDisabled
+            text: VLCIcons.active_indicator
+            color: background.foregroundColor
+            visible: !control.paintOnly && control.checked
 
             anchors.centerIn: parent
 
             font.pixelSize: VLCIcons.pixelSize(control.size)
             font.family: VLCIcons.fontFamily
-            font.underline: control.font.underline
 
             verticalAlignment: Text.AlignVCenter
             horizontalAlignment: Text.AlignHCenter
 
             Accessible.ignored: true
-
-            Label {
-                text: control.textOverlay
-                color: control.colorOverlay
-
-                anchors.centerIn: parent
-
-                font.pixelSize: VLCIcons.pixelSize(control.size)
-                font.family: VLCIcons.fontFamily
-
-                verticalAlignment: Text.AlignVCenter
-                horizontalAlignment: Text.AlignHCenter
-
-                Accessible.ignored: true
-
-            }
-
-            Label {
-                text: VLCIcons.active_indicator
-                color: (control.enabled) ? background.foregroundColor : control.colorDisabled
-                visible: !control.paintOnly && control.checked
-
-                anchors.centerIn: parent
-
-                font.pixelSize: VLCIcons.pixelSize(control.size)
-                font.family: VLCIcons.fontFamily
-
-                verticalAlignment: Text.AlignVCenter
-                horizontalAlignment: Text.AlignHCenter
-
-                Accessible.ignored: true
-            }
-
         }
     }
 
@@ -104,11 +89,23 @@ ToolButton {
 
         active: control.activeFocus
 
-        backgroundColor: control.hovered ? VLCStyle.colors.buttonHover
-                                         : VLCStyle.colors.setColorAlpha(VLCStyle.colors.buttonHover, 0)
+        backgroundColor: {
+            if (control.hovered)
+                return control.backgroundColorHover
+            if (control.backgroundColor.a === 0) // if base color is transparent, animation starts with black color
+                return VLCStyle.colors.setColorAlpha(control.backgroundColorHover, 0)
+            return control.backgroundColor
+        }
 
-        foregroundColor: control.hovered ? VLCStyle.colors.buttonTextHover
-                                         : control.color
+        foregroundColor: {
+            if (control.hovered)
+                return control.colorHover
+            if (control.highlighted)
+                return control.colorHighlighted
+            if (!control.enabled)
+                return control.colorDisabled
+            return control.color
+        }
 
         activeBorderColor: control.colorFocus
 



View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/bd553fbb542ec3e5bbab0aac94b03a893af819a6...c882e2c8a7143a76f6239f333eaf9fb88dc9be76

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




More information about the vlc-commits mailing list