more android-looking top panel

This commit is contained in:
Marco Martin 2019-10-14 17:51:44 +02:00
parent 58510d211d
commit 4543b7724c
2 changed files with 46 additions and 31 deletions

View file

@ -20,16 +20,18 @@
import QtQuick 2.1 import QtQuick 2.1
import QtQuick.Layouts 1.1 import QtQuick.Layouts 1.1
import org.kde.plasma.core 2.0 as PlasmaCore import org.kde.plasma.core 2.0 as PlasmaCore
import org.kde.plasma.components 2.0 as PlasmaComponents import org.kde.plasma.components 3.0 as PlasmaComponents
RowLayout { ColumnLayout {
id: delegateRoot id: delegateRoot
property bool toggled: model.enabled property bool toggled: model.enabled
spacing: units.smallSpacing spacing: units.smallSpacing
implicitWidth: flow.width / 2 - units.largeSpacing / 2
Rectangle { Rectangle {
Layout.minimumWidth: units.iconSizes.medium Layout.preferredWidth: units.iconSizes.large + units.smallSpacing * 6
Layout.minimumHeight: width Layout.minimumHeight: width
Layout.alignment: Qt.AlignHCenter
radius: width
color: toggled ? color: toggled ?
Qt.rgba(PlasmaCore.ColorScope.highlightColor.r, PlasmaCore.ColorScope.highlightColor.g, PlasmaCore.ColorScope.highlightColor.b, iconMouseArea.pressed ? 0.5 : 0.3) : Qt.rgba(PlasmaCore.ColorScope.highlightColor.r, PlasmaCore.ColorScope.highlightColor.g, PlasmaCore.ColorScope.highlightColor.b, iconMouseArea.pressed ? 0.5 : 0.3) :
Qt.rgba(PlasmaCore.ColorScope.textColor.r, PlasmaCore.ColorScope.textColor.g, PlasmaCore.ColorScope.textColor.b, iconMouseArea.pressed ? 0.5 : 0.1) Qt.rgba(PlasmaCore.ColorScope.textColor.r, PlasmaCore.ColorScope.textColor.g, PlasmaCore.ColorScope.textColor.b, iconMouseArea.pressed ? 0.5 : 0.1)
@ -38,16 +40,14 @@ RowLayout {
colorGroup: PlasmaCore.ColorScope.colorGroup colorGroup: PlasmaCore.ColorScope.colorGroup
anchors { anchors {
fill: parent fill: parent
margins: units.smallSpacing margins: units.smallSpacing * 3
} }
source: model.icon source: model.icon
MouseArea { MouseArea {
id: iconMouseArea id: iconMouseArea
anchors.fill: parent anchors.fill: parent
onClicked: { onClicked: {
if (model.applet) { if (delegateRoot.toggle) {
model.applet.expanded = !model.applet.expanded;
} else if (delegateRoot.toggle) {
delegateRoot.toggle(); delegateRoot.toggle();
} else if (model.toggleFunction) { } else if (model.toggleFunction) {
root[model.toggleFunction](); root[model.toggleFunction]();
@ -58,29 +58,42 @@ RowLayout {
} }
} }
} }
Rectangle {
Layout.fillWidth: true PlasmaComponents.Label {
Layout.fillHeight: true id: label
color: Qt.rgba(PlasmaCore.ColorScope.textColor.r, PlasmaCore.ColorScope.textColor.g, PlasmaCore.ColorScope.textColor.b, labelMouseArea.pressed ? 0.5 : 0.1)
PlasmaComponents.Label { Layout.maximumWidth: parent.width
Layout.alignment: Qt.AlignHCenter
text: model.text
bottomPadding: units.smallSpacing * 2
horizontalAlignment: Text.AlignHCenter
font.pixelSize: theme.defaultFont.pixelSize * 0.8
elide: Text.ElideRight
verticalAlignment: Text.AlignVCenter
PlasmaCore.SvgItem {
anchors { anchors {
fill: parent left: parent.right
margins: units.smallSpacing verticalCenter: parent.verticalCenter
verticalCenterOffset: -units.smallSpacing
} }
text: model.text visible: model.settingsCommand
elide: Text.ElideRight width: units.iconSizes.small/2
verticalAlignment: Text.AlignVCenter height: width
MouseArea { elementId: "down-arrow"
id: labelMouseArea svg: PlasmaCore.Svg {
anchors.fill: parent imagePath: "widgets/arrows"
onClicked: { }
if (model.applet) { }
model.applet.expanded = !model.applet.expanded; MouseArea {
} else if (model.settingsCommand) { id: labelMouseArea
plasmoid.nativeInterface.executeCommand(model.settingsCommand); anchors.fill: parent
} else if (model.toggleFunction) { onClicked: {
root[model.toggleFunction](); if (model.settingsCommand) {
} plasmoid.nativeInterface.executeCommand(model.settingsCommand);
} else if (model.toggleFunction) {
root[model.toggleFunction]();
} }
} }
} }

View file

@ -185,12 +185,14 @@ Item {
fill: parent fill: parent
margins: units.smallSpacing*3 margins: units.smallSpacing*3
} }
spacing: units.largeSpacing readonly property real cellSizeHint: units.iconSizes.large + units.smallSpacing * 6 + Math.floor(units.largeSpacing/2)
readonly property real columnWidth: Math.floor(width / Math.floor(width / cellSizeHint))
spacing: 0
Repeater { Repeater {
model: settingsModel model: settingsModel
delegate: Loader { delegate: Loader {
//FIXME: why this is needed? //FIXME: why this is needed?
width: flow.width / 2 - units.largeSpacing / 2//item ? item.implicitWidth : 0 width: flow.columnWidth
height: item ? item.implicitHeight : 0 height: item ? item.implicitHeight : 0
source: Qt.resolvedUrl((model.delegate ? model.delegate : "Delegate") + ".qml") source: Qt.resolvedUrl((model.delegate ? model.delegate : "Delegate") + ".qml")
} }