TrayMenu: use NPanel instead of PopupWindow

Tray, TrayDropdownPanel: use new TrayMenu
NPanel: expose animation options
shell: add TrayMenu component
i18n: add TrayMenu sub menu translation
This commit is contained in:
Ly-sec
2025-11-06 11:49:47 +01:00
parent f9ebe1bb4e
commit afde67bcb9
13 changed files with 621 additions and 462 deletions
+2 -1
View File
@@ -777,7 +777,8 @@
"placeholder": "z.B., nm-applet, Fcitx*"
},
"pin-application": "Anwendung anheften",
"unpin-application": "Anheftung aufheben"
"unpin-application": "Anheftung aufheben",
"back": "Zurück"
},
"widgets": {
"section": {
+2 -1
View File
@@ -777,7 +777,8 @@
"placeholder": "e.g., nm-applet, Fcitx*"
},
"pin-application": "Pin Application",
"unpin-application": "Unpin Application"
"unpin-application": "Unpin Application",
"back": "Back"
},
"widgets": {
"section": {
+2 -1
View File
@@ -777,7 +777,8 @@
"placeholder": "ej., nm-applet, Fcitx*"
},
"pin-application": "Fijar Aplicación",
"unpin-application": "Desfijar Aplicación"
"unpin-application": "Desfijar Aplicación",
"back": "Atrás"
},
"widgets": {
"section": {
+2 -1
View File
@@ -777,7 +777,8 @@
"placeholder": "ex: nm-applet, Fcitx*"
},
"pin-application": "Épingler l'Application",
"unpin-application": "Désépingler l'Application"
"unpin-application": "Désépingler l'Application",
"back": "Retour"
},
"widgets": {
"section": {
+2 -1
View File
@@ -777,7 +777,8 @@
"placeholder": "ex: nm-applet, Fcitx*"
},
"pin-application": "Fixar Aplicativo",
"unpin-application": "Desfixar Aplicativo"
"unpin-application": "Desfixar Aplicativo",
"back": "Voltar"
},
"widgets": {
"section": {
+2 -1
View File
@@ -777,7 +777,8 @@
"placeholder": "örn., nm-applet, Fcitx*"
},
"pin-application": "Uygulamayı Sabitle",
"unpin-application": "Sabitlemeyi Kaldır"
"unpin-application": "Sabitlemeyi Kaldır",
"back": "Geri"
},
"widgets": {
"section": {
+2 -1
View File
@@ -777,7 +777,8 @@
"placeholder": "напр., nm-applet, Fcitx*"
},
"pin-application": "Закріпити Застосунок",
"unpin-application": "Відкріпити Застосунок"
"unpin-application": "Відкріпити Застосунок",
"back": "Назад"
},
"widgets": {
"section": {
+2 -1
View File
@@ -777,7 +777,8 @@
"placeholder": "例如:nm-applet, Fcitx*"
},
"pin-application": "固定应用程序",
"unpin-application": "取消固定应用程序"
"unpin-application": "取消固定应用程序",
"back": "返回"
},
"widgets": {
"section": {
+10 -16
View File
@@ -144,15 +144,15 @@ NPanel {
onClicked: mouse => {
if (!modelData)
return
if (mouse.button === Qt.RightButton && modelData.hasMenu && modelData.menu && trayMenu.item) {
trayMenu.item.menu = modelData.menu
trayMenu.item.screen = root.screen
trayMenu.item.trayItem = modelData
trayMenu.item.widgetSection = root.widgetSection
trayMenu.item.widgetIndex = root.widgetIndex
const menuX = (root.columns > 1) ? (trayIcon.width / 2) : 0
const menuY = trayIcon.height
trayMenu.item.showAt(trayIcon, menuX, menuY)
if (mouse.button === Qt.RightButton && modelData.hasMenu && modelData.menu) {
const panel = PanelService.getPanel("trayMenu", root.screen)
if (panel) {
panel.menu = modelData.menu
panel.trayItem = modelData
panel.widgetSection = root.widgetSection
panel.widgetIndex = root.widgetIndex
panel.openAt(trayIcon)
}
} else if (mouse.button === Qt.LeftButton) {
modelData.activate()
// Close the dropdown after activation
@@ -178,12 +178,6 @@ NPanel {
}
}
// Tray menu host
Loader {
id: trayMenu
asynchronous: false
active: true
source: "TrayMenu.qml"
}
// (Tray menu now uses dedicated TrayMenu via PanelService)
}
}
+355 -194
View File
@@ -6,81 +6,73 @@ import qs.Commons
import qs.Services
import qs.Widgets
PopupWindow {
NPanel {
id: root
objectName: "trayMenu"
// Avoid bouncy feel: keep fade but disable scale/slide transforms
disableScaleAnimation: true
disableSlideAnimation: false
customSlideDistance: 100
// Inputs
property QsMenuHandle menu
property var anchorItem: null
property real anchorX
property real anchorY
property bool isSubMenu: false
property bool isHovered: rootMouseArea.containsMouse
property ShellScreen screen
// Properties for adding tray item to favorites
property var trayItem: null
property string widgetSection: ""
property int widgetIndex: -1
// Internal
readonly property int menuWidth: 240
preferredWidth: menuWidth
// Height is content-driven via panelContent
implicitWidth: menuWidth
// Use the content height of the Flickable for implicit height
implicitHeight: Math.min(screen ? screen.height * 0.9 : Screen.height * 0.9, flickable.contentHeight + (Style.marginS * 2))
visible: false
color: Color.transparent
anchor.item: anchorItem
anchor.rect.x: anchorX
anchor.rect.y: anchorY - (isSubMenu ? 0 : 4)
function showAt(item, x, y) {
if (!item) {
Logger.w("TrayMenu", "anchorItem is undefined, won't show menu.")
return
// Open positioned relative to button
function openAt(buttonItem) {
open(buttonItem)
}
if (!opener.children || opener.children.values.length === 0) {
//Logger.w("TrayMenu", "Menu not ready, delaying show")
Qt.callLater(() => showAt(item, x, y))
return
panelContent: Item {
id: content
// Track currently open submenu
property var activeSubMenu: null
property var activeSubMenuEntry: null
property bool subMenuOpenLeft: false
// If true, show submenu in place (replace main menu) instead of side-by-side
property bool inPlaceSubmenu: true
// Let NPanel size to our content
readonly property real contentPreferredWidth: root.menuWidth + ((activeSubMenu && !inPlaceSubmenu) ? root.menuWidth : 0)
readonly property real contentPreferredHeight: {
// If showing submenu in-place, size to the submenu's flickable content height
if (activeSubMenu && inPlaceSubmenu) {
const subFlickable = inPlaceSubMenuLoader.item?.children[1] // Flickable is the second child (after MouseArea)
const subHeight = subFlickable?.contentHeight || 0
return Math.min(root.screen ? root.screen.height * 0.9 : Screen.height * 0.9, subHeight + (Style.marginS * 2))
}
anchorItem = item
anchorX = x
anchorY = y
visible = true
forceActiveFocus()
// Force update after showing.
Qt.callLater(() => {
root.anchor.updateAnchor()
})
const mainHeight = mainFlickable.contentHeight
let subHeight = 0
if (activeSubMenu && !inPlaceSubmenu) {
const subLoader = subMenuOpenLeft ? leftSubMenuLoader : rightSubMenuLoader
const subFlickable = subLoader.item?.children[1] // Flickable is the second child (after MouseArea)
subHeight = subFlickable?.contentHeight || 0
}
return Math.min(root.screen ? root.screen.height * 0.9 : Screen.height * 0.9, Math.max(mainHeight, subHeight) + (Style.marginS * 2))
}
function hideMenu() {
visible = false
// Expose mask region for click-through
property alias maskRegion: background
// Clean up all submenus recursively
for (var i = 0; i < columnLayout.children.length; i++) {
const child = columnLayout.children[i]
if (child?.subMenu) {
child.subMenu.hideMenu()
child.subMenu.destroy()
child.subMenu = null
}
}
}
// Full-sized, transparent MouseArea to track the mouse.
MouseArea {
id: rootMouseArea
anchors.fill: parent
hoverEnabled: true
}
Item {
anchors.fill: parent
Keys.onEscapePressed: root.hideMenu()
Rectangle {
id: background
x: 0
y: 0
width: content.contentPreferredWidth
height: content.contentPreferredHeight
color: Color.mSurface
radius: Style.radiusM
}
QsMenuOpener {
@@ -88,25 +80,269 @@ PopupWindow {
menu: root.menu
}
Rectangle {
// Submenu component (reusable for left/right placement)
Component {
id: subMenuComponent
Item {
id: subMenuContainer
// MouseArea to track hover for submenu (covers entire submenu area)
MouseArea {
id: subMenuMouseArea
anchors.fill: parent
color: Color.mSurface
border.color: Color.mOutline
border.width: Style.borderS
radius: Style.radiusM
hoverEnabled: true
enabled: content.activeSubMenu !== null && !content.inPlaceSubmenu
visible: !content.inPlaceSubmenu
z: 1
acceptedButtons: Qt.NoButton // Don't intercept clicks, just track hover
onExited: {
if (content.inPlaceSubmenu)
return
Qt.callLater(() => {
if (!subMenuMouseArea.containsMouse && content.activeSubMenuEntry) {
// Find the mouseArea in the entry (it's in the second Rectangle's MouseArea)
let entryMouseArea = null
for (var i = 0; i < content.activeSubMenuEntry.children.length; i++) {
const child = content.activeSubMenuEntry.children[i]
if (child && child.children && child.children.length > 0) {
for (var j = 0; j < child.children.length; j++) {
const grandchild = child.children[j]
if (grandchild && grandchild.hoverEnabled !== undefined) {
entryMouseArea = grandchild
break
}
}
}
if (entryMouseArea)
break
}
if (!entryMouseArea || !entryMouseArea.containsMouse) {
content.activeSubMenu = null
content.activeSubMenuEntry = null
}
}
})
}
}
Flickable {
id: flickable
id: subMenuFlickable
anchors.fill: parent
anchors.margins: Style.marginS
contentHeight: columnLayout.implicitHeight
contentHeight: subMenuColumnLayout.implicitHeight
interactive: true
z: 0
// Use a ColumnLayout to handle menu item arrangement
ColumnLayout {
id: columnLayout
width: flickable.width
id: subMenuColumnLayout
width: subMenuFlickable.width
spacing: 0
QsMenuOpener {
id: subMenuOpener
menu: content.activeSubMenu
}
// Back button (only shown when submenu is in-place)
Rectangle {
id: backEntry
visible: content.inPlaceSubmenu
Layout.preferredWidth: parent.width
Layout.preferredHeight: visible ? 28 : 0
color: Color.transparent
Rectangle {
anchors.fill: parent
color: backMouseArea.containsMouse ? Color.mHover : Color.transparent
radius: Style.radiusS
RowLayout {
anchors.fill: parent
anchors.leftMargin: Style.marginM
anchors.rightMargin: Style.marginM
spacing: Style.marginS
NIcon {
icon: "arrow-left"
pointSize: Style.fontSizeS
applyUiScale: false
verticalAlignment: Text.AlignVCenter
color: backMouseArea.containsMouse ? Color.mOnHover : Color.mOnSurface
}
NText {
Layout.fillWidth: true
color: backMouseArea.containsMouse ? Color.mOnHover : Color.mOnSurface
text: I18n.tr("settings.bar.tray.back")
pointSize: Style.fontSizeS
verticalAlignment: Text.AlignVCenter
elide: Text.ElideRight
}
}
MouseArea {
id: backMouseArea
anchors.fill: parent
hoverEnabled: true
onClicked: {
content.activeSubMenu = null
content.activeSubMenuEntry = null
}
}
}
}
Rectangle {
visible: content.inPlaceSubmenu
Layout.preferredWidth: parent.width
Layout.preferredHeight: visible ? 8 : 0
color: Color.transparent
NDivider {
anchors.centerIn: parent
width: parent.width - (Style.marginM * 2)
visible: parent.visible
}
}
Repeater {
model: subMenuOpener.children ? [...subMenuOpener.children.values] : []
delegate: Rectangle {
id: subEntry
required property var modelData
Layout.preferredWidth: parent.width
Layout.preferredHeight: {
if (modelData?.isSeparator) {
return 8
} else {
return 28
}
}
color: Color.transparent
NDivider {
anchors.centerIn: parent
width: parent.width - (Style.marginM * 2)
visible: modelData?.isSeparator ?? false
}
Rectangle {
anchors.fill: parent
color: subMouseArea.containsMouse ? Color.mHover : Color.transparent
radius: Style.radiusS
visible: !(modelData?.isSeparator ?? false)
RowLayout {
anchors.fill: parent
anchors.leftMargin: Style.marginM
anchors.rightMargin: Style.marginM
spacing: Style.marginS
NText {
Layout.fillWidth: true
color: (modelData?.enabled ?? true) ? (subMouseArea.containsMouse ? Color.mOnHover : Color.mOnSurface) : Color.mOnSurfaceVariant
text: modelData?.text !== "" ? modelData?.text.replace(/[\n\r]+/g, ' ') : "..."
pointSize: Style.fontSizeS
verticalAlignment: Text.AlignVCenter
elide: Text.ElideRight
}
Image {
Layout.preferredWidth: Style.marginL
Layout.preferredHeight: Style.marginL
source: modelData?.icon ?? ""
visible: (modelData?.icon ?? "") !== ""
fillMode: Image.PreserveAspectFit
}
NIcon {
icon: modelData?.hasChildren ? "menu" : ""
pointSize: Style.fontSizeS
applyUiScale: false
verticalAlignment: Text.AlignVCenter
visible: modelData?.hasChildren ?? false
color: (subMouseArea.containsMouse ? Color.mOnHover : Color.mOnSurface)
}
}
MouseArea {
id: subMouseArea
anchors.fill: parent
hoverEnabled: true
enabled: (modelData?.enabled ?? true) && !(modelData?.isSeparator ?? false)
onClicked: {
if (!modelData || modelData.isSeparator)
return
if (modelData.hasChildren) {
// Toggle nested submenu on click
if (content.activeSubMenu === modelData) {
// If already open, close it on second click
content.activeSubMenu = null
content.activeSubMenuEntry = null
return
}
// Open nested submenu in place
content.activeSubMenu = modelData
content.activeSubMenuEntry = null // No entry for nested submenus
content.inPlaceSubmenu = true
} else {
modelData.triggered()
root.close()
}
}
}
}
}
}
}
}
}
}
// Main menu and submenu side by side
RowLayout {
id: rowLayout
anchors.fill: background
anchors.margins: Style.marginS
spacing: 0
// Submenu on the left (when subMenuOpenLeft is true and not replacing)
Loader {
id: leftSubMenuLoader
Layout.preferredWidth: (content.activeSubMenu && content.subMenuOpenLeft && !content.inPlaceSubmenu) ? root.menuWidth : 0
Layout.fillHeight: true
visible: content.activeSubMenu !== null && content.subMenuOpenLeft && !content.inPlaceSubmenu
sourceComponent: subMenuComponent
}
// Submenu replacing main menu (in-place)
Loader {
id: inPlaceSubMenuLoader
Layout.preferredWidth: (content.activeSubMenu && content.inPlaceSubmenu) ? root.menuWidth : 0
Layout.fillHeight: true
visible: content.activeSubMenu !== null && content.inPlaceSubmenu
sourceComponent: subMenuComponent
}
// Main menu
Flickable {
id: mainFlickable
Layout.preferredWidth: root.menuWidth
Layout.fillHeight: true
contentHeight: mainColumnLayout.implicitHeight
interactive: true
visible: !(content.activeSubMenu !== null && content.inPlaceSubmenu)
ColumnLayout {
id: mainColumnLayout
width: mainFlickable.width
spacing: 0
Repeater {
@@ -126,7 +362,6 @@ PopupWindow {
}
color: Color.transparent
property var subMenu: null
NDivider {
anchors.centerIn: parent
@@ -178,110 +413,61 @@ PopupWindow {
id: mouseArea
anchors.fill: parent
hoverEnabled: true
enabled: (modelData?.enabled ?? true) && !(modelData?.isSeparator ?? false) && root.visible
enabled: (modelData?.enabled ?? true) && !(modelData?.isSeparator ?? false)
onClicked: {
if (modelData && !modelData.isSeparator && !modelData.hasChildren) {
modelData.triggered()
root.hideMenu()
}
}
onEntered: {
if (!root.visible)
if (!modelData || modelData.isSeparator)
return
// Close all sibling submenus
for (var i = 0; i < columnLayout.children.length; i++) {
const sibling = columnLayout.children[i]
if (sibling !== entry && sibling?.subMenu) {
sibling.subMenu.hideMenu()
sibling.subMenu.destroy()
sibling.subMenu = null
}
if (modelData.hasChildren) {
// Toggle submenu on click
if (content.activeSubMenuEntry === entry && content.inPlaceSubmenu) {
// If already open in-place, close it on second click
content.activeSubMenu = null
content.activeSubMenuEntry = null
return
}
// Create submenu if needed
if (modelData?.hasChildren) {
if (entry.subMenu) {
entry.subMenu.hideMenu()
entry.subMenu.destroy()
// Close any other open submenu
if (content.activeSubMenuEntry && content.activeSubMenuEntry !== entry) {
content.activeSubMenu = null
content.activeSubMenuEntry = null
}
// Need a slight overlap so that menu don't close when moving the mouse to a submenu
const submenuWidth = menuWidth // Assuming a similar width as the parent
const overlap = 4 // A small overlap to bridge the mouse path
// Determine submenu opening direction based on bar position and available space
let openLeft = false
// Check bar position first
const barPosition = Settings.data.bar.position
const globalPos = entry.mapToItem(null, 0, 0)
if (barPosition === "right") {
// Bar is on the right, prefer opening submenus to the left
openLeft = true
} else if (barPosition === "left") {
// Bar is on the left, prefer opening submenus to the right
openLeft = false
// Open submenu in place (replace main menu)
content.activeSubMenu = modelData
content.activeSubMenuEntry = entry
content.inPlaceSubmenu = true
} else {
// Bar is horizontal (top/bottom) or undefined, use space-based logic
openLeft = (globalPos.x + entry.width + submenuWidth > screen.width)
// Secondary check: ensure we don't open off-screen
if (openLeft && globalPos.x - submenuWidth < 0) {
// Would open off the left edge, force right opening
openLeft = false
} else if (!openLeft && globalPos.x + entry.width + submenuWidth > screen.width) {
// Would open off the right edge, force left opening
openLeft = true
}
}
// Position with overlap
const anchorX = openLeft ? -submenuWidth + overlap : entry.width - overlap
// Create submenu
entry.subMenu = Qt.createComponent("TrayMenu.qml").createObject(root, {
"menu": modelData,
"anchorItem": entry,
"anchorX": anchorX,
"anchorY": 0,
"isSubMenu": true,
"screen": screen
})
if (entry.subMenu) {
entry.subMenu.showAt(entry, anchorX, 0)
}
modelData.triggered()
root.close()
}
}
onExited: {
if (content.inPlaceSubmenu)
return
// Don't close immediately - let submenu handle its own hover
Qt.callLater(() => {
if (entry.subMenu && !entry.subMenu.isHovered) {
entry.subMenu.hideMenu()
entry.subMenu.destroy()
entry.subMenu = null
// Only close if mouse is not in submenu area
if (content.activeSubMenuEntry === entry) {
const subMenuLoader = content.subMenuOpenLeft ? leftSubMenuLoader : rightSubMenuLoader
// The MouseArea is the first child of the Item (subMenuContainer)
const subMenuMouseArea = subMenuLoader.item?.children[0]
if (!subMenuMouseArea || !subMenuMouseArea.containsMouse) {
content.activeSubMenu = null
content.activeSubMenuEntry = null
}
}
})
}
}
}
Component.onDestruction: {
if (subMenu) {
subMenu.destroy()
subMenu = null
}
}
}
}
// Separator before custom menu item
Rectangle {
visible: !root.isSubMenu && root.trayItem !== null && root.widgetSection !== "" && root.widgetIndex >= 0
visible: root.trayItem !== null && root.widgetSection !== "" && root.widgetIndex >= 0
Layout.preferredWidth: parent.width
Layout.preferredHeight: visible ? 8 : 0
color: Color.transparent
@@ -293,29 +479,25 @@ PopupWindow {
}
}
// Custom "Add/Remove Favorite" menu item (only for non-submenus with tray item info)
Rectangle {
id: addToFavoriteEntry
visible: !root.isSubMenu && root.trayItem !== null && root.widgetSection !== "" && root.widgetIndex >= 0
visible: root.trayItem !== null && root.widgetSection !== "" && root.widgetIndex >= 0
Layout.preferredWidth: parent.width
Layout.preferredHeight: visible ? 28 : 0
color: Color.transparent
// Check if item is already a favorite
readonly property bool isFavorite: {
if (!root.trayItem || root.widgetSection === "" || root.widgetIndex < 0)
return false
const itemName = root.trayItem.tooltipTitle || root.trayItem.name || root.trayItem.id || ""
if (!itemName)
return false
var widgets = Settings.data.bar.widgets[root.widgetSection]
if (!widgets || root.widgetIndex >= widgets.length)
return false
var widgetSettings = widgets[root.widgetIndex]
if (!widgetSettings || widgetSettings.id !== "Tray")
return false
var favorites = widgetSettings.favorites || []
for (var i = 0; i < favorites.length; i++) {
if (favorites[i] === itemName)
@@ -360,7 +542,6 @@ PopupWindow {
id: addToFavoriteMouseArea
anchors.fill: parent
hoverEnabled: true
enabled: root.visible
onClicked: {
if (addToFavoriteEntry.isFavorite) {
@@ -368,7 +549,7 @@ PopupWindow {
} else {
root.addToFavorites()
}
root.hideMenu()
root.close()
}
}
}
@@ -376,105 +557,85 @@ PopupWindow {
}
}
// Submenu on the right (when subMenuOpenLeft is false and not replacing)
Loader {
id: rightSubMenuLoader
Layout.preferredWidth: (content.activeSubMenu && !content.subMenuOpenLeft && !content.inPlaceSubmenu) ? root.menuWidth : 0
Layout.fillHeight: true
visible: content.activeSubMenu !== null && !content.subMenuOpenLeft && !content.inPlaceSubmenu
sourceComponent: subMenuComponent
}
}
Keys.onEscapePressed: root.close()
}
function addToFavorites() {
if (!trayItem || widgetSection === "" || widgetIndex < 0) {
Logger.w("TrayMenu", "Cannot add as favorite: missing tray item or widget info")
return
}
// Get the tray item name
const itemName = trayItem.tooltipTitle || trayItem.name || trayItem.id || ""
if (!itemName) {
Logger.w("TrayMenu", "Cannot add as favorite: tray item has no name")
return
}
// Get current widget settings
var widgets = Settings.data.bar.widgets[widgetSection]
if (!widgets || widgetIndex >= widgets.length) {
Logger.w("TrayMenu", "Cannot add as favorite: invalid widget index")
return
}
var widgetSettings = widgets[widgetIndex]
if (!widgetSettings || widgetSettings.id !== "Tray") {
Logger.w("TrayMenu", "Cannot add as favorite: widget is not a Tray widget")
return
}
// Get current favorites list
var favorites = widgetSettings.favorites || []
// Add to favorites
var newFavorites = favorites.slice()
newFavorites.push(itemName)
// Update widget settings
var newSettings = Object.assign({}, widgetSettings)
newSettings.favorites = newFavorites
// Update settings
widgets[widgetIndex] = newSettings
Settings.data.bar.widgets[widgetSection] = widgets
Settings.saveImmediate()
Logger.i("TrayMenu", "Added", itemName, "as favorite")
// Close the tray dropdown panel after pinning
if (root.screen) {
const panel = PanelService.getPanel("trayDropdownPanel", root.screen)
if (panel) {
if (panel)
panel.close()
}
}
}
function removeFromFavorites() {
if (!trayItem || widgetSection === "" || widgetIndex < 0) {
Logger.w("TrayMenu", "Cannot remove from favorites: missing tray item or widget info")
return
}
// Get the tray item name
const itemName = trayItem.tooltipTitle || trayItem.name || trayItem.id || ""
if (!itemName) {
Logger.w("TrayMenu", "Cannot remove from favorites: tray item has no name")
return
}
// Get current widget settings
var widgets = Settings.data.bar.widgets[widgetSection]
if (!widgets || widgetIndex >= widgets.length) {
Logger.w("TrayMenu", "Cannot remove from favorites: invalid widget index")
return
}
var widgetSettings = widgets[widgetIndex]
if (!widgetSettings || widgetSettings.id !== "Tray") {
Logger.w("TrayMenu", "Cannot remove from favorites: widget is not a Tray widget")
return
}
// Get current favorites list
var favorites = widgetSettings.favorites || []
// Remove from favorites
var newFavorites = []
for (var i = 0; i < favorites.length; i++) {
if (favorites[i] !== itemName) {
newFavorites.push(favorites[i])
}
}
// Update widget settings
var newSettings = Object.assign({}, widgetSettings)
newSettings.favorites = newFavorites
// Update settings
widgets[widgetIndex] = newSettings
Settings.data.bar.widgets[widgetSection] = widgets
Settings.saveImmediate()
Logger.i("TrayMenu", "Removed", itemName, "from favorites")
}
}
+63 -87
View File
@@ -151,11 +151,7 @@ Rectangle {
updateDebounceTimer.restart()
}
function onLoaded() {
// When the widget is fully initialized with its props set the screen for the trayMenu
if (trayMenu.item) {
trayMenu.item.screen = screen
}
function onLoaded() {// Widget initialization
}
Connections {
@@ -264,29 +260,17 @@ Rectangle {
return
}
if (modelData.hasMenu && modelData.menu && trayMenu.item) {
trayPanel.open()
// Position menu based on bar position
let menuX, menuY
if (barPosition === "left") {
// For left bar: position menu to the right of the bar
menuX = width + Style.marginM
menuY = 0
} else if (barPosition === "right") {
// For right bar: position menu to the left of the bar
menuX = -trayMenu.item.width - Style.marginM
menuY = 0
if (modelData.hasMenu && modelData.menu) {
const panel = PanelService.getPanel("trayMenu", root.screen)
if (panel) {
panel.menu = modelData.menu
panel.trayItem = modelData
panel.widgetSection = root.section
panel.widgetIndex = root.sectionWidgetIndex
panel.openAt(parent)
} else {
// For horizontal bars: center horizontally and position below
menuX = (width / 2) - (trayMenu.item.width / 2)
menuY = Style.barHeight
Logger.i("Tray", "TrayMenu not available")
}
trayMenu.item.menu = modelData.menu
trayMenu.item.trayItem = modelData
trayMenu.item.widgetSection = root.section
trayMenu.item.widgetIndex = root.sectionWidgetIndex
trayMenu.item.showAt(parent, menuX, menuY)
} else {
Logger.i("Tray", "No menu available for", modelData.id, "or trayMenu not set")
}
@@ -303,63 +287,63 @@ Rectangle {
}
// Dropdown opener - simple icon with hover effect
// Item {
// id: dropdownButton
// visible: dropdownItems.length > 0
// width: itemSize
// height: itemSize
Item {
id: dropdownButton
visible: dropdownItems.length > 0
width: itemSize
height: itemSize
// property bool hovered: false
property bool hovered: false
// NIcon {
// id: chevronIcon
// anchors.centerIn: parent
// icon: {
// if (barPosition === "top")
// return "caret-down"
// else if (barPosition === "bottom")
// return "caret-up"
// else if (barPosition === "left")
// return "caret-right"
// else if (barPosition === "right")
// return "caret-left"
// else
// return "caret-down" // default fallback
// }
// pointSize: Math.round(itemSize * 0.65)
// color: dropdownButton.hovered ? Color.mPrimary : Color.mOnSurface
NIcon {
id: chevronIcon
anchors.centerIn: parent
icon: {
if (barPosition === "top")
return "caret-down"
else if (barPosition === "bottom")
return "caret-up"
else if (barPosition === "left")
return "caret-right"
else if (barPosition === "right")
return "caret-left"
else
return "caret-down" // default fallback
}
pointSize: Math.round(itemSize * 0.65)
color: dropdownButton.hovered ? Color.mPrimary : Color.mOnSurface
// Behavior on color {
// ColorAnimation {
// duration: Style.animationFast
// easing.type: Easing.InOutQuad
// }
// }
// }
Behavior on color {
ColorAnimation {
duration: Style.animationFast
easing.type: Easing.InOutQuad
}
}
}
// MouseArea {
// anchors.fill: parent
// hoverEnabled: true
// cursorShape: Qt.PointingHandCursor
// onEntered: {
// dropdownButton.hovered = true
// TooltipService.show(Screen, dropdownButton, I18n.tr("tooltips.open-tray-dropdown"), BarService.getTooltipDirection())
// }
// onExited: {
// dropdownButton.hovered = false
// TooltipService.hide()
// }
// onClicked: {
// TooltipService.hideImmediately()
// const panel = PanelService.getPanel("trayDropdownPanel", root.screen)
// if (panel) {
// panel.widgetSection = root.section
// panel.widgetIndex = root.sectionWidgetIndex
// panel.toggle(dropdownButton)
// }
// }
// }
// }
MouseArea {
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onEntered: {
dropdownButton.hovered = true
TooltipService.show(Screen, dropdownButton, I18n.tr("tooltips.open-tray-dropdown"), BarService.getTooltipDirection())
}
onExited: {
dropdownButton.hovered = false
TooltipService.hide()
}
onClicked: {
TooltipService.hideImmediately()
const panel = PanelService.getPanel("trayDropdownPanel", root.screen)
if (panel) {
panel.widgetSection = root.section
panel.widgetIndex = root.sectionWidgetIndex
panel.toggle(dropdownButton)
}
}
}
}
}
PanelWindow {
@@ -378,9 +362,6 @@ Rectangle {
function close() {
visible = false
if (trayMenu.item) {
trayMenu.item.hideMenu()
}
}
// Clicking outside of the rectangle to close
@@ -388,10 +369,5 @@ Rectangle {
anchors.fill: parent
onClicked: trayPanel.close()
}
Loader {
id: trayMenu
source: "../Extras/TrayMenu.qml"
}
}
}
+12
View File
@@ -47,6 +47,11 @@ Item {
// Animation properties
property real animationProgress: 0
property bool isClosing: false
// Per-panel animation overrides
property bool disableScaleAnimation: false
property bool disableSlideAnimation: false
// If >= 0, use this pixel distance for slide instead of default
property int customSlideDistance: -1
// Keyboard event handlers - override these in specific panels to handle shortcuts
// These are called from NFullScreenWindow's centralized shortcuts
@@ -289,6 +294,11 @@ Item {
// Animation offset calculation
readonly property real slideOffset: {
if (root.disableSlideAnimation)
return 0
if (root.customSlideDistance >= 0) {
return (1 - root.animationProgress) * root.customSlideDistance
}
// Full slide for non-floating attached panels
if (isAttachedToNonFloating) {
var distance = (slideDirection === "left" || slideDirection === "right") ? width : height
@@ -305,6 +315,8 @@ Item {
// Animation properties
opacity: isAttachedToNonFloating ? Math.min(1, root.animationProgress * 5) : root.animationProgress
scale: {
if (root.disableScaleAnimation)
return 1
if (isAttachedToNonFloating)
return 1 // No scale for full slide animation
if (isAttachedToFloatingBar)
+8
View File
@@ -92,6 +92,11 @@ ShellRoot {
TrayDropdownPanel {}
}
Component {
id: trayMenuComponent
TrayMenu {}
}
Component {
id: calendarComponent
CalendarPanel {}
@@ -245,6 +250,9 @@ ShellRoot {
}, {
"id": "trayDropdownPanel",
"component": trayDropdownComponent
}, {
"id": "trayMenu",
"component": trayMenuComponent
}, {
"id": "calendarPanel",
"component": calendarComponent