[vlc-commits] [Git][videolan/vlc][master] qml: do not pixel align border width in rounded rectangles
Steve Lhomme (@robUx4)
gitlab at videolan.org
Thu Jul 2 17:24:13 UTC 2026
Steve Lhomme pushed to branch master at VideoLAN / VLC
Commits:
7346d576 by Fatih Uzunoglu at 2026-07-02T16:23:28+00:00
qml: do not pixel align border width in rounded rectangles
Pixel aligned border width causes artifacts when the rectangle
is rounded.
For now we don't create such `RectangleExt` just for
this purpose.
The binding is added to all rectangles that already
have a valid `border.color` binding, regardless of
their current radius, which is subject to change.
Co-authored-by: Pierre Lamot <pierre at videolabs.io>
- - - - -
19 changed files:
- modules/gui/qt/dialogs/toolbar/qml/EditorDNDDelegate.qml
- modules/gui/qt/dialogs/toolbar/qml/ToolbarEditor.qml
- modules/gui/qt/dialogs/toolbar/qml/ToolbarEditorButtonList.qml
- modules/gui/qt/maininterface/qml/MainInterface.qml
- modules/gui/qt/network/qml/BrowseTreeDisplay.qml
- modules/gui/qt/network/qml/NetworkAddressbar.qml
- modules/gui/qt/player/qml/NavigationBox.qml
- modules/gui/qt/widgets/qml/AnimatedBackground.qml
- modules/gui/qt/widgets/qml/CheckBoxExt.qml
- modules/gui/qt/widgets/qml/CheckButton.qml
- modules/gui/qt/widgets/qml/ComboBoxExt.qml
- modules/gui/qt/widgets/qml/DragItem.qml
- modules/gui/qt/widgets/qml/ListViewExt.qml
- modules/gui/qt/widgets/qml/PointingTooltip.qml
- modules/gui/qt/widgets/qml/ProgressIndicator.qml
- modules/gui/qt/widgets/qml/RadioButtonExt.qml
- modules/gui/qt/widgets/qml/SpinBoxExt.qml
- modules/gui/qt/widgets/qml/TextFieldExt.qml
- modules/gui/qt/widgets/qml/ToolTipExt.qml
Changes:
=====================================
modules/gui/qt/dialogs/toolbar/qml/EditorDNDDelegate.qml
=====================================
@@ -143,6 +143,7 @@ T.Control {
border.width: VLCStyle.dp(1, VLCStyle.scale)
border.color: theme.border
+ border.pixelAligned: (radius < Number.EPSILON)
}
contentItem: Item {
=====================================
modules/gui/qt/dialogs/toolbar/qml/ToolbarEditor.qml
=====================================
@@ -195,6 +195,7 @@ Item {
border.color: theme.border
border.width: VLCStyle.border
+ border.pixelAligned: (radius < Number.EPSILON)
property alias count: dndView.count
@@ -260,6 +261,7 @@ Item {
color: buttonList.colorContext.bg.primary
border.color: theme.border
border.width: VLCStyle.border
+ border.pixelAligned: (radius < Number.EPSILON)
ColumnLayout {
anchors.fill: parent
=====================================
modules/gui/qt/dialogs/toolbar/qml/ToolbarEditorButtonList.qml
=====================================
@@ -106,6 +106,7 @@ GridView {
border.color: theme.border
border.width: VLCStyle.dp(2, VLCStyle.scale)
+ border.pixelAligned: (radius < Number.EPSILON)
Text {
anchors.centerIn: parent
@@ -190,6 +191,7 @@ GridView {
border.width: VLCStyle.dp(1, VLCStyle.scale)
border.color: containsMouse && !buttonDragItem.Drag.active ? colorContext.border
: "transparent"
+ border.pixelAligned: (radius < Number.EPSILON)
ColumnLayout {
anchors.fill: parent
=====================================
modules/gui/qt/maininterface/qml/MainInterface.qml
=====================================
@@ -154,6 +154,7 @@ Item {
border.width: 1
border.color: theme.accent
+ border.pixelAligned: (radius < Number.EPSILON)
color: (historyDragHandler.accumulatedDelta >= historyDragHandler.threshold) ? theme.accent
: theme.bg.primary
=====================================
modules/gui/qt/network/qml/BrowseTreeDisplay.qml
=====================================
@@ -346,6 +346,7 @@ MainViewLoader {
background: Rectangle {
// NOTE: This is necessary because MainViewLoader may position this indicator over the shown header when height is small.
border.color: emptyLabel.colorContext.border
+ border.pixelAligned: (radius < Number.EPSILON)
radius: VLCStyle.dp(6, VLCStyle.scale)
color: emptyLabel.colorContext.bg.primary
opacity: 0.8
=====================================
modules/gui/qt/network/qml/NetworkAddressbar.qml
=====================================
@@ -81,6 +81,7 @@ T.Control {
background: Rectangle {
border.width: VLCStyle.dp(1, VLCStyle.scale)
border.color: theme.border
+ border.pixelAligned: (radius < Number.EPSILON)
color: theme.bg.primary
}
=====================================
modules/gui/qt/player/qml/NavigationBox.qml
=====================================
@@ -134,6 +134,7 @@ Control {
radius: VLCStyle.navBoxButton_radius
border.color: theme.bg.secondary
border.width: VLCStyle.border
+ border.pixelAligned: (radius < Number.EPSILON)
MouseArea {
id: mouseArea
=====================================
modules/gui/qt/widgets/qml/AnimatedBackground.qml
=====================================
@@ -41,6 +41,7 @@ Rectangle {
color: "transparent"
border.width: VLCStyle.focus_border
+ border.pixelAligned: (radius < Number.EPSILON)
//---------------------------------------------------------------------------------------------
// Animations
=====================================
modules/gui/qt/widgets/qml/CheckBoxExt.qml
=====================================
@@ -61,6 +61,7 @@ T.CheckBox {
color: control.down ? Qt.lighter(theme.accent) : theme.bg.primary
border.width: control.visualFocus ? VLCStyle.dp(2, VLCStyle.scale) : VLCStyle.dp(1, VLCStyle.scale)
border.color: control.visualFocus ? theme.accent : theme.fg.primary
+ border.pixelAligned: (radius < Number.EPSILON)
Rectangle {
anchors.centerIn: parent
=====================================
modules/gui/qt/widgets/qml/CheckButton.qml
=====================================
@@ -171,6 +171,7 @@ T.Switch {
border.color: root.colorBorder
border.width: VLCStyle.border
+ border.pixelAligned: (radius < Number.EPSILON)
MouseArea {
id: handle
=====================================
modules/gui/qt/widgets/qml/ComboBoxExt.qml
=====================================
@@ -123,6 +123,7 @@ T.ComboBox {
background: Rectangle {
color: control.bgColor
border.color: control.borderColor
+ border.pixelAligned: (radius < Number.EPSILON)
radius: 2
}
}
=====================================
modules/gui/qt/widgets/qml/DragItem.qml
=====================================
@@ -454,6 +454,7 @@ Item {
color: fsmLoadingFailed.active ? theme.bg.negative : theme.bg.primary
border.color: theme.border
border.width: VLCStyle.dp(1, VLCStyle.scale)
+ border.pixelAligned: (radius < Number.EPSILON)
radius: VLCStyle.dp(6, VLCStyle.scale)
Widgets.RoundedRectangleShadow {
@@ -584,6 +585,7 @@ Item {
color: theme.bg.secondary
border.width: VLCStyle.dp(1, VLCStyle.scale)
border.color: theme.border
+ border.pixelAligned: (radius < Number.EPSILON)
Widgets.MenuLabel {
anchors.fill: parent
=====================================
modules/gui/qt/widgets/qml/ListViewExt.qml
=====================================
@@ -242,6 +242,7 @@ ListView {
border.width: VLCStyle.dp(2)
border.color: theme.accent
+ border.pixelAligned: (radius < Number.EPSILON)
color: "transparent"
=====================================
modules/gui/qt/widgets/qml/PointingTooltip.qml
=====================================
@@ -52,6 +52,7 @@ ToolTipExt {
border.color: pointingTooltip.colorContext.border
color: pointingTooltip.colorContext.bg.primary
radius: pointingTooltip.radius
+ border.pixelAligned: (radius < Number.EPSILON)
readonly property real arrowHeight: arrow.implicitHeight + border.width
@@ -84,6 +85,7 @@ ToolTipExt {
color: pointingTooltip.colorContext.bg.primary
border.color: pointingTooltip.colorContext.border
+ border.pixelAligned: (radius < Number.EPSILON)
}
}
}
=====================================
modules/gui/qt/widgets/qml/ProgressIndicator.qml
=====================================
@@ -38,6 +38,7 @@ Control {
background: Rectangle {
border.color: theme.border
+ border.pixelAligned: (radius < Number.EPSILON)
radius: VLCStyle.dp(6, VLCStyle.scale)
color: theme.bg.primary
opacity: 0.8
=====================================
modules/gui/qt/widgets/qml/RadioButtonExt.qml
=====================================
@@ -63,6 +63,7 @@ T.RadioButton {
color: control.down ? Qt.lighter(theme.accent) : theme.bg.primary
border.width: control.visualFocus ? VLCStyle.dp(2, VLCStyle.scale) : VLCStyle.dp(1, VLCStyle.scale)
border.color: control.visualFocus ? theme.accent : theme.fg.primary
+ border.pixelAligned: (radius < Number.EPSILON)
Rectangle {
x: (parent.width - width) / 2
=====================================
modules/gui/qt/widgets/qml/SpinBoxExt.qml
=====================================
@@ -76,6 +76,7 @@ T.SpinBox {
radius: VLCStyle.margin_xxxsmall
border.color: control.borderColor
border.width: control.borderWidth
+ border.pixelAligned: (radius < Number.EPSILON)
color: control.bgColor
}
=====================================
modules/gui/qt/widgets/qml/TextFieldExt.qml
=====================================
@@ -51,6 +51,7 @@ TextField {
border.width: control.enabled ? VLCStyle.dp(2, VLCStyle.scale) : 0
color: theme.bg.primary
border.color: theme.border
+ border.pixelAligned: (radius < Number.EPSILON)
radius: control.radius
}
=====================================
modules/gui/qt/widgets/qml/ToolTipExt.qml
=====================================
@@ -81,6 +81,7 @@ T.ToolTip {
background: Rectangle {
border.color: theme.border
+ border.pixelAligned: (radius < Number.EPSILON)
color: theme.bg.primary
radius: control.radius
}
View it on GitLab: https://code.videolan.org/videolan/vlc/-/commit/7346d57650cfdda9a06a705c4f5a94743a7d67c8
--
View it on GitLab: https://code.videolan.org/videolan/vlc/-/commit/7346d57650cfdda9a06a705c4f5a94743a7d67c8
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