mirror of
https://github.com/kossLAN/dots.git
synced 2025-11-04 22:49:50 -05:00
extra sizing conditions for sys tray
This commit is contained in:
parent
3c79cc5213
commit
d2149e0705
6 changed files with 147 additions and 73 deletions
|
|
@ -21,27 +21,38 @@ Item {
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
onClicked: {
|
onClicked: {
|
||||||
|
if (root.popup.content == powerMenu) {
|
||||||
|
root.popup.hide();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
root.popup.set(this, powerMenu);
|
root.popup.set(this, powerMenu);
|
||||||
root.popup.show();
|
root.popup.show();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
WrapperItem {
|
Item {
|
||||||
id: powerMenu
|
id: powerMenu
|
||||||
visible: false
|
visible: false
|
||||||
|
implicitWidth: 250
|
||||||
|
implicitHeight: 80
|
||||||
|
|
||||||
ColumnLayout {
|
MouseArea {
|
||||||
RowLayout {
|
anchors.fill: parent
|
||||||
id: powerProfiles
|
onClicked: {
|
||||||
implicitWidth: 300
|
console.log("why this work");
|
||||||
implicitHeight: 60
|
powerMenu.implicitWidth = 300;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// place holder until I figured out what I want to do with material
|
RowLayout {
|
||||||
ComboBox {
|
anchors.fill: parent
|
||||||
model: ["Power Save", "Balanced", "Performance"]
|
|
||||||
currentIndex: PowerProfiles.profile
|
// placeholder for now
|
||||||
onCurrentIndexChanged: PowerProfiles.profile = currentIndex
|
ComboBox {
|
||||||
}
|
model: ["Power Save", "Balanced", "Performance"]
|
||||||
|
currentIndex: PowerProfiles.profile
|
||||||
|
onCurrentIndexChanged: PowerProfiles.profile = currentIndex
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -119,7 +119,7 @@ PopupWindow {
|
||||||
// needed to handle occurences where items are resized while open
|
// needed to handle occurences where items are resized while open
|
||||||
onImplicitWidthChanged: {
|
onImplicitWidthChanged: {
|
||||||
if (root.isOpen && popupContent.data !== []) {
|
if (root.isOpen && popupContent.data !== []) {
|
||||||
console.log("repositioning popup");
|
// console.log("repositioning popup");
|
||||||
let itemPos = root.item.mapToItem(root.bar.contentItem, 0, root.bar.height, root.item.width, 0).x;
|
let itemPos = root.item.mapToItem(root.bar.contentItem, 0, root.bar.height, root.item.width, 0).x;
|
||||||
root.position(itemPos);
|
root.position(itemPos);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -49,6 +49,9 @@ RowLayout {
|
||||||
id: trayMenu
|
id: trayMenu
|
||||||
visible: false
|
visible: false
|
||||||
|
|
||||||
|
property var leftItem: false
|
||||||
|
property var rightItem: false
|
||||||
|
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
id: menuContainer
|
id: menuContainer
|
||||||
spacing: 2
|
spacing: 2
|
||||||
|
|
@ -56,11 +59,13 @@ RowLayout {
|
||||||
Repeater {
|
Repeater {
|
||||||
model: menuOpener.children
|
model: menuOpener.children
|
||||||
|
|
||||||
delegate: TrayMenu {
|
delegate: TrayMenuItem {
|
||||||
id: sysTrayContent
|
id: sysTrayContent
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.fillHeight: true
|
Layout.fillHeight: true
|
||||||
|
|
||||||
|
rootMenu: trayMenu
|
||||||
|
|
||||||
onInteracted: {
|
onInteracted: {
|
||||||
root.popup.hide();
|
root.popup.hide();
|
||||||
menuOpener.menu = null;
|
menuOpener.menu = null;
|
||||||
|
|
|
||||||
|
|
@ -9,8 +9,19 @@ import "../.."
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
id: root
|
id: root
|
||||||
required property QsMenuEntry menuData
|
required property QsMenuEntry menuData
|
||||||
|
required property var rootMenu
|
||||||
signal interacted
|
signal interacted
|
||||||
|
|
||||||
|
Component.onCompleted: {
|
||||||
|
if (menuData?.buttonType !== QsMenuButtonType.None || menuData?.icon != "") {
|
||||||
|
rootMenu.leftItem = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!menuData?.hasChildren) {
|
||||||
|
rootMenu.rightItem = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
WrapperRectangle {
|
WrapperRectangle {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.preferredHeight: 25
|
Layout.preferredHeight: 25
|
||||||
|
|
@ -48,6 +59,7 @@ ColumnLayout {
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
visible: root.rootMenu.leftItem
|
||||||
Layout.preferredWidth: 20
|
Layout.preferredWidth: 20
|
||||||
Layout.fillHeight: true
|
Layout.fillHeight: true
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
|
@ -96,13 +108,14 @@ ColumnLayout {
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
visible: root.rootMenu.rightItem
|
||||||
Layout.preferredHeight: 20
|
Layout.preferredHeight: 20
|
||||||
Layout.preferredWidth: 20
|
Layout.preferredWidth: 20
|
||||||
Layout.rightMargin: 5
|
Layout.rightMargin: 5
|
||||||
|
|
||||||
Widgets.IconButton {
|
Widgets.IconButton {
|
||||||
id: arrowButton
|
id: arrowButton
|
||||||
visible: root.menuData?.hasChildren
|
visible: root.menuData?.hasChildren ?? false
|
||||||
activeRectangle: false
|
activeRectangle: false
|
||||||
source: "root:resources/general/right-arrow.svg"
|
source: "root:resources/general/right-arrow.svg"
|
||||||
rotation: subTrayMenu.visible ? 90 : 0
|
rotation: subTrayMenu.visible ? 90 : 0
|
||||||
|
|
@ -146,9 +159,10 @@ ColumnLayout {
|
||||||
|
|
||||||
delegate: BoundComponent {
|
delegate: BoundComponent {
|
||||||
id: subMenuEntry
|
id: subMenuEntry
|
||||||
source: "TrayMenu.qml"
|
source: "TrayMenuItem.qml"
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
required property var modelData
|
required property var modelData
|
||||||
|
property var rootMenu: root.rootMenu
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -6,6 +6,8 @@ import "../.."
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
id: root
|
id: root
|
||||||
required property QsMenuEntry modelData
|
required property QsMenuEntry modelData
|
||||||
|
required property var rootMenu
|
||||||
|
property var leftItem
|
||||||
signal interacted
|
signal interacted
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
|
|
@ -19,6 +21,7 @@ ColumnLayout {
|
||||||
|
|
||||||
TrayMenuEntry {
|
TrayMenuEntry {
|
||||||
visible: !root.modelData?.isSeparator
|
visible: !root.modelData?.isSeparator
|
||||||
|
rootMenu: root.rootMenu
|
||||||
menuData: root.modelData
|
menuData: root.modelData
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
onInteracted: root.interacted()
|
onInteracted: root.interacted()
|
||||||
|
|
@ -4,8 +4,8 @@ import QtQuick
|
||||||
import QtQuick.Layouts
|
import QtQuick.Layouts
|
||||||
import Qt5Compat.GraphicalEffects
|
import Qt5Compat.GraphicalEffects
|
||||||
import Quickshell
|
import Quickshell
|
||||||
|
import Quickshell.Widgets
|
||||||
import Quickshell.Services.Pipewire
|
import Quickshell.Services.Pipewire
|
||||||
import "../widgets" as Widgets
|
|
||||||
import ".."
|
import ".."
|
||||||
|
|
||||||
Scope {
|
Scope {
|
||||||
|
|
@ -40,14 +40,10 @@ Scope {
|
||||||
active: root.shouldShowOsd
|
active: root.shouldShowOsd
|
||||||
|
|
||||||
PanelWindow {
|
PanelWindow {
|
||||||
// Since the panel's screen is unset, it will be picked by the compositor
|
anchors.right: true
|
||||||
// when the window is created. Most compositors pick the current active monitor.
|
margins.right: 5
|
||||||
|
implicitWidth: 50
|
||||||
anchors.bottom: true
|
implicitHeight: 275
|
||||||
margins.bottom: 300
|
|
||||||
|
|
||||||
implicitWidth: 400
|
|
||||||
implicitHeight: 50
|
|
||||||
color: "transparent"
|
color: "transparent"
|
||||||
|
|
||||||
// An empty click mask prevents the window from blocking mouse events.
|
// An empty click mask prevents the window from blocking mouse events.
|
||||||
|
|
@ -55,65 +51,110 @@ Scope {
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
radius: 8
|
radius: width / 2
|
||||||
color: {
|
color: ShellSettings.settings.colors["surface"]
|
||||||
let color = ShellSettings.settings.colors["surface"];
|
|
||||||
return Qt.rgba(color.r, color.g, color.b, 0.8);
|
|
||||||
}
|
|
||||||
|
|
||||||
RowLayout {
|
Item {
|
||||||
anchors {
|
id: sliderContainer
|
||||||
fill: parent
|
layer.enabled: true
|
||||||
leftMargin: 10
|
layer.effect: OpacityMask {
|
||||||
rightMargin: 15
|
source: Rectangle {
|
||||||
|
width: sliderContainer.width
|
||||||
|
height: sliderContainer.height
|
||||||
|
radius: sliderContainer.width / 2
|
||||||
|
color: "white"
|
||||||
|
}
|
||||||
|
|
||||||
|
maskSource: Rectangle {
|
||||||
|
width: sliderContainer.width
|
||||||
|
height: sliderContainer.height
|
||||||
|
radius: sliderContainer.width / 2
|
||||||
|
color: "black"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Widgets.ColoredIcon {
|
anchors {
|
||||||
implicitSize: 30
|
fill: parent
|
||||||
source: "root:resources/volume/volume-full.svg"
|
margins: 8
|
||||||
color: ShellSettings.settings.colors["inverse_surface"]
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
id: sliderBackground
|
radius: width / 2
|
||||||
Layout.fillWidth: true
|
color: ShellSettings.settings.colors["primary"]
|
||||||
implicitHeight: 10
|
implicitHeight: Math.max(parent.width, parent.height * (Pipewire.defaultAudioSink?.audio.volume ?? 0))
|
||||||
radius: 20
|
|
||||||
color: {
|
anchors {
|
||||||
let color = ShellSettings.settings.colors["inverse_surface"];
|
bottom: parent.bottom
|
||||||
return Qt.rgba(color.r, color.g, color.b, 0.5);
|
left: parent.left
|
||||||
|
right: parent.right
|
||||||
}
|
}
|
||||||
|
|
||||||
layer.enabled: true
|
// replace with material icon
|
||||||
layer.effect: OpacityMask {
|
// IconImage {
|
||||||
source: Rectangle {
|
// implicitSize: parent.width - 4
|
||||||
width: sliderBackground.width
|
// source: "root:resources/volume/volume-full.svg"
|
||||||
height: sliderBackground.height
|
//
|
||||||
radius: sliderBackground.radius
|
// anchors {
|
||||||
color: "white"
|
// horizontalCenter: parent.horizontalCenter
|
||||||
}
|
// }
|
||||||
|
// }
|
||||||
maskSource: Rectangle {
|
|
||||||
width: sliderBackground.width
|
|
||||||
height: sliderBackground.height
|
|
||||||
radius: sliderBackground.radius
|
|
||||||
color: "black"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Rectangle {
|
|
||||||
color: ShellSettings.settings.colors["primary"]
|
|
||||||
anchors {
|
|
||||||
left: parent.left
|
|
||||||
top: parent.top
|
|
||||||
bottom: parent.bottom
|
|
||||||
}
|
|
||||||
|
|
||||||
implicitWidth: parent.width * (Pipewire.defaultAudioSink?.audio.volume ?? 0)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Rectangle {
|
||||||
|
// anchors.fill: parent
|
||||||
|
// radius: 8
|
||||||
|
// color: {
|
||||||
|
// let color = ShellSettings.settings.colors["surface"];
|
||||||
|
// return Qt.rgba(color.r, color.g, color.b, 0.8);
|
||||||
|
// }
|
||||||
|
//
|
||||||
|
// RowLayout {
|
||||||
|
// anchors {
|
||||||
|
// fill: parent
|
||||||
|
// leftMargin: 10
|
||||||
|
// rightMargin: 15
|
||||||
|
// }
|
||||||
|
//
|
||||||
|
// IconImage {
|
||||||
|
// implicitSize: 30
|
||||||
|
// source: "root:resources/volume/volume-full.svg"
|
||||||
|
// }
|
||||||
|
//
|
||||||
|
// Rectangle {
|
||||||
|
// id: sliderBackground
|
||||||
|
// Layout.fillWidth: true
|
||||||
|
// implicitHeight: 10
|
||||||
|
// radius: 20
|
||||||
|
// color: {
|
||||||
|
// let color = ShellSettings.settings.colors["inverse_surface"];
|
||||||
|
// return Qt.rgba(color.r, color.g, color.b, 0.5);
|
||||||
|
// }
|
||||||
|
//
|
||||||
|
// layer.enabled: true
|
||||||
|
// layer.effect: OpacityMask {
|
||||||
|
// maskSource: Rectangle {
|
||||||
|
// width: sliderBackground.width
|
||||||
|
// height: sliderBackground.height
|
||||||
|
// radius: sliderBackground.radius
|
||||||
|
// color: "black"
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
//
|
||||||
|
// Rectangle {
|
||||||
|
// color: ShellSettings.settings.colors["primary"]
|
||||||
|
// anchors {
|
||||||
|
// left: parent.left
|
||||||
|
// top: parent.top
|
||||||
|
// bottom: parent.bottom
|
||||||
|
// }
|
||||||
|
//
|
||||||
|
// implicitWidth: parent.width * (Pipewire.defaultAudioSink?.audio.volume ?? 0)
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue