Commit 55ae651a authored by Nate Graham's avatar Nate Graham 🔩
Browse files

[System Tray] Auto-scale icons and expose setting for number of rows/columns

Before Plasma 5.20, the system tray icons were always 22px in size and became
multi-row/multi column as the panel increased in thickness.

So far in the Plasma 5.20 development cycle, we have exposed the existing
`iconSize` setting to the user to allow them to determine for themselves how
big they want the icon to be, or whether to be multi-row/column.

However this is not exposed very intuitively, as you have to already know that
the icon size determines the number of rows/columns, or that the largest "Enormous"
size produces an auto-scaling icon behavior. In other words, the UI reflects the
implementation, rather than the user's expectation.

This commit changes around the UI to more closely approximate what the user is
likely to want to configure: the number of rows/columns. The new default setting
is an "automatic" mode, which approximates the 5.19 and earlier behavior whereby
the system tray switches to a two-row/column view when the panel becomes thick
enough. In addition, users can now force it to always display one or two rows/

A major difference is that no matter which setting is set, icons now always
expand to fill the available space, which brings them in line with the margins
used for other Panel widgets.
parent 793f609d
......@@ -25,8 +25,12 @@
<entry name="knownItems" type="StringList" hidden="true">
<entry name="iconSize" type="Int">
<label>Default icon size for the systray icons, it's an enum which values mean, Small, SmallMedium, Medium, Large, Huge, Enormous respectively. On low DPI systems they correspond to 16, 22, 32, 48, 64, 128 pixels. On high DPI systems those values would be scaled up, depending on the DPI.</label>
<entry name="automaticRowsOrColumns" type="bool">
<label>Whether to automatically increase the number of rows or columns of icons in response to Panel thickness.</label>
<entry name="rowsOrColumns" type="Int">
<label>Number of rows or columns to show in the panel view (depending on whether the panel is horizontal or vertical, respectively) when not using automatic row/column determination.</label>
<entry name="pin" type="Bool">
......@@ -20,18 +20,30 @@
import QtQuick 2.14
import QtQuick.Controls 2.14 as QQC2
import org.kde.kirigami 2.13 as Kirigami
Kirigami.FormLayout {
import org.kde.plasma.core 2.1 as PlasmaCore
property alias cfg_iconSize: iconSizeComboBox.currentIndex
import org.kde.kirigami 2.13 as Kirigami
QQC2.ComboBox {
id: iconSizeComboBox
Kirigami.FormLayout {
Kirigami.FormData.label: i18n("Maximum icon size:")
property alias cfg_automaticRowsOrColumns: automaticRadioButton.checked
property int cfg_rowsOrColumns
model: [i18n("Very Small"), i18n("Small"), i18n("Medium"), i18n("Large"), i18n("Huge"), i18n("Enormous")]
QQC2.RadioButton {
id: automaticRadioButton
Kirigami.FormData.label: i18nc("The arrangement of system tray icons in the Panel", "Panel icon arrangement:")
text: plasmoid.formFactor === PlasmaCore.Types.Horizontal ?
i18n("Adapt to Panel height") : i18n("Adapt to Panel width")
QQC2.RadioButton {
text: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? i18n("One row") : i18n("One column")
checked: !automaticRadioButton.checked && cfg_rowsOrColumns === 1
onClicked: cfg_rowsOrColumns = 1
QQC2.RadioButton {
text: plasmoid.formFactor === PlasmaCore.Types.Horizontal ? i18n("Two rows") : i18n("Two columns")
checked: !automaticRadioButton.checked && cfg_rowsOrColumns === 2
onClicked: cfg_rowsOrColumns = 2
......@@ -38,19 +38,12 @@ MouseArea {
LayoutMirroring.enabled: !vertical && Qt.application.layoutDirection === Qt.RightToLeft
LayoutMirroring.childrenInherit: true
property var iconSizes: ["small", "smallMedium", "medium", "large", "huge", "enormous"];
property int iconSize: plasmoid.configuration.iconSize + (Kirigami.Settings.tabletMode ? 1 : 0)
property bool vertical: plasmoid.formFactor === PlasmaCore.Types.Vertical
readonly property int itemSize: {
var baseSize = units.roundToIconSize(Math.min(Math.min(width, height), units.iconSizes[iconSizes[Math.min(iconSizes.length-1, iconSize)]]));
if (Kirigami.Settings.tabletMode) {
// Set the tray items' clickable areas on the panel to be bigger than normal to allow for easier touchability
return baseSize + units.smallSpacing;
} else {
return baseSize + Math.round(units.smallSpacing/2);
// Used only by AbstractItem, but it's easiest to keep it here since it
// uses dimensions from this item to calculate the final value
readonly property int itemSize: units.roundToIconSize(Math.min(Math.min(width, height), units.iconSizes.enormous));
property alias expanded: dialog.visible
property Item activeApplet
......@@ -149,22 +142,33 @@ MouseArea {
GridView {
id: tasksGrid
readonly property int thickness: root.vertical ? root.width : root.height
readonly property bool autoSize: plasmoid.configuration.automaticRowsOrColumns
readonly property int rowsOrColumns: {
if (autoSize) {
if (thickness <= units.iconSizes.smallMedium * 2) {
return 1
} else {
return 2
} else {
return plasmoid.configuration.rowsOrColumns
readonly property int cellLength: thickness / rowsOrColumns
readonly property int totalLength: cellLength * Math.round(count / rowsOrColumns)
Layout.alignment: Qt.AlignCenter
interactive: false //disable features we don't need
flow: vertical ? GridView.LeftToRight : GridView.TopToBottom
cellHeight: vertical ? cellLength : root.height / rows
cellWidth: vertical ? root.width / columns : cellLength
readonly property int cellLength: root.itemSize + units.smallSpacing
readonly property int columns: !vertical ? Math.ceil(count / rows) :
Math.max(1, Math.floor(root.width / cellLength))
readonly property int rows: vertical ? Math.ceil(count / columns) :
Math.max(1, Math.floor(root.height / cellLength))
implicitHeight: root.vertical ? totalLength : root.height
implicitWidth: !root.vertical ? totalLength : root.width
implicitHeight: rows * cellHeight
implicitWidth: columns * cellWidth
cellHeight: cellLength
cellWidth: cellLength
model: PlasmaCore.SortFilterModel {
sourceModel: plasmoid.nativeInterface.systemTrayModel
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment