From a451464aa741c72e1771e615c83b07add60f5810 Mon Sep 17 00:00:00 2001 From: Ismael Asensio Date: Sat, 10 Oct 2020 17:08:35 +0200 Subject: [PATCH 1/2] [mediacontroller] Use a footer for player selector It looks better and more consistent with other plasmoids, but main rationale is to be able to expand it with more media controls in a future --- .../contents/ui/ExpandedRepresentation.qml | 55 +++++++++++-------- 1 file changed, 32 insertions(+), 23 deletions(-) diff --git a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml index 2f89d33cc9..d6167b08ca 100644 --- a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml +++ b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml @@ -29,7 +29,7 @@ import org.kde.kcoreaddons 1.0 as KCoreAddons import org.kde.kirigami 2.4 as Kirigami import QtGraphicalEffects 1.0 -Item { +PlasmaComponents3.Page { id: expandedRepresentation Layout.minimumWidth: units.gridUnit * 14 @@ -455,32 +455,41 @@ Item { } } } + } - PlasmaComponents3.ComboBox { - Layout.fillWidth: true - Layout.leftMargin: units.gridUnit*2 - Layout.rightMargin: units.gridUnit*2 - - id: playerCombo - textRole: "text" - visible: model.length > 2 // more than one player, @multiplex is always there - model: root.mprisSourcesModel - - onModelChanged: { - // if model changes, ComboBox resets, so we try to find the current player again... - for (var i = 0, length = model.length; i < length; ++i) { - if (model[i].source === mpris2Source.current) { - currentIndex = i - break + footer: PlasmaExtras.PlasmoidHeading { + location: PlasmaExtras.PlasmoidHeading.Location.Footer + visible: playerList.model.length > 2 // more than one player, @multiplex is always there + + RowLayout { + anchors.fill: parent + + PlasmaComponents3.ComboBox { + Layout.fillWidth: true + Layout.leftMargin: units.gridUnit*2 + Layout.rightMargin: units.gridUnit*2 + + id: playerCombo + textRole: "text" + visible: model.length > 2 // more than one player, @multiplex is always there + model: root.mprisSourcesModel + + onModelChanged: { + // if model changes, ComboBox resets, so we try to find the current player again... + for (var i = 0, length = model.length; i < length; ++i) { + if (model[i].source === mpris2Source.current) { + currentIndex = i + break + } } } - } - onActivated: { - disablePositionUpdate = true - // ComboBox has currentIndex and currentText, why doesn't it have currentItem/currentModelValue? - mpris2Source.current = model[index].source - disablePositionUpdate = false + onActivated: { + disablePositionUpdate = true + // ComboBox has currentIndex and currentText, why doesn't it have currentItem/currentModelValue? + mpris2Source.current = model[index].source + disablePositionUpdate = false + } } } } -- GitLab From 540f598c960b2afe21b55eefd5f250508bbada52 Mon Sep 17 00:00:00 2001 From: Ismael Asensio Date: Mon, 5 Oct 2020 19:59:38 +0200 Subject: [PATCH 2/2] [mediacontroller] Use icon tabs to select player Show the available players as an icon row of tabs instead of a combobox. The player name is shown in a tooltip on hover. --- .../contents/ui/ExpandedRepresentation.qml | 47 ++++++++++--------- applets/mediacontroller/contents/ui/main.qml | 2 +- 2 files changed, 27 insertions(+), 22 deletions(-) diff --git a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml index d6167b08ca..5a76f56405 100644 --- a/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml +++ b/applets/mediacontroller/contents/ui/ExpandedRepresentation.qml @@ -464,31 +464,36 @@ PlasmaComponents3.Page { RowLayout { anchors.fill: parent - PlasmaComponents3.ComboBox { + PlasmaComponents3.TabBar { + id: playerSelector + position: PlasmaComponents3.TabBar.Footer + Layout.fillWidth: true - Layout.leftMargin: units.gridUnit*2 - Layout.rightMargin: units.gridUnit*2 - - id: playerCombo - textRole: "text" - visible: model.length > 2 // more than one player, @multiplex is always there - model: root.mprisSourcesModel - - onModelChanged: { - // if model changes, ComboBox resets, so we try to find the current player again... - for (var i = 0, length = model.length; i < length; ++i) { - if (model[i].source === mpris2Source.current) { - currentIndex = i - break + implicitHeight: contentHeight + + Repeater { + id: playerList + model: root.mprisSourcesModel + + delegate: PlasmaComponents3.TabButton { + icon.name: modelData["icon"] + icon.height: PlasmaCore.Units.iconSizes.smallMedium + Accessible.name: modelData["text"] + PlasmaComponents3.ToolTip { + text: modelData["text"] + } + onClicked: { + disablePositionUpdate = true + mpris2Source.current = modelData["source"]; + disablePositionUpdate = false } } - } - onActivated: { - disablePositionUpdate = true - // ComboBox has currentIndex and currentText, why doesn't it have currentItem/currentModelValue? - mpris2Source.current = model[index].source - disablePositionUpdate = false + onModelChanged: { + playerSelector.currentIndex = model.findIndex( + (data) => { return data.source === mpris2Source.current } + ) + } } } } diff --git a/applets/mediacontroller/contents/ui/main.qml b/applets/mediacontroller/contents/ui/main.qml index 23ad8f7598..a12c8a2178 100644 --- a/applets/mediacontroller/contents/ui/main.qml +++ b/applets/mediacontroller/contents/ui/main.qml @@ -293,7 +293,7 @@ Item { model.push({ 'text': mpris2Source.data[source]["Identity"], - 'icon': mpris2Source.data[source]["Desktop Icon Name"] || mpris2Source.data[source]["Desktop Entry"] || source, + 'icon': mpris2Source.data[source]["Desktop Icon Name"] || mpris2Source.data[source]["DesktopEntry"] || "emblem-music-symbolic", 'source': source }); } -- GitLab