Commit 19b1507b authored by Kai Uwe Broulik's avatar Kai Uwe Broulik 🍇
Browse files

[Kickoff] Revamp LeaveButtons item

* Simplify to be a `Repeater` in a `ColumnLayout`
* Popuplate context menu with an `Instantiator` with `MenuItem` as delegate
* Elide power buttons if necessary (previously they would just be cut off/fall off the view)
* Position context menu below/above the leave button
* Make leave button "pressed" while the menu is open
parent 62503e21
/*
Copyright (C) 2020 Mikel Johnson <mikel5764@gmail.com>
Copyright (C) 2021 Kai Uwe Broulik <kde@broulik.de>
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
......@@ -15,7 +16,7 @@
with this program; if not, write to the Free Software Foundation, Inc.,
51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
*/
import QtQuick 2.0
import QtQuick 2.12
import org.kde.plasma.private.kicker 0.1 as Kicker
import org.kde.plasma.components 2.0 as PlasmaComponents // for Menu + MenuItem
import org.kde.plasma.components 3.0 as PlasmaComponents3
......@@ -24,121 +25,136 @@ import QtQuick.Layouts 1.12
Item {
id: leaveButtonRoot
property Item leave: itemModel.contentWidth > itemModel.width ? leaveIconButton : leaveButton
property alias leave: leaveButton
ListView {
id: itemModelReference
interactive: false
visible: false
// maximum available space (including leave button being icon only)
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.right: leaveIconButton.left
anchors.rightMargin: PlasmaCore.Units.largeSpacing
orientation: ListView.Horizontal
spacing: PlasmaCore.Units.smallSpacing * 2
delegate: PlasmaComponents3.ToolButton {
anchors.verticalCenter: parent ? parent.verticalCenter : undefined
text: model.display
icon.name: model.decoration
// It's important to ignore here, as it will cause crashes when using orca in some cases (like when removing applet or restarting)
Accessible.ignored: true
RowLayout {
id: leaveButtonsRow
anchors {
verticalCenter: parent.verticalCenter
left: parent.left
right: leaveButton.left
rightMargin: spacing
}
model: systemFavorites
// Important
Accessible.ignored: true
}
ListView {
id: itemModel
interactive: false
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.right: leaveButton.left
anchors.rightMargin: PlasmaCore.Units.largeSpacing
orientation: ListView.Horizontal
spacing: PlasmaCore.Units.smallSpacing * 2
delegate: PlasmaComponents3.ToolButton {
anchors.verticalCenter: parent ? parent.verticalCenter : undefined
text: model.display
icon.name: model.decoration
onClicked: {
itemModel.model.trigger(index, "", "")
Repeater {
model: systemFavorites
PlasmaComponents3.ToolButton {
// so that it lets the buttons elide...
Layout.fillWidth: true
// ... but does not make the buttons grow
Layout.maximumWidth: implicitWidth
text: model.display
icon.name: model.decoration
onClicked: {
itemModel.model.trigger(index, "", "")
}
}
//intentionally allow overflow (in that case leave button is icon only to account for this)
width: itemModelReference.contentWidth <= itemModelReference.width ? implicitWidth : Math.min(implicitWidth, Math.round((itemModelReference.width-PlasmaCore.Units.smallSpacing * 2)/itemModel.count))
}
model: systemFavorites
// don't let view move to last child (thus breaking stuff) by going to beginning on width change
// lesson learned: don't do onContentXChanged because it will cause loops and *will* crash the desktop in RTL mode
onWidthChanged: positionViewAtBeginning()
Item { // compact layout
Layout.fillWidth: true
}
}
// Purely for layouting
PlasmaComponents3.ToolButton {
id: leaveButton
property int currentID: plasmoid.configuration.primaryActions
icon.name: currentID == 0 ? "system-log-out" : currentID == 1 ? "system-shutdown" : "view-more-symbolic"
onClicked: contextMenu.open()
text: currentID == 0 ? i18n("Leave...") : currentID == 1 ? i18n("Power...") : i18n("More...")
visible: itemModel.contentWidth <= itemModel.width
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter;
Keys.forwardTo: [leaveButtonRoot]
id: leaveButtonReference
icon: leaveButton.icon
text: leaveButton.text
visible: false
}
PlasmaComponents3.ToolButton {
id: leaveIconButton
icon.name: leaveButton.icon.name
onClicked: contextMenu.open()
visible: itemModel.contentWidth > itemModel.width
display: PlasmaComponents3.AbstractButton.IconOnly
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter;
hoverEnabled: true
PlasmaComponents3.ToolTip { text: leaveButton.currentID == 0 ? i18n("Leave") : leaveButton.currentID == 1 ? i18n("Power") : i18n("More") }
id: leaveButton
readonly property int currentId: plasmoid.configuration.primaryActions
anchors {
right: parent.right
verticalCenter: parent.verticalCenter
}
display: {
if (leaveButtonsRow.implicitWidth > leaveButtonRoot.width - leaveButtonsRow.anchors.rightMargin - leaveButtonReference.width) {
return PlasmaComponents3.AbstractButton.IconOnly;
}
return PlasmaComponents3.AbstractButton.TextBesideIcon;
}
icon.name: {
return [
"system-log-out",
"system-shutdown",
"view-more-symbolic"
][currentId];
}
text: {
return [
i18n("Leave..."),
i18n("Power..."),
i18n("More...")
][currentId];
}
// Make it look pressed while the menu is open
checked: contextMenu.status === PlasmaComponents.DialogStatus.Open
onClicked: contextMenu.openRelative()
Keys.forwardTo: [leaveButtonRoot]
}
Keys.onPressed: {
if (event.key == Qt.Key_Tab && mainTabGroup.state == "top") {
keyboardNavigation.state = "LeftColumn"
root.currentView.forceActiveFocus()
event.accepted = true;
PlasmaComponents3.ToolTip {
text: {
return [
i18n("Leave"),
i18n("Power"),
i18n("More")
][leaveButton.currentId];
}
visible: leaveButton.display === PlasmaComponents3.AbstractButton.IconOnly && leaveButton.hovered
}
}
ListView {
id: itemMenuModel
delegate: Item {
property string name: display
property string icon: decoration
property string info: description
property string actionId: favoriteId
Instantiator {
model: Kicker.SystemModel {
id: systemModel
favoritesModel: globalFavorites
}
delegate: PlasmaComponents.MenuItem {
text: model.display
icon: model.decoration
visible: !String(plasmoid.configuration.systemFavorites).includes(model.favoriteId)
onClicked: systemModel.trigger(index, "", "")
}
onObjectAdded: {
contextMenu.addMenuItem(object);
}
model: Kicker.SystemModel { favoritesModel: globalFavorites }
}
PlasmaComponents.Menu {
id: contextMenu
visualParent: itemModel.contentWidth > itemModel.width ? leaveIconButton : leaveButton
Component.onCompleted: {
for (var i = 0; i < itemMenuModel.count; i++) {
contextMenuItemComponent.createObject(contextMenu, { "actionItem" : itemMenuModel.itemAtIndex(i), "index": i });
visualParent: leaveButton
placement: {
switch (plasmoid.location) {
case PlasmaCore.Types.LeftEdge:
case PlasmaCore.Types.RightEdge:
case PlasmaCore.Types.TopEdge:
return PlasmaCore.Types.BottomPosedRightAlignedPopup;
case PlasmaCore.Types.BottomEdge:
default:
return PlasmaCore.Types.TopPosedRightAlignedPopup;
}
}
}
Component {
id: contextMenuItemComponent
PlasmaComponents.MenuItem {
property var actionItem
property int index: -1
text: actionItem && actionItem.name ? actionItem.name : ""
icon: actionItem && actionItem.icon ? actionItem.icon : null
visible: actionItem && !String(plasmoid.configuration.systemFavorites).includes(actionItem.actionId)
onClicked: {
if (index >= 0) {
itemMenuModel.model.trigger(index, "", "")
}
}
Keys.onPressed: {
if (event.key == Qt.Key_Tab && mainTabGroup.state == "top") {
keyboardNavigation.state = "LeftColumn"
root.currentView.forceActiveFocus()
event.accepted = true;
}
}
......
Supports Markdown
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