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
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
if (root.popup.content == powerMenu) {
|
||||
root.popup.hide();
|
||||
return;
|
||||
}
|
||||
|
||||
root.popup.set(this, powerMenu);
|
||||
root.popup.show();
|
||||
}
|
||||
}
|
||||
|
||||
WrapperItem {
|
||||
Item {
|
||||
id: powerMenu
|
||||
visible: false
|
||||
implicitWidth: 250
|
||||
implicitHeight: 80
|
||||
|
||||
ColumnLayout {
|
||||
RowLayout {
|
||||
id: powerProfiles
|
||||
implicitWidth: 300
|
||||
implicitHeight: 60
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
console.log("why this work");
|
||||
powerMenu.implicitWidth = 300;
|
||||
}
|
||||
}
|
||||
|
||||
// place holder until I figured out what I want to do with material
|
||||
ComboBox {
|
||||
model: ["Power Save", "Balanced", "Performance"]
|
||||
currentIndex: PowerProfiles.profile
|
||||
onCurrentIndexChanged: PowerProfiles.profile = currentIndex
|
||||
}
|
||||
RowLayout {
|
||||
anchors.fill: parent
|
||||
|
||||
// placeholder for now
|
||||
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
|
||||
onImplicitWidthChanged: {
|
||||
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;
|
||||
root.position(itemPos);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -49,6 +49,9 @@ RowLayout {
|
|||
id: trayMenu
|
||||
visible: false
|
||||
|
||||
property var leftItem: false
|
||||
property var rightItem: false
|
||||
|
||||
ColumnLayout {
|
||||
id: menuContainer
|
||||
spacing: 2
|
||||
|
|
@ -56,11 +59,13 @@ RowLayout {
|
|||
Repeater {
|
||||
model: menuOpener.children
|
||||
|
||||
delegate: TrayMenu {
|
||||
delegate: TrayMenuItem {
|
||||
id: sysTrayContent
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
|
||||
rootMenu: trayMenu
|
||||
|
||||
onInteracted: {
|
||||
root.popup.hide();
|
||||
menuOpener.menu = null;
|
||||
|
|
|
|||
|
|
@ -9,8 +9,19 @@ import "../.."
|
|||
ColumnLayout {
|
||||
id: root
|
||||
required property QsMenuEntry menuData
|
||||
required property var rootMenu
|
||||
signal interacted
|
||||
|
||||
Component.onCompleted: {
|
||||
if (menuData?.buttonType !== QsMenuButtonType.None || menuData?.icon != "") {
|
||||
rootMenu.leftItem = true;
|
||||
}
|
||||
|
||||
if (!menuData?.hasChildren) {
|
||||
rootMenu.rightItem = false;
|
||||
}
|
||||
}
|
||||
|
||||
WrapperRectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 25
|
||||
|
|
@ -48,6 +59,7 @@ ColumnLayout {
|
|||
Layout.fillWidth: true
|
||||
|
||||
Item {
|
||||
visible: root.rootMenu.leftItem
|
||||
Layout.preferredWidth: 20
|
||||
Layout.fillHeight: true
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
|
|
@ -96,13 +108,14 @@ ColumnLayout {
|
|||
}
|
||||
|
||||
Item {
|
||||
visible: root.rootMenu.rightItem
|
||||
Layout.preferredHeight: 20
|
||||
Layout.preferredWidth: 20
|
||||
Layout.rightMargin: 5
|
||||
|
||||
Widgets.IconButton {
|
||||
id: arrowButton
|
||||
visible: root.menuData?.hasChildren
|
||||
visible: root.menuData?.hasChildren ?? false
|
||||
activeRectangle: false
|
||||
source: "root:resources/general/right-arrow.svg"
|
||||
rotation: subTrayMenu.visible ? 90 : 0
|
||||
|
|
@ -146,9 +159,10 @@ ColumnLayout {
|
|||
|
||||
delegate: BoundComponent {
|
||||
id: subMenuEntry
|
||||
source: "TrayMenu.qml"
|
||||
source: "TrayMenuItem.qml"
|
||||
Layout.fillWidth: true
|
||||
required property var modelData
|
||||
property var rootMenu: root.rootMenu
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,6 +6,8 @@ import "../.."
|
|||
ColumnLayout {
|
||||
id: root
|
||||
required property QsMenuEntry modelData
|
||||
required property var rootMenu
|
||||
property var leftItem
|
||||
signal interacted
|
||||
|
||||
Rectangle {
|
||||
|
|
@ -19,6 +21,7 @@ ColumnLayout {
|
|||
|
||||
TrayMenuEntry {
|
||||
visible: !root.modelData?.isSeparator
|
||||
rootMenu: root.rootMenu
|
||||
menuData: root.modelData
|
||||
Layout.fillWidth: true
|
||||
onInteracted: root.interacted()
|
||||
|
|
@ -4,8 +4,8 @@ import QtQuick
|
|||
import QtQuick.Layouts
|
||||
import Qt5Compat.GraphicalEffects
|
||||
import Quickshell
|
||||
import Quickshell.Widgets
|
||||
import Quickshell.Services.Pipewire
|
||||
import "../widgets" as Widgets
|
||||
import ".."
|
||||
|
||||
Scope {
|
||||
|
|
@ -40,14 +40,10 @@ Scope {
|
|||
active: root.shouldShowOsd
|
||||
|
||||
PanelWindow {
|
||||
// Since the panel's screen is unset, it will be picked by the compositor
|
||||
// when the window is created. Most compositors pick the current active monitor.
|
||||
|
||||
anchors.bottom: true
|
||||
margins.bottom: 300
|
||||
|
||||
implicitWidth: 400
|
||||
implicitHeight: 50
|
||||
anchors.right: true
|
||||
margins.right: 5
|
||||
implicitWidth: 50
|
||||
implicitHeight: 275
|
||||
color: "transparent"
|
||||
|
||||
// An empty click mask prevents the window from blocking mouse events.
|
||||
|
|
@ -55,65 +51,110 @@ Scope {
|
|||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
radius: 8
|
||||
color: {
|
||||
let color = ShellSettings.settings.colors["surface"];
|
||||
return Qt.rgba(color.r, color.g, color.b, 0.8);
|
||||
}
|
||||
radius: width / 2
|
||||
color: ShellSettings.settings.colors["surface"]
|
||||
|
||||
RowLayout {
|
||||
anchors {
|
||||
fill: parent
|
||||
leftMargin: 10
|
||||
rightMargin: 15
|
||||
Item {
|
||||
id: sliderContainer
|
||||
layer.enabled: true
|
||||
layer.effect: OpacityMask {
|
||||
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 {
|
||||
implicitSize: 30
|
||||
source: "root:resources/volume/volume-full.svg"
|
||||
color: ShellSettings.settings.colors["inverse_surface"]
|
||||
anchors {
|
||||
fill: parent
|
||||
margins: 8
|
||||
}
|
||||
|
||||
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);
|
||||
radius: width / 2
|
||||
color: ShellSettings.settings.colors["primary"]
|
||||
implicitHeight: Math.max(parent.width, parent.height * (Pipewire.defaultAudioSink?.audio.volume ?? 0))
|
||||
|
||||
anchors {
|
||||
bottom: parent.bottom
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
}
|
||||
|
||||
layer.enabled: true
|
||||
layer.effect: OpacityMask {
|
||||
source: Rectangle {
|
||||
width: sliderBackground.width
|
||||
height: sliderBackground.height
|
||||
radius: sliderBackground.radius
|
||||
color: "white"
|
||||
}
|
||||
|
||||
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)
|
||||
}
|
||||
// replace with material icon
|
||||
// IconImage {
|
||||
// implicitSize: parent.width - 4
|
||||
// source: "root:resources/volume/volume-full.svg"
|
||||
//
|
||||
// anchors {
|
||||
// horizontalCenter: parent.horizontalCenter
|
||||
// }
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 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