initial refactor of Interactions.qml to add better support for touch screen gestures #114

Merged
zach merged 10 commits from feat/improved-gestures into main 2026-06-01 19:18:54 +02:00
2 changed files with 101 additions and 57 deletions
+100 -57
View File
@@ -2,20 +2,21 @@ import Quickshell
import QtQuick import QtQuick
import qs.Components import qs.Components
import qs.Config import qs.Config
import qs.Helpers
import qs.Modules as BarPopouts import qs.Modules as BarPopouts
CustomMouseArea { Item {
id: root id: root
required property Item bar required property Item bar
property bool dashboardShortcutActive property bool dashboardShortcutActive
property point dragStart
required property Drawing drawing required property Drawing drawing
required property DrawingInput input required property DrawingInput input
property bool osdShortcutActive property bool osdShortcutActive
required property Panels panels required property Panels panels
required property BarPopouts.Wrapper popouts required property BarPopouts.Wrapper popouts
required property ShellScreen screen required property ShellScreen screen
property bool singleGestureTriggered: false
property bool utilitiesShortcutActive property bool utilitiesShortcutActive
required property PersistentProperties visibilities required property PersistentProperties visibilities
@@ -52,78 +53,120 @@ CustomMouseArea {
} }
anchors.fill: parent anchors.fill: parent
cursorShape: (pressed && dragStart.y < bar.implicitHeight) ? Qt.ClosedHandCursor : undefined
hoverEnabled: true
propagateComposedEvents: false
onContainsMouseChanged: { DragHandler {
if (!containsMouse) { id: singleHandler
if (!osdShortcutActive) {
visibilities.osd = false; cursorShape: (active && centroid.pressPosition.y < root.bar.implicitHeight) ? Qt.ClosedHandCursor : undefined
root.panels.osd.hovered = false; dragThreshold: 0
grabPermissions: PointerHandler.CanTakeOverFromHandlersOfDifferentType | PointerHandler.ApprovesTakeOverByAnything
maximumPointCount: 1
minimumPointCount: 1
target: null
onActiveChanged: {
if (!active)
root.singleGestureTriggered = false;
}
onCentroidChanged: {
if (root.singleGestureTriggered)
return;
const x = centroid.position.x;
const y = centroid.position.y;
const dragX = x - centroid.pressPosition.x;
const dragY = y - centroid.pressPosition.y;
if (centroid.pressPosition.y < root.bar.implicitHeight) {
if (dragY > 20) {
root.visibilities.settings = true;
root.singleGestureTriggered = true;
} else if (dragY < -20) {
root.visibilities.settings = false;
root.singleGestureTriggered = true;
}
} }
if (!popouts.currentName.startsWith("traymenu")) { if (!Config.dock.hoverToReveal && centroid.pressPosition.y > root.screen.height - root.bar.implicitHeight)
popouts.hasCurrent = false; if (dragY < -10) {
root.visibilities.dock = true;
root.singleGestureTriggered = true;
}
if (centroid.pressPosition.x > root.screen.width - Config.barConfig.border && centroid.pressPosition.y < (root.screen.height / 2) && dragX < -20) {
root.visibilities.sidebar = true;
root.singleGestureTriggered = true;
} }
if (Config.barConfig.autoHide) if (centroid.pressPosition.x >= root.screen.width - Config.barConfig.border && centroid.pressPosition.y > (root.screen.height / 2) && dragX < -20) {
bar.isHovered = false; Hypr.dispatch(`hl.dsp.focus({ workspace = 'r+1', on_current_monitor = true })`);
root.singleGestureTriggered = true;
}
if (centroid.pressPosition.x <= Config.barConfig.border && dragX > 20) {
Hypr.dispatch(`hl.dsp.focus({ workspace = 'r-1', on_current_monitor = true })`);
root.singleGestureTriggered = true;
}
} }
} }
onPositionChanged: event => {
const x = event.x;
const y = event.y;
const dragX = x - dragStart.x;
const dragY = y - dragStart.y;
if (root.visibilities.isDrawing && !root.inLeftPanel(root.panels.drawing, x, y)) { HoverHandler {
root.input.z = 2; id: hoverHandler
root.panels.drawing.expanded = false;
}
if (!visibilities.bar && Config.barConfig.autoHide && y < bar.implicitHeight) onHoveredChanged: {
bar.isHovered = true; if (!hovered) {
if (!root.osdShortcutActive) {
root.visibilities.osd = false;
root.panels.osd.hovered = false;
}
if (pressed && dragStart.y < bar.implicitHeight) { if (!root.popouts.currentName.startsWith("traymenu")) {
if (dragY > 20) root.popouts.hasCurrent = false;
AramJonghu marked this conversation as resolved Outdated
Outdated
Review

Could this value also be a variable that takes a percentage of horizontal pixels on the display (or size of display eg a 14 inch display vs 24 inch).

Could this value also be a variable that takes a percentage of horizontal pixels on the display (or size of display eg a 14 inch display vs 24 inch).
Outdated
Review

Was it intentional to make this comment on line 89? Because then I don't really know what you mean, since that is deleted code.

Was it intentional to make this comment on line 89? Because then I don't really know what you mean, since that is deleted code.
Outdated
Review

Ah, yea you are right. Sunlight made it hard to see when I made the comment. Line 93 seems like the added relevant code.

I meant; how many pixels are needed in a swipe motion before it is recognized (if it is 20px)? My original comment speaks on that.

Ah, yea you are right. Sunlight made it hard to see when I made the comment. Line 93 seems like the added relevant code. I meant; how many pixels are needed in a swipe motion before it is recognized (if it is 20px)? My original comment speaks on that.
Outdated
Review

To add to this, I reread the original post. My question stands if this could be dynamic depending on display size for example.

To add to this, I reread the original post. My question stands if this could be dynamic depending on display size for example.
visibilities.settings = true; }
else if (dragY < -20)
visibilities.settings = false;
}
if (Config.dock.hoverToReveal && pressed && dragStart.y > root.screen.height - root.bar.implicitHeight) if (Config.barConfig.autoHide)
if (dragY < -10) root.bar.isHovered = false;
visibilities.dock = true;
if (panels.sidebar.width === 0) {
const showOsd = inRightPanel(panels.osdWrapper, x, y);
if (showOsd) {
osdShortcutActive = false;
root.panels.osd.hovered = true;
}
} else {
const outOfSidebar = x < width - panels.sidebar.width;
const showOsd = outOfSidebar && inRightPanel(panels.osdWrapper, x, y);
if (!osdShortcutActive) {
visibilities.osd = showOsd;
root.panels.osd.hovered = showOsd;
} else if (showOsd) {
osdShortcutActive = false;
root.panels.osd.hovered = true;
} }
} }
onPointChanged: {
const x = point.position.x;
const y = point.position.y;
if (Config.dock.enable && !Config.dock.hoverToReveal && !visibilities.dock && !visibilities.launcher && inBottomPanel(panels.dock, x, y)) if (root.visibilities.isDrawing && !root.inLeftPanel(root.panels.drawing, x, y)) {
visibilities.dock = true; root.input.z = 2;
root.panels.drawing.expanded = false;
}
if (y < root.bar.implicitHeight) { if (!root.visibilities.bar && Config.barConfig.autoHide && y < root.bar.implicitHeight)
root.bar.checkPopout(x); root.bar.isHovered = true;
if (root.panels.sidebar.width === 0) {
const showOsd = root.inRightPanel(root.panels.osdWrapper, x, y);
if (showOsd) {
root.osdShortcutActive = false;
root.panels.osd.hovered = true;
}
} else {
const outOfSidebar = x < root.width - root.panels.sidebar.width;
const showOsd = outOfSidebar && root.inRightPanel(root.panels.osdWrapper, x, y);
if (!root.osdShortcutActive) {
root.visibilities.osd = showOsd;
root.panels.osd.hovered = showOsd;
} else if (showOsd) {
root.osdShortcutActive = false;
root.panels.osd.hovered = true;
}
}
if (Config.dock.enable && Config.dock.hoverToReveal && !root.visibilities.dock && !root.visibilities.launcher && root.inBottomPanel(root.panels.dock, x, y))
root.visibilities.dock = true;
if (y < root.bar.implicitHeight)
root.bar.checkPopout(x);
} }
} }
onPressed: event => dragStart = Qt.point(event.x, event.y)
Connections { Connections {
function onDashboardChanged() { function onDashboardChanged() {
+1
View File
@@ -341,6 +341,7 @@ Variants {
anchors.fill: parent anchors.fill: parent
bar: bar bar: bar
drawing: drawingLoader.item drawing: drawingLoader.item
enabled: true
input: inputLoader.item input: inputLoader.item
panels: panels panels: panels
popouts: panels.popouts popouts: panels.popouts