[vlc-commits] [Git][videolan/vlc][master] 3 commits: qml: add property `mainView_topLeftRadius` in `VLCStyle`
Felix Paul Kühne (@fkuehne)
gitlab at videolan.org
Thu Jul 23 14:13:05 UTC 2026
Felix Paul Kühne pushed to branch master at VideoLAN / VLC
Commits:
a170caf8 by Fatih Uzunoglu at 2026-07-23T15:32:08+02:00
qml: add property `mainView_topLeftRadius` in `VLCStyle`
- - - - -
ca65859f by Fatih Uzunoglu at 2026-07-23T15:32:08+02:00
qml: get rid of the backdrop blur exposure in `MusicArtistsAlbums`
We now have the side navigation bar exposing the effect, having it
also here feels too much, and it is also not compatible with top
left rounding in main page.
- - - - -
a5532a26 by Fatih Uzunoglu at 2026-07-23T15:32:08+02:00
qml: use top left rounding in main view
This follows Fluent UI design.
Note that since individual corner rounding
in `Rectangle` is only available starting
with Qt 6.7, rounding is only done with at
least Qt 6.7.
- - - - -
3 changed files:
- modules/gui/qt/maininterface/qml/MainDisplay.qml
- modules/gui/qt/medialibrary/qml/MusicArtistsAlbums.qml
- modules/gui/qt/style/VLCStyle.qml
Changes:
=====================================
modules/gui/qt/maininterface/qml/MainDisplay.qml
=====================================
@@ -455,6 +455,43 @@ FocusScope {
rightPadding: playlistLoader.shown ? 0 : VLCStyle.applicationHorizontalMargin
+ // Top-left corner rounding:
+ Widgets.AcrylicBackground {
+ id: topLeftCornerBackground
+
+ z: 99
+ color: sidebar.background.color
+ visible: sidebar.visible && (stackViewTopLeftRadiusRectangle.topLeftRadius !== undefined)
+
+ anchors.left: stackView.left
+ anchors.leftMargin: -1
+ anchors.top: stackView.top
+
+ // (-1) is to prevent seams
+ width: stackViewTopLeftRadiusRectangle.width - 1
+ height: stackViewTopLeftRadiusRectangle.height - 1
+
+ Rectangle {
+ id: stackViewTopLeftRadiusRectangle
+
+ width: (stackViewTopLeftRadiusRectangle.topLeftRadius * 2)
+ height: (stackViewTopLeftRadiusRectangle.topLeftRadius * 2)
+
+ anchors.top: parent.top
+ anchors.left: parent.left
+ anchors.leftMargin: 1
+
+ color: stackViewParent.color
+
+ property real implicitTopLeftRadius: VLCStyle.mainView_topLeftRadius
+
+ Component.onCompleted: {
+ if (stackViewTopLeftRadiusRectangle.topLeftRadius !== undefined) // TODO: Directly set when minimum Qt is 6.7
+ stackViewTopLeftRadiusRectangle.topLeftRadius = Qt.binding(() => stackViewTopLeftRadiusRectangle.implicitTopLeftRadius)
+ }
+ }
+ }
+
onCurrentItemChanged: {
if (currentItem) {
{
@@ -518,7 +555,7 @@ FocusScope {
topPadding: 0
leftPadding: 0
- rightPadding: sidebarResizeHandle.borderWidth
+ rightPadding: sidebarResizeHandle.visualBorder.width
bottomPadding: VLCStyle.applicationVerticalMargin + VLCStyle.margin_small
safeAreaLeftMargin: VLCStyle.applicationHorizontalMargin
@@ -590,6 +627,8 @@ FocusScope {
panelObject: MainCtx.navigationPanel
atRight: true
+ visualBorder.visible: !topLeftCornerBackground.visible
+
minimumWidth: sidebar.minimumWidth
maximumWidth: sidebar.maximumWidth
@@ -669,7 +708,7 @@ FocusScope {
focus: true
- leftPadding: playqueueResizeHandle.borderWidth
+ leftPadding: playqueueResizeHandle.visualBorder.width
rightPadding: VLCStyle.applicationHorizontalMargin
bottomPadding: VLCStyle.margin_normal + Math.max(VLCStyle.applicationVerticalMargin - g_mainDisplay.displayMargin, 0)
topPadding: VLCStyle.layoutTitle_top_padding
@@ -980,7 +1019,7 @@ FocusScope {
required property QtObject panelObject
property alias atRight: resizeHandle.atRight
- property alias borderWidth: visualBorder.width
+ property alias visualBorder: visualBorder
property alias minimumWidth: resizeHandle.minimumWidth
property alias maximumWidth: resizeHandle.maximumWidth
=====================================
modules/gui/qt/medialibrary/qml/MusicArtistsAlbums.qml
=====================================
@@ -182,8 +182,8 @@ Widgets.PageExt {
displayMarginBeginning: root.displayMarginBeginning
displayMarginEnd: root.displayMarginEnd
- fadingEdge.backgroundColor: artistListBackground.usingAcrylic ? Qt.alpha(artistListBackground.alternativeColor, 0.0)
- : artistListBackground.alternativeColor
+ fadingEdge.backgroundColor: (root.background && (root.background?.color.a > (1.0 - Number.EPSILON))) ? root.background.color
+ : "transparent"
fadingEdge.enableBeginningFade: root.enableBeginningFade
fadingEdge.enableEndFade: root.enableEndFade
@@ -194,65 +194,6 @@ Widgets.PageExt {
root.artistId = model.getDataAt(currentIndex).id
}
- Widgets.AcrylicBackground {
- id: artistListBackground
-
- z: -1
-
- anchors.fill: parent
-
- anchors.bottomMargin: usingAcrylic ? 0 : -artistList.displayMarginEnd
-
- tintColor: artistList.colorContext.bg.secondary
-
- Rectangle {
- // For the frosted glass effect to work properly, the content
- // (source) should be opaque. If there is inter-window backdrop
- // blur, this is not the case.
-
- // Note that beneath there is already (`stackViewParent`) a
- // background rectangle, but since `ViewBlockingRectangle` does
- // not use blending to block anything beneath in the scene graph
- // being rendered, the layered source essentially has transparent
- // area. Qt 5 (barely) allowed having layered items to have RGB
- // texture, but Qt 6 RHI mandates RGBA format
- // (`ShaderEffectSource.RGBA`).
-
- // For that reason, we need to restrict the extents of inter-window
- // backdrop blur (`AcrylicBackground`) to the beginning boundaries
- // of the area that is going to be blurred by `FrostedGlassEffect`.
-
- // This rectangle would not be necessary if there was a guarantee
- // that `stackViewParent`'s color is the same as
- // `artistListBackground.alternativeColor` as the `AcrylicBackground`
- // area is restricted, but since there is no such mandate this
- // rectangle can act as the opaque background provider with the
- // desired color.
-
- // Ideally the `FrostedGlassEffect` itself should have a base
- // rectangle that it places beneath the source, similar to
- // how it has a `filter` that it places on top of the source,
- // but this is not possible because `AcrylicBackground`/
- // `ViewBlockingRectangle` prevents anything beneath in the
- // scene graph to be rendered as it acts as a "pass through"
- // (for video visual PIP player case, or the window itself
- // for the inter-window backdrop blur case).
-
- // Background should be opaque, though here if it is translucent,
- // there is also another background provider `stackViewParent`
- // but its color may be different:
- color: Qt.alpha(artistListBackground.alternativeColor, 1.0)
-
- anchors.left: parent.left
- anchors.right: parent.right
- anchors.top: parent.bottom
-
- height: artistList.displayMarginEnd
-
- visible: (height > 0.0) && artistListBackground.usingAcrylic
- }
- }
-
Navigation.parentItem: root
Navigation.rightAction: function() {
=====================================
modules/gui/qt/style/VLCStyle.qml
=====================================
@@ -212,6 +212,8 @@ QtObject {
readonly property int artistGridCover_radius: MainCtx.dp(90, scale)
+ readonly property real mainView_topLeftRadius: MainCtx.dp(8, scale)
+
//GridItem
readonly property int gridItemTitle_topMargin: margin_xsmall + margin_xxxsmall
readonly property int gridItemTitle_height: fontHeight_normal
View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/48eaa3f898b3fde21ddad318a0c89d6f6bb94eff...a5532a267d610c830507ffbde116353c3711f1fd
--
View it on GitLab: https://code.videolan.org/videolan/vlc/-/compare/48eaa3f898b3fde21ddad318a0c89d6f6bb94eff...a5532a267d610c830507ffbde116353c3711f1fd
You're receiving this email because of your account on code.videolan.org. Manage all notifications: https://code.videolan.org/-/profile/notifications | Help: https://code.videolan.org/help
More information about the vlc-commits
mailing list